Erro de cookie do samesite em localhost com auth0

Aug 18 2020

Estou usando o auth0 para implementar a autenticação em meu aplicativo react. Estou usando o gancho useAuth0 () da seguinte maneira,

const { isAuthenticated, isLoading } = useAuth0();

Eu também implementei login usando

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

Quando pressiono o botão, ele redireciona para auth0 e consigo fazer o login. Após o login, ele redireciona de volta para o aplicativo e mostra as rotas conectadas sem qualquer problema. O problema, entretanto, é que quando eu faço qualquer alteração no aplicativo, ele é recarregado e a página de login é exibida novamente, embora eu esteja conectado. Na guia de problemas do Chrome, ela mostra esta mensagem.

Não consigo descobrir por que não funciona na atualização, mas por que funciona no redirecionamento após o login, e estou tentando encontrar uma solução desde ontem, mas sem sorte até agora. Eu encontrei Encontre o cookie que causa o aviso SameSite do Chrome, que é a pergunta mais próxima que consegui encontrar, mas não parece dar uma resposta adequada sobre como resolvê-lo.

Respostas

KennyJohnJacob Aug 28 2020 at 05:18

O que funcionou para mim no final foi uma resposta a outra pergunta do SO .

Aqui está o conteúdo,

O problema era que o Brave e o Safari usavam Intelligent Tracking Prevention (ITP), que estava impedindo a autenticação silenciosa de funcionar.

A solução que funcionou para mim foi habilitar tokens de atualização rotativos (por meio do painel do Auth0) e fornecer recursos adicionais para o provedor do Auth0.

Os dois novos adereços a adicionar são: useRefreshTokens={true}e 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>

Aqui estão os documentos oficiais para saber mais sobre a rotação de tokens de atualização: https://auth0.com/docs/tokens/refresh-tokens

E esse foi o problema do github que resolveu o problema https://github.com/auth0/auth0-react/issues/101