我目前正在开发一个具有 ReactJS 前端和 Lumen 后端的应用程序。我正在尝试使用 Auth0 使 API 只能由特定用户访问。
目前,我在 Lumen 中设置了 JWT 身份验证。使用邮递员,我可以在设置 Auth0 提供的测试承载令牌时成功请求数据。
以下是我用于 JWT 验证的设置:
$verifier = new JWTVerifier([
'supported_algs' => ['RS256'],
'valid_audiences' => ['http://example.com'],
'authorized_iss' => ['https://example.eu.auth0.com/'],
]);
我已经开始使用 ReactJS,到目前为止我可以用 Auth0 完美登录。以下是 auth0 连接的设置:
auth0 = new auth0.WebAuth({
domain: AUTH_CONFIG.domain,
clientID: AUTH_CONFIG.clientId,
redirectUri: AUTH_CONFIG.callbackUrl,
responseType: 'token id_token',
scope: 'openid profile'
});
成功登录返回的是 access_token 和 id_token。
现在是令人沮丧的部分.. 我从我的 API 中对数据进行了 GET 请求,如下所示:
axios({
url:'http://example.com/public/api/enquiries',
headers: {
'Content-Type': 'application/json',
'Authorization':'Bearer ' + localStorage.getItem('id_token'),
}
}).then(function(response) {
console.log(response);
});
然后从我的 Lumen API 返回以下错误:
Invalid audience Wo6olMsBdA0U0azY4q09iZ7bjXPbYSvd; expected http://example.com
我对 Lumen 中的解码数据进行了 var_vump 处理,所有数据都是正确的,除了“aud”项显示为:Wo6olMsBdA0U0azY4q09iZ7bjXPbYSvd
。
我将上述字符串添加为接受的受众,然后成功发出请求,但这肯定不正确。任何人都可以指出我正确的方向吗?
非常感激。
发现问题了。
因此,当为access_token
and返回数据时id_token
,access_token 看起来太小而无法用于 JWT,因此我假设 id_token 是要使用的正确承载。但是,在启动 auth0 时,我的 React 项目中缺少的是“观众”选项,因此 access_token 还没有准备好 JWT。添加这个给了我一个更长的 access_token,它是 JWT 准备好的。将其解析为我的 API 作为承载工作,它应该完成。
react中 auth0 的启动代码应该是:
auth0 = new auth0.WebAuth({
domain: AUTH_CONFIG.domain,
clientID: AUTH_CONFIG.clientId,
redirectUri: AUTH_CONFIG.callbackUrl,
responseType: 'token id_token',
scope: 'openid profile',
audience: 'http://example.com'
});
..对于遇到同样问题的任何人。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句