0

现在我正在 locahost:3333 上测试我的 reactjs 站点，在 localhost:54690 上测试我的 asp.net web api 2。

我正在为我的 ajax 使用axios，但是当我发出请求时，我得到了一个错误。

XMLHttpRequest 无法加载http://localhost:54690/api/Storage/Get。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问源“ http://localhost:3333 ”。响应的 HTTP 状态代码为 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

Webapi 配置。

  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（来源：“ ”，标题：“ ”，方法：“*”）]

有用。我什至不需要在我的 ajax 标题中添加任何内容。虽然这不是一个真正的灵魂，因为我不希望这发生在我猜的生产中？

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

编辑 2

更多地查看来自@kormali_2 的链接我发现问题可能是因为我有“ http://locahost:3333/ ”它应该是“ http://locahost:3333 ”还有一个全局选项我可以使用.

4

2 回答 2

0

您可以使用以下命令全局启用 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

于 2016-08-19T20:07:47.530 回答
-1

尝试这个：

    var instance = axios.create({
        baseURL: 'http://localhost:54690/api',
        timeout: 1000,
        headers: { 
         'Accept': 'application/json',
         'Content-Type': 'application/json',
         'Access-Control-Allow-Origin': '*'
        }
    });
于 2016-08-19T18:22:43.230 回答