Я только что загрузил код быстрого запуска React с Auth0. Я изменил URL-адрес обратного вызова с window.location.pathname на 'http://localhost: 3000 / profile '.
const DEFAULT_REDIRECT_CALLBACK = () =>
window.history.replaceState({}, document.title, 'http://localhost:3000/profile');
В настройках приложения Auth0 я также изменил разрешенные URL-адреса обратного вызова на http://localhost: 3000 / profile .
Однако, он показывает, что «http://localhost: 3000 отсутствует в списке разрешенных URL-адресов обратного вызова». Это заставляет меня думать, что мне не удалось изменить URL-адрес обратного вызова перенаправления в файле response-auth0-spa.
реагировать-auth0-spa:
import createAuth0Client from "@auth0/auth0-spa-js";
console.log(window.location.pathname)
const DEFAULT_REDIRECT_CALLBACK = () =>
window.history.replaceState({}, document.title, 'http://localhost:3000/profile');
export const Auth0Context = React.createContext();
export const useAuth0 = () => useContext(Auth0Context);````
children,
onRedirectCallback = DEFAULT_REDIRECT_CALLBACK,
...initOptions
}) => {
const [isAuthenticated, setIsAuthenticated] = useState();
const [user, setUser] = useState();
const [auth0Client, setAuth0] = useState();
const [loading, setLoading] = useState(true);
const [popupOpen, setPopupOpen] = useState(false);
useEffect(() => {
const initAuth0 = async () => {
const auth0FromHook = await createAuth0Client(initOptions);
setAuth0(auth0FromHook);
if (
window.location.search.includes("code=") &&
window.location.search.includes("state=")
) {
const { appState } = await auth0FromHook.handleRedirectCallback();
onRedirectCallback(appState);
}
const isAuthenticated = await auth0FromHook.isAuthenticated();
setIsAuthenticated(isAuthenticated);
if (isAuthenticated) {
const user = await auth0FromHook.getUser();
setUser(user);
}
setLoading(false);
};
initAuth0();
// eslint-disable-next-line
}, []);
const loginWithPopup = async (params = {}) => {
setPopupOpen(true);
try {
await auth0Client.loginWithPopup(params);
} catch (error) {
console.error(error);
} finally {
setPopupOpen(false);
}
const user = await auth0Client.getUser();
setUser(user);
setIsAuthenticated(true);
};
const handleRedirectCallback = async () => {
setLoading(true);
await auth0Client.handleRedirectCallback();
const user = await auth0Client.getUser();
setLoading(false);
setIsAuthenticated(true);
setUser(user);
};
return (
<Auth0Context.Provider
value={{
isAuthenticated,
user,
loading,
popupOpen,
loginWithPopup,
handleRedirectCallback,
getIdTokenClaims: (...p) => auth0Client.getIdTokenClaims(...p),
loginWithRedirect: (...p) => auth0Client.loginWithRedirect(...p),
getTokenSilently: (...p) => auth0Client.getTokenSilently(...p),
getTokenWithPopup: (...p) => auth0Client.getTokenWithPopup(...p),
logout: (...p) => auth0Client.logout(...p)
}}
>
{children}
</Auth0Context.Provider>
);
};