我正在使用 Auth0 进行身份验证并做出反应。我正在使用 loginWithPopup()作为登录弹出屏幕。但是每次我最终都会遇到配置错误的错误(就像您在附件中看到的那样)。但是,如果我从它起作用的 URL 中删除 response_mode = web_message,有没有办法从代码中删除 response_mode。鉴于我的 auth0 快速入门,我正在使用 react-auth0-spa.js
import React, { Component, createContext } from 'react';
import createAuth0Client from '@auth0/auth0-spa-js';
// create the context
export const Auth0Context = createContext();
// create a provider
export class Auth0Provider extends Component {
state = {
auth0Client: null,
isLoading: true,
isAuthenticated: false,
user: false,
};
config = {
domain: "dev-ufnn-q8r.auth0.com",
client_id: "zZh4I0PgRLQqLKSPP1BUKlnmfJfLqdoK",
redirect_uri: window.location.origin,
//audience: "https://reachpst.auth0.com/api/v2/"
};
componentDidMount() {
this.initializeAuth0();
}
// initialize the auth0 library
initializeAuth0 = async () => {
const auth0Client = await createAuth0Client(this.config);
const isAuthenticated = await auth0Client.isAuthenticated();
const user = isAuthenticated ? await auth0Client.getUser() : null;
this.setState({ auth0Client, isLoading: false, isAuthenticated, user });
};
loginWithPopup = async () => {
try {
await this.state.auth0Client.loginWithPopup();
}
catch (error) {
console.error(error);
}
this.setState({
user: await this.state.auth0Client.getUser(),
isAuthenticated: true,
});
};
render() {
const { auth0Client, isLoading, isAuthenticated, user } = this.state;
const { children } = this.props;
const configObject = {
isLoading,
isAuthenticated,
user,
loginWithPopup: this.loginWithPopup,
loginWithRedirect: (...p) => auth0Client.loginWithRedirect(...p),
getTokenSilently: (...p) => auth0Client.getTokenSilently(...p),
getIdTokenClaims: (...p) => auth0Client.getIdTokenClaims(...p),
logout: (...p) => auth0Client.logout(...p)
};
return (
<Auth0Context.Provider value={configObject}>
{children}
</Auth0Context.Provider>
);
}
}