IIS 7.5 does not support the Put method when using a combination of Type Script, Angular Js, and Web API, resulting in a

After writing a code using TypeScript and AngularJS, I encountered an issue while using the http.put method to send data to my web API. Instead of receiving the expected response from the Web API and populating the grid, I received a 405 Method Not Allowed error.

Attempts to resolve this problem by adjusting settings in IIS led to another issue - an HTTP Error 500.19 - Internal Server Error when trying to load the application after making changes. Even modifying the web config did not solve the initial problem.

The TypeScript + AngularJS Controller snippet is as follows:


var customerapp = angular.module('CustomerSearch');
module CustomerSearch.controllers
{
    export class CustomerCtrl {
        static $inject = ['$scope', '$http', '$templateCache'];
        debugger;
        constructor(protected $scope: ICustomerScope,
            protected $http: ng.IHttpService,
            protected $templateCache: ng.ITemplateCacheService) {
            $scope.search = this.search;
            console.log(angular.element($scope).scope());
        }
        public search = (search: any) => {
            debugger;
           var Search = {
                ActId: search.txtAct,
                checkActiveOnly: search.checkActiveOnly,
                checkParentsOnly: search.checkParentsOnly,
                listCustomerType: search.listCustomerType
            };

            this.$scope.customer = [];
            this.$scope.ticket = [];
            this.$scope.services = [];


            this.$http.put('/API/Search/Search', Search).
                success((data, status, headers, config) => {
                debugger;
                this.$scope.cust_File = data[0].customers;
                this.$scope.ticket_file = data[0].tickets;
                this.$scope.service_file = data[0].services;
            }).
                error((data, status) => {
                debugger;
                console.log("Request Failed");
                alert(status);
                });

        }
    }
    var customerapp = angular.module("CustomerSearch", []);
    customerapp.controller('CustomerCtrl', CustomerSearch.controllers.CustomerCtrl);
}

This is the relevant snippet of the Web API:

   [AllowAnonymous]
    [HttpPut]
    public HttpResponseMessage PutDoSearch(searchItem value)
    {
      //...Definitions
    }

Answer №1

It appears that the presence of WebDAV might be causing some interference with your request. If you're not actively using it, it would be best to disable it in order to carry out PUT requests for your Web API.

To accomplish this, you can modify your web.config file as follows:

<system.webServer>
    /* ... */
    <modules>
        <remove name="WebDAVModule" />
    </modules>
    <handlers>
        <remove name="WebDAV" />
    </handlers>
    <security>
        <requestFiltering>
            <verbs allowUnlisted="false">
                <add verb="GET" allowed="true" />
                <add verb="POST" allowed="true" />
                <add verb="DELETE" allowed="true" />
                <add verb="PUT" allowed="true" />
            </verbs>
        </requestFiltering>
    </security>
<system.webServer>

If you wish, you can also choose to completely eliminate the WebDAV feature by going through these steps:

  1. Access Control Panel
  2. Select "Uninstall Program"
  3. Click on "Turn Windows features on or off"
  4. Navigate to IIS
  5. Find and open "World Wide Web Services"
  6. Look for "Common HTTP feautre"
  7. Disable "WebDAV Publishing"

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

retrieve a function from a Firestore service

Is there a way to utilize a function from a service within a component? I am attempting to use the following code: addProyecto(proyecto: Proyecto) { this.proyectosCollection.add(this.proyecto); } However, I am encountering this error message: TypeEr ...

How does Spring Security CSRF Protection operate?

I recently came across a useful SO example that emphasized the importance of including a unique token in the URL when posting data. This method prevents unauthorized access, as URLs lacking the unique token, like http://example.com/vote/30, would be inval ...

Is it possible for TypeScript to preserve the return type while consolidating multiple classes or objects of functions in a reducer method?

