c# - 如何在 AngularJS + Web Api 2 中发送跨源请求的自定义标头？

问题描述

我有一个 Web Api 2 项目：

[AuthorizeUser]
public class ValuesController : ApiController
{
    [Route("api/value/get")]
    [HttpPost]
    public IHttpActionResult Get()
    {
        return Ok("Hello world!");
    }
}

并在 WebApiConfig.cs 中配置

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        // Web API configuration and services
        var cors = new EnableCorsAttribute("*", "*", "*");
        config.EnableCors(cors);

        // Web API routes
        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );
    }
}

来自客户端 AngularJS 的请求：

$scope.getvalue = function () {
            var url = "http://localhost:59073/api/value/get";
            $http({
                method: "POST",
                url: url,
                header: {
                    'x-access-token': 'abc'
                }
            }).then(function onSuccess(res) {
                console.log(res);
            }).then(function onError(err) {
                console.log(res);
            });
        }

但是我无法在服务器端获取 POST 请求标头的自定义标头“x-access-token”。而且我在 Chrome 的网络选项卡中也没有看到任何 OPTIONS 请求。

标签： c#angularjscorsasp.net-web-api2

我知道这为时已晚。它将帮助遇到同样问题的人。在您的示例中，您为 header 属性分配了一个对象。我认为这是一个错字。它应该是标题而不是标题。

var req = {
   method: 'POST',
   url: 'http://example.com',
   headers: {
      'Content-Type':'x-access-token': 'abc'
   },
   data: { test: 'test' }
}

$http(req).then(function(){...}, function(){...});

请参考Angular1.x的官方文档

https://docs.angularjs.org/api/ng/service/ $http#setting-http-headers

c# - 如何在 AngularJS + Web Api 2 中发送跨源请求的自定义标头？

问题描述

解决方案

推荐阅读