使用OpenID Connect(aws cognito)，我如何避免CORS问题

Question

我正在使用vue.js与.NET Core Web API一起设置网页。前端和后端完全分开。

我已经配置了我的API以使用AWS Cognito中的"授权代码授予"的OpenID连接进行身份验证，如下所示：

services.AddAuthentication(options =>
        {
            options.DefaultScheme = CookieAuthenticationDefaults.AuthenticationScheme;
            options.DefaultChallengeScheme = OpenIdConnectDefaults.AuthenticationScheme;
        })
        .AddCookie()
        .AddOpenIdConnect(options =>
        {
            options.SignInScheme = CookieAuthenticationDefaults.AuthenticationScheme;
            options.ResponseType = OpenIdConnectResponseType.Code;
            options.MetadataAddress = cognitoSettings.AuthorityUrl;
            options.ClientId = cognitoSettings.ClientId;
            options.SaveTokens = false;
            options.TokenValidationParameters = new TokenValidationParameters
            {
                ValidateIssuer = true
            };
        });

当我从[授权]控制器请求数据时，这在浏览器中正常工作，我会重定向到Cognito登录页面，并且在输入凭据后，我可以看到授权的数据。

。

但是，如果我在我的vue-app中使用ajax(axios(请求相同的资源，则后端返回302，而由于交叉原始策略，Ajax调用失败。(因为Cognito登录与我的后端不同(

所以我的问题是：如何使这种情况有效？

• 我需要将OpenID身份验证移至我的前端 为了进行这项工作，让后端仅使用携带者令牌 授权？但是然后我需要所有的OpenID信息，例如名称或 电子邮件地址在后端，而不是在我的vue应用中。那我该如何得到它们？

• 是否可以将响应代码从302更改为401 前端可以对未经授权的呼叫做出反应并重定向用户？ 但是我从哪里获得登录网址，因为所有配置(client_id，metadataDress(是 在我的后端配置。

Answer 1

为您提供几个指针：*您的API不应使用OpenID Connect-它应该仅验证访问令牌*您的水疗中心应使用JavaScript库实现打开ID连接

我在博客上使用此架构有一个cognito示例UI - 您可以登录到 - 请参阅此链接：https://authguidance.com/home/code-samples-quickstart/

博客上有一些相关的写入和代码样本 - 也许请参见第一个水疗样本和.NET Core Sample