如何使用React JS访问受Azure AD B2C保护的Web API

时间:2019-05-14 10:00:06

标签: reactjs asp.net-web-api2 azure-ad-b2c

我有一个用Azure AD B2C保护的.net核心Web api,我正尝试使用react js msal库访问该api。

新的Msal.UserAgentApplication(config.applicationId,       权威,       authCallback,       {logger:logger,         cacheLocation:config.cacheLocation,         postLogoutRedirectUri:config.postLogoutRedirectUri,         redirectUri:config.redirectUri}     );

如何通过使用react js传递JWT令牌来调用Web api

1 个答案:

答案 0 :(得分:0)

看起来您正在使用MSAL js v0.2.3或v0.2.4,新的MSAL v1.0.0版本在UserAgentApplication的构造函数中采用了一个配置对象。请确保参考文档以正确使用您的版本: https://github.com/AzureAD/microsoft-authentication-library-for-js/wiki

无论如何-初始化后,您需要通过在MSAL应用程序上调用loginPopup或loginRedirect来启动登录。输入成功的凭据并返回到Web应用程序后,可以调用MSAL的getUser()(如果使用v1.0.0,则可以调用getAccount())

之后,您需要通过调用AcquisitionTokenSilent(scopes)获得访问令牌,其中scopes数组由B2C应用程序定义。
(在v1.0.0中,您将传递这样的参数对象:{scopes:[scopes]})

一旦有了访问令牌,就需要将其作为REST请求上的Authorization标头传递,然后通过在处理请求之前回调到B2C在WebAPI中对其进行验证。 这是验证过程的一个示例: https://azure.microsoft.com/en-us/resources/samples/active-directory-dotnet-webapi-manual-jwt-validation/