问题描述:在使用Auth0自定义社交连接到Google OAuth2时,出现了“无效的范围”错误。
解决方法: 以下是一个解决方法的代码示例。
首先,在Auth0管理后台的“社交连接”部分创建一个自定义社交连接,并将其配置为使用Google OAuth2。确保已正确配置Google OAuth2的客户端ID和客户端秘密。
然后,在您的应用程序中使用Auth0的auth0.js库来进行身份验证。
// 引入auth0.js库
import auth0 from 'auth0-js';
// 创建Auth0客户端实例
const auth0Client = new auth0.WebAuth({
domain: 'YOUR_AUTH0_DOMAIN',
clientID: 'YOUR_AUTH0_CLIENT_ID',
redirectUri: 'YOUR_CALLBACK_URL',
responseType: 'token id_token',
scope: 'openid profile email' // 范围必须包含openid、profile和email
});
// 在点击按钮时触发Google登录
document.getElementById('login-button').addEventListener('click', () => {
auth0Client.authorize({
connection: 'google-oauth2'
});
});
// 在回调URL中处理Google登录的响应
auth0Client.parseHash((err, authResult) => {
if (authResult && authResult.accessToken && authResult.idToken) {
// 登录成功,处理返回的令牌和用户信息
console.log(authResult);
} else if (err) {
// 登录失败,处理错误信息
console.error(err);
}
});
确保将YOUR_AUTH0_DOMAIN、YOUR_AUTH0_CLIENT_ID和YOUR_CALLBACK_URL替换为实际的值。
在这个示例中,我们使用了openid、profile和email范围,但您可以根据您的需求添加或删除其他范围。
请注意,范围必须与您在Auth0管理后台中为自定义社交连接配置的范围匹配,否则将会出现“无效的范围”错误。