使用 Blazor Web Assembly 和 Identity Server 4 登录错误

Question

我遵循了微软的 Blazor WebAssembly 独立应用教程。我正在使用 Identity Server 4 及其安装的 UI 用于登录等，并且能够查看众所周知的页面。我假设我已经准备好从 blazor 应用程序进行标准登录的所有内容，但我从未进入 Identity Server 的登录页面。相反，当我点击登录 link:

时，Blazor 应用程序 returns 显示此错误消息

There was an error trying to log you in: 'Invalid response Content-Type: text/html, from URL: https:login.microsoftonline.com/.well-known/openid-configuration'

我不确定为什么会这样，我也不知道为什么 url 指向 microsoftonline.com。我觉得我在这里错过了一个明显的步骤。我错过了什么？

Blazor 启动设置：

{
  "iisSettings": {
    "windowsAuthentication": false,
    "anonymousAuthentication": true,
    "iisExpress": {
      "applicationUrl": "http://localhost:59723",
      "sslPort": 44398
    }
  },
  "profiles": {
    "IIS Express": {
      "commandName": "IISExpress",
      "launchBrowser": true,
      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    },
    "ClientBlazor": {
      "commandName": "Project",
      "launchBrowser": true,
      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
      "applicationUrl": "https://localhost:5003",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
  }
}

Blazor 应用程序设置：

{
  "Local": {
    "Authority": "https://localhost:5001",
    "ClientId": "BlazorClient",
    "DefaultScopes": [
      "openid",
      "profile"
    ],
    "PostLogoutRedirectUri": "/",
    "ResponseType":  "code"
  }
}

Blazor 主要方法：

public static async Task Main(string[] args)
        {
            var builder = WebAssemblyHostBuilder.CreateDefault(args);
            builder.RootComponents.Add<App>("app");

            builder.Services.AddTransient(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });

            builder.Services.AddOidcAuthentication(options =>
            {
                // Configure your authentication provider options here.
                // For more information, see https://aka.ms/blazor-standalone-auth
                builder.Configuration.Bind("Local", options.ProviderOptions);
            });

            await builder.Build().RunAsync();
        }

身份服务器启动设置：

{
  "profiles": {
    "SelfHost": {
      "commandName": "Project",
      "launchBrowser": true,
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      },
      "applicationUrl": "https://localhost:5001"
    }
  }
}

身份服务器配置：

public static IEnumerable<Client> Clients =>
            new List<Client>
            {
                // SPA client using code flow + pkce
                new Client
                {
                    ClientId = "BlazorClient",
                    ClientName = "Blazor Client",
                    ClientUri = "https://loclhost:5003/",

                    AllowedGrantTypes = GrantTypes.Code,
                    RequirePkce = true,
                    RequireClientSecret = false,

                    RedirectUris =
                    {
                        "https://localhost:5003/authentication/login-callback"
                    },

                    PostLogoutRedirectUris = { "http://localhost:5003/" },
                    AllowedCorsOrigins = { "http://localhost:5003" },

                    AllowedScopes = { "openid", "profile" },
                    Enabled = true
                }
            };

Answer 1

您忘记在 OIDC 设置中提供登录重定向 URI：

{
  "Local": {
    "Authority": "https://localhost:5001",
    "ClientId": "BlazorClient",
    "DefaultScopes": [
      "openid",
      "profile"
    ],
    "PostLogoutRedirectUri": "https://localhost:5003/",
    "RedirectUri": "https://localhost:5003/authentication/login-callback",
    "ResponseType":  "code"
  }
}

PostLogoutRedirectUri 也应该是绝对 URI。

Answer 2

解决方案相当简单，但我不确定为什么当我完全按照微软的教程进行操作时。基本上它涉及将 appsettings.json 中的“本地”名称更改为“oidc”。我不知道这是 camel/pascal 案例还是什么。

appsettings.json:

{
  "oidc": {
    "Authority": "https://localhost:5001/",
    "ClientId": "SedduoBlazorClient",
    "DefaultScopes": [
      "openid",
      "profile"
    ],
    "PostLogoutRedirectUri": "/",
    "RedirectUri":  "https://localhost:5003/authentication/login-callback",
    "ResponseType": "code"
  }
}

Program.cs:

public class Program
    {
        public static async Task Main(string[] args)
        {
            var builder = WebAssemblyHostBuilder.CreateDefault(args);
            builder.RootComponents.Add<App>("app");

            builder.Services.AddTransient(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });

            builder.Services.AddOidcAuthentication(options =>
            {
                //options.ProviderOptions.Authority = "https://localhost:5001/";
                // Configure your authentication provider options here.
                // For more information, see https://aka.ms/blazor-standalone-auth
                builder.Configuration.Bind("oidc", options.ProviderOptions);
            });

            await builder.Build().RunAsync();
        }
    }

Answer 3

刚刚在它之前工作的地方遇到了这个问题，这是由于 cookie 造成的。我做了一些更改，并且在一切正常后不得不清除我的 cookie（它在 incongito 中工作）

Answer 4

谁在使用自签名证书在IIS上发布时遇到这个问题，可能是读取证书时应用程序池的授权导致的。

当您运行 .exe 并尝试登录时，登录失败并且 .exe 控制台显示“Keyset does not exist”。

为了解决这个问题，打开证书管理器，右键单击证书，所有任务，私钥管理器并插入 IIS 组 (IIS_IUSRS) 以获得 read/write 权限。要进行测试，请尝试“所有人”。

使用 Blazor Web Assembly 和 Identity Server 4 登录错误

Login error using Blazor Web Assembly and Identity Server 4

asp.net-core

identityserver4

blazor

blazor-client-side

blazor-webassembly