Azure 上带有 React 和 IdentityServer 4 的 ASP.NET Core:Bearer error="invalid_token", error_desc

Posted

技术标签:

【中文标题】Azure 上带有 React 和 IdentityServer 4 的 ASP.NET Core:Bearer error="invalid_token", error_description="The issuer is invalid"【英文标题】:ASP.NET Core with React and IdentityServer 4 on Azure: Bearer error="invalid_token", error_description="The issuer is invalid" 【发布时间】:2022-01-10 08:07:19 【问题描述】:

我使用 ASP.NET Core with React.js Visual Studio 2022 模板创建了一个 .NET 6 应用程序。 然后我将 TypeScript 添加到客户端应用程序部分。我也在使用 IdentityServer 4。

这是我在 Startup.cs 中注册 IdentityServer 的方法:

services.AddIdentityServer()
                .AddAspNetIdentity<ApplicationUser>()
                .AddIdentityResources()
                .AddApiResources()
                .AddClients()
                .AddDeveloperSigningCredential();

这是我的IdentityServer 部分appsettings.json

"IdentityServer": 
    "Clients": 
      "MyApp.App": 
        "Profile": "IdentityServerSPA"
      
    
  

我有这个样本WeatherForecastController,它包含在模板中,上面带有[Authorize] 属性。

在本地一切正常,但是一旦我部署到 Azure(通过 BitBucket on-commit 部署),我就可以毫无问题地注册/登录到应用程序,但是在尝试访问授权路线时,我得到了 401 Unauthorized此消息出错:

Bearer error="invalid_token", error_description="The issuer 'https://myapp.azurewebsites.net' is invalid"

根据this question,我将应用的Azure URL 添加到appsettings.json

"IdentityServer": 
    "IssuerUri": "https://myapp.azurewebsites.net",
    "Clients": 
      "MyApp.App": 
        "Profile": "IdentityServerSPA"
      
    
  

但这并没有帮助。

然而,有帮助的是在代码中定义这个 URI:

services.AddIdentityServer(options =>
                
                    options.IssuerUri = "https://myapp.azurewebsites.net";
                )
                .AddAspNetIdentity<ApplicationUser>()
                .AddIdentityResources()
                .AddApiResources()
                .AddClients()
                .AddDeveloperSigningCredential();

但是,这似乎是一种代码异味。正如IdentityServer docs 所说:

建议不要设置此属性,它会根据客户端使用的主机名推断颁发者名称。

另外,这有点奇怪,因为在本地主机上开发时,我需要在本地更改 C# 中的这个 URI 以使一切正常工作。当然,我可以将它提取到appconfig.json,但我觉得它仍然需要它。

我不是很明白这个问题,所以我一直在寻找更多。

我发现了其他问题,建议将我的令牌(在授权失败时获得)粘贴到 https://jwt.ms/ 中,输出如下:


  "alg": "RS256",
  "kid": "7BEDB584D24C2C0D6619ED5C802A4EEF",
  "typ": "at+jwt"
.
  "nbf": 1638590243,
  "exp": 1638593843,
  "iss": "https://myapp.azurewebsites.net",
  "aud": "MyApp.AppAPI",
  "client_id": "MyApp.App",
  "sub": "d611ae4d12614a94aeac0399fac81b3b",
  "auth_time": 1638590237,
  "idp": "local",
  "jti": "648F96B7DA864DB28FB06540325310A6",
  "sid": "6187CB0CF53F3049062BD8B7728F6C68",
  "iat": 1638590243,
  "scope": [
    "MyApp.AppAPI",
    "openid",
    "profile"
  ],
  "amr": [
    "pwd"
  ]
.[Signature]

这里唯一让我感到惊讶的是这个MyApp.AppAPI - 我不知道这个AppAPI 是什么部分。我的 ASP.NET Core 解决方案或客户端应用程序中没有类似的东西。这是 Azure 特有的吗?也许这就是问题所在?

任何简单的英语帮助将不胜感激 - 我对 Azure 很陌生????

【问题讨论】:

【参考方案1】:

对于 Identity Server,我不是 100% 确定,但一般来说,您还需要在 Startup.cs 中添加身份验证

services.AddAuthentication(opt =>

    opt.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
    opt.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
)
.AddJwtBearer(opt =>

    opt.TokenValidationParameters = new()
    
        ValidateIssuer = true,
        ValidateAudience = true,
        ValidIssuer = "https://myapp.azurewebsites.net",
        ValidAudience = "https://myapp.azurewebsites.net"
     ;
 );

而ValidIssuer中的值显然需要与JWT中使用的issuer相匹配

【讨论】:

我正在为 IdentityServer 添加身份验证,但它更简单:services.AddAuthentication().AddIdentityServerJwt();正如我在原始帖子中所写,在 IdentityServer 的代码中添加 IssuerUri 可以完成这项工作,但我想知道这是否是正确的/需要的

以上是关于Azure 上带有 React 和 IdentityServer 4 的 ASP.NET Core:Bearer error="invalid_token", error_desc的主要内容,如果未能解决你的问题,请参考以下文章

Azure AD:带有 PKCE 的代码流:没有为应用程序启用 id_token

在 azure 上部署 React Web 应用程序的权限被拒绝

REACT 应用程序调用安全的 Azure WEBAPI 服务 - 没有用户

访问我的 React Web 应用程序的 Azure SQL 数据库

无法在 Azure App 服务上部署 React JS 应用程序

GCM 授权失败:在 Azure 网站上部署了带有 PushSharp 的 WebAPI