AngularJS 允许来源到 WebApi2答案

【问题标题】：AngularJS Allow-Origin to WebApi2AngularJS 允许来源到 WebApi2
【发布时间】：2014-05-24 18:11:00
【问题描述】：

我想将我的 API 托管在一个单独的域上。我已经将我的身份验证拦截器配置为带有承载的角度令牌：

config.headers.Authorization = 'Bearer ' + sessionStorage.getItem('token');

在我的 My WebApi2 中，我使用 cors 配置了 WebApiConfig。

var cors = new EnableCorsAttribute("http://mydomain.com", "*", "*");
config.EnableCors(cors);

在 API 的 web.config 中，我还包括：

<customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>

由于来源不允许，我仍然无法访问 api。我可以在 auth-interceptor 的标头中添加更多内容吗？或者我需要做什么？

【问题讨论】：

标签： angularjs asp.net-web-api2 same-origin-policy

【解决方案1】：

在 API 的 web.config 中，包含以下代码：

<system.webServer>    
    <httpProtocol>
          <customHeaders>
            <remove name="X-Powered-By" />
            <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
          </customHeaders>
        </httpProtocol>
 <handlers>
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <remove name="WebDAV" />
      <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>
     </system.webServer>

我希望这会有所帮助。

谢谢。

【讨论】：

【解决方案2】：

我之前也遇到过同样的问题，对我有用的是从 web.config 中删除设置并将配置设置保留在 WebApiConfig 类中

查看answer了解更多详情

【讨论】：

【解决方案3】：

您的 Angular.js 拦截器设置正常。我有一个与您的场景相同的公共项目，使用 OAuth+Owin 身份验证。我遵循的步骤是：

安装 Microsoft.Owin.Cors 库
创建自定义部分配置以启用/配置 CORS
custom CORS Policy class 的创建（要启用的来源）
Setup of CORS policy 取决于配置

希望对你有帮助

【讨论】：