Angular.js $resource with ASP.Net webapi?

本文关键字：Net webapi ASP with js resource Angular | 更新日期: 2023-09-27 18:27:12

我有一个简单的ASP.Net WebAPI服务，它在POST/PUT上分配一个静态变量，并在GET:上返回值

private static State Repo = null;
public State Get()
{
    return Repo;
}
public void Post(State value)
{
    Repo = value;
}
public void Put(State value)
{
    Repo = value;
}

我有一个角度资源定义如下：

var stateService = angular.module('StateService', ['ngResource']);
stateService.factory('State', function ($resource) {
    return $resource('http://localhost:8080/API/State');
});

当我尝试这样做时：

State.get(function (state) {
    $scope.data = state.data !== undefined ? state.data : '[Not Set]';
    state.data = "newvalue";
    state.$save();
});

get()工作正常，但$save()在chrome:中抛出此错误

XMLHttpRequest cannot load http://localhost:8080/API/State. Invalid HTTP status code 405

webAPI已启用CORS（返回Access-Control-Allow-Origin: *）。我错过了什么？

Angular.js $resource with ASP.Net webapi?

对于一些CORS请求，浏览器在发送对资源的实际请求之前，会发送一个额外的请求，称为"preflight请求"。

飞行前请求使用HTTP OPTIONS（405状态代码）方法。它包括两个特殊的标题：

  • 访问控制请求方法：将用于实际请求
  • 访问控制请求标头：请求列表应用程序在实际请求上设置的头。（同样，这个不包括浏览器设置的标头。）

即使您已经启用了CORS，并且它正在为GET请求工作，并且您已经告诉它正在为POST请求显示405 HTTP Status。这是因为，POST,PUT,DELETE请求不是安全请求，他们首先发送请求OPTIONS请求，你必须响应Access-Control-Allow-Origin: *、Access-Control-Allow-Methods: POST等所需的Hedaer，然后它会再次发送POST请求，然后它就会工作。

请验证您发送的响应标头是什么。即要成功请求CORS POST，您至少必须将Access-Control-Allow-Methods: POST与Access-Control-Allow-Origin: *一起发送。

启用CORS的步骤：

  1. 安装此-使用NuGet安装包Microsoft.AspNet.WebApi.Cors
  2. 打开文件App_Start/WebApiConfig.cs。将以下代码添加到WebApiConfig.Register方法中

  3. 接下来，将[EnableCors]属性添加到Controller类：

    具有以下参数

    [EnableCors（原点："your_domain"，头："*"，方法："POST"）]

  4. 重新部署您的WebAPI项目。

来源-http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

更多链接-http://www.codeproject.com/Articles/742532/Using-Web-API-Individual-User-Account-plus-CORS-En

在Web.config上，在处注释行<remove name="OPTIONSVerbHandler" />

<system.webServer>
  <handlers>

如果您正在通过web.config文件使用CORS配置。

相关文章：