javascript - Angular $http 到 Web Api 给出 XMLHttpRequest 错误 - 请求的资源上不存在 'Access-Control-Allow-Origin' header

Question

我已经阅读了许多有关 Angular $http 数据服务调用另一个应用程序 Web Api 的问题和答案。是的，我看到有些人说允许“Postman”进入的原因是因为它像第 3 方外部应用程序等。

过去我确实可以控制安装 CORS 等的 Web Api。

但是，我认为有些事情是可能的，因为几个 stackoverflow 问题和答案确实有给我希望的答案

这是错误

XMLHttpRequest 无法加载 http://localhost:60127/api/Product/。请求的资源上不存在“Access-Control-Allow-Origin” header 。因此，不允许访问源“http://localhost:60128”。

使用 Web Api 代码的项目

 public class ProductController : ApiController
 {
    // GET api/<controller>
    public IHttpActionResult Get() {
    IHttpActionResult ret = null;
    // ....
 }

Web api 的 URL(与 Postman 配合使用) http://localhost:60127/api/Product/

Angular 代码

function productList() {
            //http://localhost:60127/api/Product/
            //dataService.get("/api/Product")
            dataService.get("http://localhost:60127/api/Product/")
                .then(function (result) {
                    vm.products = result.data;    // result is an http status
                    debugger;   // stop to see the code 
                },
                function (error) {
                    handleException(Error);

                });

        }

Answer 1

在 WebAPiConfig 类中，您需要在注册 WebAPiConfig 时启用 Cors

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.MapHttpAttributeRoutes();
        config.EnableCors(new System.Web.Http.Cors.EnableCorsAttribute("*", "*", "*"));

    }
}