带有 CORS 的 MVC 5 OAuth

Question

我读了几篇文章谈论一些类似的问题，但我还没有做到这一点。

我正在对“Account/ExternalLogin”执行 ajax，它会生成 ChallengeResult 并启动使用 OWIN 进行身份验证的流程。

这是我的

Startup

课程：

public partial class Startup
{
    // For more information on configuring authentication, please visit http://go.microsoft.com/fwlink/?LinkId=301864
    public void ConfigureAuth(IAppBuilder app)
    {            
        // Enable the application to use a cookie to store information for the signed in user
        app.UseCookieAuthentication(new CookieAuthenticationOptions
        {
            AuthenticationType = DefaultAuthenticationTypes.ApplicationCookie,
            LoginPath = new PathString("/Account/Login")
        });
        // Use a cookie to temporarily store information about a user logging in with a third party login provider
        app.UseExternalSignInCookie(DefaultAuthenticationTypes.ExternalCookie);

        app.UseCors(CorsOptions.AllowAll);
        var goath2 = new Microsoft.Owin.Security.Google.GoogleOAuth2AuthenticationOptions
        {
            ClientId = "myclientid",
            ClientSecret = "mysecret",
            Provider = new Microsoft.Owin.Security.Google.GoogleOAuth2AuthenticationProvider
            {
                OnApplyRedirect = context =>
                {
                    string redirect = context.RedirectUri;

                    const string Origin = "Origin";
                    const string AccessControlAllowOrigin = "Access-Control-Allow-Origin";

                    // origin is https://localhost:44301                        
                    var origin = context.Request.Headers.GetValues(Origin).First();


                    // header is present
                    var headerIsPresent = context.Response.Headers.ContainsKey(AccessControlAllowOrigin);
                    context.Response.Redirect(redirect);                        
                }
            }
        };

        app.UseGoogleAuthentication(goath2);
    }
}

我正在通过线路启用 CORS 支持

app.UserCors(CorsOptinos.AllowAll);

我知道标头已添加到响应中，因为我拦截了

OnApplyRedirect

事件，当我查找源时，它被设置为“localhost:443001”，并且标头“Access-Control-Allow-Origin”也被设置到这个值。

然而，当响应发送到客户端时，我出现以下错误：

XMLHttpRequest 无法加载 https://accounts.google.com/o/oauth2/auth?response_type=code&client_id=xxxxxxxxxxxxxxxxxxxxxxxxxxx 请求中不存在“Access-Control-Allow-Origin”标头 资源。因此不允许原点

https://localhost:44301

访问。

我在这里缺少什么。

我可以“手动”完成所有这些工作（直接从客户端请求谷歌...），但我真的想使用 OWIN 中间件。

Answer 1

您正在从

https://localhost:44301

域向 google 发出请求。为了使其正常工作，“Access-Control-Allow-Origin”应该在列表中具有

'https://localhost:44301'

源域。因此，在这种情况下，谷歌需要在“Access-Control-Allow-Origin”中设置此域。

查看您收到的响应，谷歌似乎不允许来自您的域的跨源请求。要解决这个问题，我相信您需要在谷歌上注册您的域名https://developers.google.com。

Answer 2

-> 请按照我的步骤操作:-

• 在您的应用程序中创建端点。在服务器端处理与 google 的身份验证流程。

• 在客户端向此端点发出 AJAX 请求到 Google 的 OAuth2 端点。

• 使用 OWIN 中间件在服务器端端点与 Google 进行身份验证流程，然后在完成身份验证后，将响应返回给客户端。

• 创建新端点：- AccountController：-

  [HttpGet]
  [Route("ExternalLogin")]
  public async Task<ActionResult> ExternalLogin()
  {
    var properties = new AuthenticationProperties
    {
        RedirectUri = Url.Action("ExternalLoginCallback")
    };
  
     return await Task.FromResult(Challenge(properties, "Google"));
   }
  
  [HttpGet]
  [Route("ExternalLoginCallback")]
  public async Task<ActionResult> ExternalLoginCallback()
  {
      // Handle the callback after successful authentication
     var loginInfo = await 
     AuthenticationManager.GetExternalLoginInfoAsync();
  
     // Process the loginInfo as needed and return response
     // You may redirect or return a JSON response indicating success
  
      return Json(new { success = true, loginInfo });
    }
  

• 更新 AJAX 请求新端点的 javascript 代码：-

      function initiateExternalLogin() {
        $.ajax({
        url: '/Account/ExternalLogin',
        type: 'GET',
        success: function(response) {
              // Handle success, if needed
              console.log(response);
          },
         error: function(xhr, status, error) {
         // Handle error, if needed
         console.error(xhr.responseText);
         }
        });
       }
  

• 请检查您的 Startup.cs 文件中是否正确设置了身份验证中间件。