如何启用 CORS？断绝？ Javascript？在哪里？

Question

现在我正在 locahost:3333 上测试我的 reactjs 网站，在 localhost:54690.

上测试我的 asp.net 网站 api 2

我正在为我的 ajax 使用 axios，但是当我发出请求时出现错误。

XMLHttpRequest cannot load http://localhost:54690/api/Storage/Get. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3333' is therefore not allowed access. The response had HTTP status code 500.

我尝试添加 Cors，但我猜我做的不对。我尝试了服务器端和客户端。

   var instance = axios.create({
            baseURL: 'http://localhost:54690/api',
            timeout: 1000,
            headers: { 'Access-Control-Allow-Origin': '*' }
        });

        instance.get('/Storage/Get')
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });

服务器端

[EnableCors(origins: "http://localhost:3333/", headers: "*", methods: "*")]
public class StorageController : ApiController

WebapiConfig.

  public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            config.Filters.Add(new EnableQueryAttribute());

            // Web API configuration and services

            // Web API routes
            config.MapHttpAttributeRoutes();

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

            config.EnableCors();
        }
    }

编辑

好像我这样做的时候

[EnableCors(来源：“”，headers：“”，方法：“*”)]

有效。我什至不需要为我的 ajax 在我的 header 中添加任何东西。虽然这不是真正的灵魂，因为我不希望这种情况发生在我猜的生产中？

还有我可以设置 cors 的全局函数吗？把它放在每个控制器上有点糟糕。

编辑 2

从@kormali_2 进一步了解 link 我发现问题可能是因为我有“http://locahost:3333/" where it should be "http://locahost:3333”，还有一个我可以使用的全局选项。

Answer 1

试试这个：

    var instance = axios.create({
        baseURL: 'http://localhost:54690/api',
        timeout: 1000,
        headers: { 
         'Accept': 'application/json',
         'Content-Type': 'application/json',
         'Access-Control-Allow-Origin': '*'
        }
    });

Answer 2

您可以通过以下方式全局启用 CORS：

// Enable CORS globally for any host
var corsAttr = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(corsAttr);

要仅为您使用的特定主机启用它：

// Enable CORS globally for specific host
var corsAttr = new EnableCorsAttribute("http://localhost:3333", "*", "*");
config.EnableCors(corsAttr);

更多信息请见http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api#enable-cors

如何启用 CORS？断绝？ Javascript？在哪里？

How to enable CORS? Sever? Javascript? where?

javascript

ajax

cors

asp.net-web-api

axios