Describing my issue with the title was challenging, but here it is: I have several objects that follow this structure: type TUtilityFunction = {[key: string]: <T>(a: T, b: any) => T} For example: class UtilityA{ DoSomeWork = function (arg1: So ...

Most effective method for sending an HTTP Post request with a JSON body in Angular 9

Hi there, I'm currently working on a project that requires saving information from 3 text box fields. I've been struggling to figure out how to make a POST request with a JSON body. Here's what I have so far: I've been piecing together ...

Angular directive failed to correctly retrieve object

I have a person object loaded from the backend that is structured as follows: { "PersonId":"19894711-2eb9-4edf-92c6-85de2b33d1bb", "Firstname":"Jacky", "Lastname":"Chan", "DateOfBirth":"1963-09-18T00:00:00", "CreateDate":"2015-12-11T09 ...

What is the reason for including the module name twice in the creation process of an Angular app?

var appDemo = angular.module( 'appDemo', [] ); What rationale led the angular team to opt for the syntax: var appDemo = angular.module ([]); instead of the former method? ...

AngularJS - Controller not recognizing state name parameter

I'm a newcomer to angular and struggling to understand why this specific issue is occurring. Interestingly, when I use {{$state.current.name}} in my view, everything works as expected. However, the problem arises when I attempt to pass it to my contr ...

Utilizing TS2722 alongside restrictive parameters in tsconfig

I have encountered these errors due to the presence of the strictNullChecks parameter, which is activated by the strict configuration in the tsconfig.json file. It appears that when arguments.length === 2, the ab function should be available (thanks to Fun ...

I am having trouble making an HTTP GET call to my API using AngularJS

I'm currently working on a Web Application and have encountered an issue with making HTTP GET calls from Angular to my API. The strange thing is that I've tested my API in both the browser and Postman (using Chrome) and it works perfectly fine. T ...

Encountered an issue with fs.open where a non-literal argument was used at index 0 while utilizing a url

Attempting to achieve something similar in TypeScript: window.open(`https://somelink/certificate/${regNumber}?registrationNumber=${type}`); where the values of regNumber and type are constantly changing. ESLint is reporting an issue: Received fs.open with ...

When a Typescript object contains a key without a corresponding value, what is its significance?

In my experience, I've come across typescript objects that are defined in the following way: const MyObj = { myVar1, name1: myVar2 } Can someone explain the purpose of this object? I know that there is a key-value ...

No new entry was added to the Table view

Greetings, I am a newcomer to Angular-Js, and I am attempting to display a table view with the ability to add new records. However, I am encountering an issue where the data is not being inserted when trying to add a new record. Below is my code. Could so ...

Is it possible for AngularJS components to alter their enclosing element?

I see Angular components as element directives. Take a component named hero, for example, I can include it in the parent template like so: <hero myparam="something"></hero> What I envision is using the hero element as a container managed by t ...

Navigating through Array Elements with ngFor and the Next Button

Just diving into the world of Ionic 3 - I'm interested in using ngFor to loop through an array. So far, I've managed to display one item at a time using the slice method. Now, I want to be able to move on to the next item in the array when the us ...

Button ng-click with identical function parameters

I am facing an issue with two buttons that have the same ng-click but different parameters. <label class="item item-input"> <button ng-click="takePicture(true)">Save Settings</button> <button ng-click="takePicture(false)">Choos ...

javascript functions failing to execute once the page has finished loading

I am new to front-end development and I've started using AngularJs for my project. I have set up routes and controllers within a module, which are then referenced in the HTML page. The controller's task is to display a carousel inside an ng-view ...

Working with npm in a Meteor 1.3 and angular1 environment (upgraded!)

Note: I am continuously revising this question as I make progress. Updates will be ongoing. After successfully upgrading my angular-meteor project (Meteor 1.2.1 + jade + ES6 js) to version 1.3, everything continues to work smoothly. Now, I am interested ...

Using Typescript to intersect and define default props in React components

https://i.sstatic.net/Rw3e9.png Is it viable to utilize intersection in order to avoid explicitly listing every type of defaultProps, but rather derive it from a declared variable? My code example shows that even though myProp is declared as nullable, it ...

Rendering an Angular HTML page with Koa.js

Recently, I decided to switch from using express to Koa.js for my node.js projects. While in express we typically use the render function to retrieve HTML pages, in Koa.js, things work a bit differently. I attempted to access an Angular HTML page from Ko ...

I encountered an issue with my autocomplete feature in Angular TypeScript where it was returning a [object Object] value

Issue with autocomplete displaying [object Object] value in Angular TypeScript I'm having trouble pinpointing the exact problem HTML snippet <mat-form-field style="margin-right: 10px;"> <input #productName matInput placeholder="Product" ...