启用CORS的Web Api 2 facebook身份验证

Question

我尝试使用Angular JS为我的前端实现内置外部身份验证的Web Api 2。我已经使用以下行启用了cors：

app.UseCors（CorsOptions.AllowAll）;

我使用此api调用成功加载外部登录，就像在SPA模板中一样 - api / Account / ExternalLogins？returnUrl =％2F＆amp; generateState = true

当用户点击调用此api

的按钮时，我会使用响应中的URL

  

HTP：//本地主机：31683 / API /帐户/ ExternalLogin＆GT;提供商= Facebook和安培; RESPONSE_TYPE =令牌安培; CLIENT_ID =自我＆安培; REDIRECT_URI = HTTP％3A％2F％2Flocalhost％3A＆GT; 31683％2F＆安培;状态= EqHaUDzzuXZcVSk7IC_gWkgF5P_TNTdIHn1Tqbv18CM1

正如预期的那样，User.Identity.IsAuthenticated尚未经过身份验证，因此它会返回ChallengeResults（与SPA模板完全相同），应将用户重定向到facebook登录页面。这就是我的问题所在.Fiddler的响应看起来不错，它有重定向到facebook登录页面的位置响应标题。但是，当它尝试进行重定向时，我收到以下CORS错误：

否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。起源＆＃39; null＆＃39;因此不允许访问。

好像我对facebook登录的重定向请求有一个带有空值的Origin标头。我相信这个Origin标头是为什么它寻找facebook不能给出的AllowCors响应。我不确定为什么Origin标头在重定向请求上，或者甚至是问题。

以下是对我的api / Account / ExternalLogin api的api调用以及重定向调用的chrome响应的屏幕截图。

我的ExternalLogin回复：

facebook重定向响应。这就是我相信的问题所在。请注意请求上的原始标题

非常感谢任何帮助。我已经浪费了很多时间。感谢。

Answer 1

这不是你问题的答案，但是，我认为这可能对你有所帮助。

我尝试使用ASP.NET MVC 5时有类似（或相同）的问题。

当没有使用CORS时，你所描述的过程就像一个魅力。我也在使用它。太棒了！有用。使用CORS IS 时会出现问题。

经过2天的痛苦和痛苦，我从W3C找到了关于CORS的规范。在阅读之后，我的结论是，遗憾的是很难做到这一点。请查看section 6.2和section 7.1。

我的解决方案

在这个具体行动中，我使用的是JSONP。没有服务器端修改，没有额外的代码，没有更多的痛苦！我只需要更改一些角度代码。

到此

$http.jsonp('http://localhost:56278/register/appregister?provider=Facebook&?callback=JSON_CALLBACK');

从此

$http({ url: 'http://localhost:56278/register/appregister', method: 'GET', params: { provider: provider } });

已发现的回复

Answer 2

在调用“api / Account / ExternalLogins？returnUrl =％2F＆amp; generateState = true”后，返回的提供者对象都有一个你需要发出标准GET请求的URL。（不是AJAX请求）

//Iterate through result and pick the correct provider.name
results = results.filter(function(item){
  return item.name === 'Facebook';
});

if(results && results[0])
{
  var provider = results[0]
  
  //INCORRECT
  //$http({
  //method:'GET',
  //url: provider.url
  //});
  
  //CORRECT
   window.location.href = provider.url; 
}