Question

我知道这是一个老问题，我已经阅读了很多关于它的文章，最后到达了这里。没有身份验证，没有[System.Web.Mvc.Authorize]），所有事情都可以正常工作：

api控制器：

using System.Web.Http;
using System.Web.Mvc;

namespace WebApi.Controllers
{
    [System.Web.Mvc.Authorize]
    public class ProductsController : ApiController
    {
        public IEnumerable<string> GetAllNames()
        {
            return new List<string> {"abc", "def", User.Identity.Name};
        }

        public string GetName(string name)
        {
            return name;
        }
    }
}

的Web.Config 添加了四行以支持CORS。

  <system.webServer>
    <validation validateIntegratedModeConfiguration="false" />
    <modules>
      <remove name="WebDAVModule"/><!-- ADD THIS to enable POST/DELETE -->
    </modules>
    <handlers>
      <remove name="WebDAV" /><!-- ADD THIS to enable POST/DELETE -->
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
    </handlers>
    <httpProtocol>
      <customHeaders>
        <clear />
        <!-- Adding the following custom HttpHeaders will help prevent CORS from stopping the Request-->
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>

但是当[授权]被添加到api控制器时，一切都会出错。

这是api的页面调用，我从网上读到最多7个解决方案，如果其中任何一个工作，它将是一本教科书。许多人说“这对我有用”，但对我来说没有。

我评论了标题下的所有解决方案，并记录了它造成的错误。

        var host = 'http://localhost:54364/api/products/';
        userName = "name@domain.com";
        password = "password";
        $(document).ready(function () {
            //Solution 1: OPTIONS http://localhost:54364/api/products/GetAllNames?name=someone 405 (Method Not Allowed) / http://localhost:54364/api/products/GetAllNames?name=someone. Invalid HTTP status code 405  
            //$.ajaxSetup({
            //    headers: {
            //        'Authorization': "Basic " + btoa("cheny@cheny.com" + ":" + "nodenode")
            //    }
            //});
            $.ajax({
                type: "GET",
                url: host + "GetAllNames",
                dataType: 'json',
                //Solution 2: Ok, but User.Identity.UserName returns "", an empty string; I think it does not work at all.
                //username: userName,
                //password: password,
                async: false,
                //Solution 3: GET http://localhost:54364/api/products/GetAllNames?name=someone 405 (Method Not Allowed) / OPTIONS http://localhost:54364/api/products/GetAllNames?name=someone 405 (Method Not Allowed) / XMLHttpRequest cannot load http://localhost:54364/api/products/GetAllNames?name=someone. Invalid HTTP status code 405
                //headers: { "Authorization": btoa("Basic " + userName + ":" + password) },
                //Solution 4: XMLHttpRequest cannot load http://localhost:54364/api/products/GetAllNames. Wildcards cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:64710' is therefore not allowed access.
                //xhrFields: {
                //    withCredentials: true
                //},
                beforeSend: function (xhr) {
                    //Solution 5: Same with solution 2.
                    //xhr.withCredentials = true;
                    //Solution 6: OPTIONS http://localhost:54364/api/products/GetAllNames?name=someone 405 (Method Not Allowed) / OPTIONS http://localhost:54364/api/products/GetAllNames?name=someone 405 (Method Not Allowed)  / XMLHttpRequest cannot load http://localhost:54364/api/products/GetAllNames?name=someone. Invalid HTTP status code 405 
                    //xhr.setRequestHeader("Authorization", "Basic " + btoa(userName + ":" + password));
                    //Solution 7 ( 5 + 6 ): same with solution 6.
                },
                crossDomain: true,
                success:
                    function(data) {
                        // On success, 'data' contains a list of products.
                        $.each(data, function(key, item) {
                            // Add a list item for the product.
                            $('<li>', { text: formatItem(item) }).appendTo($('#ajax'));
                        });
                    }
            });

使用ajax和web api（只有2天的经验），我想我可能会错过一些东西，例如，解决方案4没有用户名/密码信息，它怎么可能有效？

提前致谢，欢迎任何评论。

Answer 1

问题出在您的回复的Access-Control-Allow-Origin标题中。如果您使用身份验证，则无法使用通配符*。您需要明确设置域。

如果您想使用withCredentials: true，那么您的服务器必须将额外标题Access-Control-Allow-Credentials设置为true

Access-Control-Allow-Credentials: true

Web API的跨域身份验证

1 个答案: