Samesite-Cookie-Fehler auf localhost mit auth0

Question

Ich verwende auth0, um die Authentifizierung in meiner Reaktions-App zu implementieren. Ich verwende den useAuth0 () - Hook wie folgt:

const { isAuthenticated, isLoading } = useAuth0();

Ich habe auch Login mit implementiert

const { loginWithRedirect } = useAuth0();
.
.
.
<button onClick={() => loginWithRedirect()} />

Wenn ich auf die Schaltfläche drücke, wird sie zu auth0 umgeleitet und ich kann mich anmelden. Nach der Anmeldung wird zur App zurückgeleitet und die angemeldeten Routen werden problemlos angezeigt. Das Problem ist jedoch, wenn ich Änderungen an der App vornehme, diese neu geladen wird und die Anmeldeseite erneut angezeigt wird, obwohl ich angemeldet war. Auf der Registerkarte "Chrome-Probleme" wird diese Meldung angezeigt.

Ich kann nicht herausfinden, warum es beim Aktualisieren nicht funktioniert, aber warum es beim Umleiten nach dem Anmelden funktioniert, und ich habe seit gestern versucht, eine Lösung zu finden, aber bisher kein Glück. Ich bin auf Find the Cookie gestoßen, das die SameSite-Warnung von Chrome verursacht. Dies ist die nächste Frage, die ich finden konnte, aber es scheint keine richtige Antwort auf die Lösung zu geben.

Answer 1

Was am Ende für mich funktionierte, war eine Antwort auf eine andere SO-Frage .

Hier ist der Inhalt,

Das Problem war, dass Brave und Safari beide Intelligent Tracking Prevention (ITP) verwenden, wodurch verhindert wurde, dass die stille Authentifizierung funktioniert.

Die Lösung, die für mich funktioniert hat, bestand darin, rotierende Aktualisierungstoken (über das Auth0-Dashboard) zu aktivieren und dem Auth0-Anbieter zusätzliche Requisiten bereitzustellen.

Die zwei neuen Requisiten, die hinzugefügt werden müssen, sind: useRefreshTokens={true}und cacheLocation="localstorage".

<Auth0Provider
  domain={process.env.REACT_APP_AUTH0_DOMAIN}
  clientId={process.env.REACT_APP_AUTH0_CLIENT_ID}
  redirectUri={window.location.origin}
  onRedirectCallback={onRedirectCallback}
  useRefreshTokens={true}
  cacheLocation="localstorage"
>
  {children}
</Auth0Provider>

Hier sind die offiziellen Dokumente, um mehr über das Drehen von Aktualisierungstoken zu erfahren: https://auth0.com/docs/tokens/refresh-tokens

Und dies war das Github-Problem, das das Problem geklärt hat https://github.com/auth0/auth0-react/issues/101