MVC Web API 错误代码 SCRIPT7002答案

【问题标题】：MVC Web API Error Code SCRIPT7002MVC Web API 错误代码 SCRIPT7002
【发布时间】：2018-07-22 21:20:11
【问题描述】：

作为参考，我使用的是 Windows 10 和 Visual Studio 2017。

我有一个 MVC web api 和相应的 web 应用程序，带有登录功能。我只是尝试使用 IE 进行调试。每当我使用 GET 调用时，都会遇到以下错误： SCRIPT7002: XMLHttpRequest: Network Error 0x80070005, Access is denied.我已经配置并启用了 CORS，所以我完全不知道为什么这不起作用。

在我的 WebApiConfig 文件中，我有这个：

public static void Register(HttpConfiguration config)
    {
        // Web API configuration and services
        // Configure Web API to use only bearer token authentication.
        config.SuppressDefaultHostAuthentication();
        config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));

        // Web API routes
        config.MapHttpAttributeRoutes();

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

        config.EnableCors();
    }

然后在 Web.config 文件中我有这个：

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="http://localhost:53942" />
    <add name="Access-Control-Allow-Headers" value="Content-Type" />
    <add name="Access-Control-Allow-Methods" value="GET,POST,PUT,DELETE,OPTIONS" />
    <add name="Access-Control-Allow-Credentials" value="true" />
  </customHeaders>
</httpProtocol>

调用本身正在使用此代码进行：

var returnValue = [];
    console.log(localStorage.getItem('accessToken'));
    jQuery.support.cors = true;
    if (window.XMLHttpRequest) {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET", 'http://localhost:60690/api/ProfilePicture?Username=' + username, false);
        xmlhttp.setRequestHeader('Content-Type', 'application/json; charset=utf-8');
        xmlhttp.setRequestHeader('Authorization', 'Bearer ' + localStorage.getItem('accessToken'));
        xmlhttp.send();
        if (xmlhttp.status == 200) {
            returnValue = jQuery.parseJSON(xmlhttp.responseText);
        }
    }
    return returnValue;

同样，我只是在尝试调试。部署项目时，它们将位于同一个域中，因此 CORS 无关紧要。我错过了什么？

【问题讨论】：

您可以尝试将<add name="Access-Control-Allow-Origin" value="http://localhost:53942" /> 替换为<add name="Access-Control-Allow-Origin" value="*" />
@JimmyFL 我最初有，但显然你不能拥有和因为它们相互冲突。
您的 API 和 UI 项目在哪些端口上运行？
API 位于 localhost:60690，UI 位于 localhost:53942
通常您会在代码中配置 CORS，而不是通过自定义标头集合。还要确保删除删除 OPTIONS 请求的 HTTP 处理程序。在您的 API 配置文件中搜索 OPTIONSVerbHandler

标签： c# asp.net asp.net-mvc asp.net-web-api cors

【解决方案1】：

好吧，我终于想通了。这是我所做的：

在 Web.config 文件中删除 CustomHeader 部分。摆脱这一切。
发现另一个 StackOverflow 问题：CORS on OWIN and accessing /token causes 'Access-Control-Allow-Origin' error。具有讽刺意味的是，投票最多的答案是对我帮助最大的答案。我在 GrantResourceOwnerCredentials 类中添加了以下行：

context.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });
进入每个控制器并在顶部添加以下行：

[EnableCors(origins: "http://localhost:53942", headers: "", methods: "", SupportsCredentials = true)]

一旦我这样做了，它就开始工作了。

【讨论】：