401从角度访问webapi时未经授权的错误

Question

我需要在访问我的webapi应用时捕获用户的域\用户名.在我的开发机器上,我有我的webapi localhost:10570和我的angularjs网站,它打电话给网络服务localhost:34575.

如果我直接拨打我的webapi应用程序,一切正常.我可以看到用户域和用户名,服务将请求的数据作为JSON返回.但是如果我访问我的angularjs网站并且angular会调用webapi,那么每次针对该服务的呼叫都会获得401未授权.

在我的WebApi应用程序的web.config中,我有:

<system.web>
    <compilation debug="true" targetFramework="4.5.2" />
    <httpRuntime targetFramework="4.5.2" />
    <authentication mode="Windows" />
  </system.web>
  <system.webServer>
    <httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="http://localhost:34575" />
    <add name="Access-Control-Allow-Methods" value="POST, PUT, DELETE, GET, OPTIONS" />
    <add name="Access-Control-Allow-Headers" value="content-Type, accept, origin, X-Requested-With, Authorization, name" />
    <add name="Access-Control-Allow-Credentials" value="true" />
  </customHeaders>
</system.webServer>

我在IIS Express for Visual Studio 2015的applicationhost.config文件中有这个:

<location path="MyNamespace.WebAPI">
    <system.webServer>
        <security>
            <authentication>
                <windowsAuthentication enabled="true" />
                <anonymousAuthentication enabled="false" />
            </authentication>
        </security>
    </system.webServer>
</location>

我的angularjs站点是"MyNamespace.Client"中同一解决方案的一部分.

为什么直接访问Web服务工作正常,但通过角度应用程序访问它失败？

Answer 1

我没有意识到你必须告诉Angular将你的凭据发送到服务器.我只需要更改我的API调用:

$http.get(url);

至

$http.get(url, { withCredentials: true });