从Blazor Webassembly独立连接到Active Directory B2C安全的Azure功能应用程序

如何解决从Blazor Webassembly独立连接到Active Directory B2C安全的Azure功能应用程序

我有一个独立的Blazor Webassembly项目，例如，当我在Visual Studio中本地运行时，我试图从中访问Azure Function应用。

response = await Http.GetStringAsync("https://mytestsite897845.azurewebsites.net/api/Test");

我的Azure Function应用程序配置了Azure Active Directory身份验证/授权，并且我在Azure Function应用程序CORS中设置了“ https：// localhost：44351”，并勾选了“启用访问控制允许凭据”。

在“身份验证/授权”部分中，如果我将“未验证请求时采取的措施”设置为“允许匿名请求（不采取任何措施）”，那么上述调用就可以正常工作，并且我收到了来自“测试“ Azure函数”。

但是，一旦我将“未验证请求时采取的措施”更改为“使用Azure Active Directory登录”，那么即使我已经使用Active Directory B2C登录，上述调用也会失败。我在浏览器中收到以下错误。

Access to fetch at 'https://login.windows.net/<my client id>/oauth2/authorize?response_type=code+id_token&redirect_uri=https%3A%2F%2Fmytestsite897845.azurewebsites.net%2F.auth%2Flogin%2Faad%2Fcallback&client_id=48fd8563-3826-4d79-b29a-907a17598afe&scope=openid+profile+email&response_mode=form_post&nonce=e428bf7812ef4327a710b1162353ac3d_20200820091540&state=redir%3D%252Fapi%252FTest'
(redirected from 'https://mytestsite897845.azurewebsites.net/api/Test') from origin 'https://localhost:44351' has been blocked
by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves
your needs,set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

GET https://login.windows.net/<my client id>/oauth2/authorize?response_type=code+id_token&redirect_uri=https%3A%2F%2Fmytestsite897845.azurewebsites.net%2F.auth%2Flogin%2Faad%2Fcallback&client_id=48fd8563-3826-4d79-b29a-907a17598afe&scope=openid+profile+email&response_mode=form_post&nonce=e428bf7812ef4327a710b1162353ac3d_20200820091540&state=redir%3D%252Fapi%252FTest
net::ERR_FAILED

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: TypeError: Failed to fetch
System.Net.Http.HttpRequestException: TypeError: Failed to fetch
   at System.Net.Http.BrowserHttpHandler.SendAsync(HttpRequestMessage request,CancellationToken cancellationToken)
   at System.Net.Http.HttpClient.FinishSendAsyncUnbuffered(Task`1 sendTask,HttpRequestMessage request,CancellationTokenSource cts,Boolean disposeCts,CancellationToken callerToken,Int64 timeoutTime)
   at System.Net.Http.HttpClient.GetStringAsyncCore(Task`1 getTask,CancellationToken cancellationToken)
   at BACClient.Pages.Counter.OnInitializedAsync() in .\Pages\Counter.razor:line 79
   at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)

有人知道我想念什么吗？

解决方法

能否请您分享为配置Azure功能以针对Azure B2C（策略和应用程序）进行身份验证而采取的步骤？您提到的步骤与Azure AD B2C不相关，但与Azure AD相关。

您可能会发现此链接很有用，它说明了所需的实际设置：https://codemilltech.com/adding-azure-ad-b2c-authentication-to-azure-functions/#:~:text=The%20Azure%20Function%20App%20can,And%20then%20the%20Xamarin。