CORS 已启用但访问仍被拒绝

Question

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

我有一个 MVC webapi 项目，它使用 Visual Studio 提供的模板设计，帐户存储在 SQL 数据库中。 我有另一个项目，它是用户登录的网站本身。 我正在尝试在 VS 中进行调试，但是每当在初始登录之外发出 GET 请求时，都会遇到访问被拒绝错误消息。 我在 webapi 上启用了 CORS，但它似乎没有太大区别。

这是我启用 CORS 的方法。

在 WebAPIConfig 文件中，我有以下内容：

 public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.EnableCors();

        // 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 }
        );
    }
}

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

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <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>

这是来自网站的调用代码：

function getProfilePicture(username){
    var returnValue = [];

    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;
}

错误消息显示“SCRIPT7002：XMLHttpRequest：网络错误 0x80070005，访问被拒绝。”

我没有正确启用 CORS 吗？

更新

我下载了 Postman 试图找出问题所在。 我实际上能够使用 Postman 进行 GET 调用而不会出现任何错误。 它正在返回数据和一切。 我注意到的一件事是它看起来并没有真正发送 Authorization 标头。 Fiddler 中的数据中缺少它。

Answer 1

指定Access-Control-Allow-Credentials: true作为响应头与Access-Control-Allow-Origin: *不兼容。 如果要使用凭据，则必须使用Access-Control-Allow-Origin: <value-of-origin-request-header> 。