与ASP.Net的WebAPI Angular.js $资源？ [英] Angular.js $resource with ASP.Net webapi?

问题描述

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

I have a simple ASP.Net WebAPI service that assigns a static variable on POST/PUT and returns the value on 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;
}

和我有一个像这样定义一个角资源：

And I have an angular-resource defined like so:

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（）工作正常，但 $保存（）抛出铬这个错误：

The get() works fine, but the $save() throws this error in chrome:

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

本的WebAPI已经启用了CORS（返回访问控制允许来源：* ）。我缺少什么？

推荐答案

对于一些CORS请求，浏览器发送一个额外的请求，一个叫做preflight要求，它发送该资源的实际请求之前。

For some CORS requests, the browser sends an additional request, called a "preflight request", before it sends the actual request for the resource.

在pre-飞行请求使用HTTP OPTIONS（405状态code）方法。它包括两个特殊的头：

The pre-flight request uses the HTTP OPTIONS (405 status code) method. It includes two special headers:

• 访问控制请求法：将用于HTTP方法
  实际的请求。


• 访问控制请求报头：请求列表
  头应用程序的实际要求设置。 （同样，这
  不包括的浏览器设置标头。）

即使你做了它CORS启用，它正在为 GET 要求，你告诉它显示 405 HTTP状态为 POST 请求。这是因为， POST，PUT，DELETE 要求不是安全的要求，他们首先将请求发送选项的要求，你有以该回应将需要hedaers如访问控制允许来源：* ，访问控制允许的方法：POST ，然后它会再次发送 POST 请求，它会工作吧。

Even if you had made it CORS enabled, and it is working for GET request and you have told it is showing 405 HTTP Status for POST request. This is because, POST,PUT,DELETE request are not safe request, they first send request OPTIONS request, you have to respond to that will required hedaers such as Access-Control-Allow-Origin: * , Access-Control-Allow-Methods: POST, and then it will again send POST request , and it will work then.

请确认你是什么人发送响应头。即为了取得成功 CORS POST 要求，ATLEAST你必须发送访问控制允许的方法：POST 随访问控制允许来源：*

Please verify what are the headers you are sending in response. i.e. To make successful CORS POST request, atleast you have to send Access-Control-Allow-Methods: POST along with Access-Control-Allow-Origin: *.

步骤使其CORS启用：

Steps to make it CORS enabled:

1. 安装此 - 使用的NuGet安装封装Microsoft.AspNet.WebApi.Cors


2. 打开文件App_Start / WebApiConfig.cs。以下code添加到WebApiConfig.Register方法​​。



3. 接下来，添加[EnableCors]属性的控制器类：

1. Install this - Install-Package Microsoft.AspNet.WebApi.Cors using NuGet
2. Open the file App_Start/WebApiConfig.cs. Add the following code to the WebApiConfig.Register method.

3. Next, add the [EnableCors] attribute to the Controller class:

通过以​​下PARAMS

With following params

[EnableCors（来源：您的网域，标题：*，方法：POST）]

[EnableCors(origins: "your_domain", headers: "*", methods: "POST")]

重新调整你的WebAPI项目。

Redeploy your WebAPI project.

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

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

这篇关于与ASP.Net的WebAPI Angular.js $资源？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！