next firebase ssr

Next.js + Firebase + GetServersideProps

Este projeto demonstra como implementar a renderização autenticada do lado do servidor com a autenticação Next.js e Firebase.

ATUALIZAÇÃO 19 de novembro de 2020: Um bug foi corrigido onde os tokens de Firebase expirariam após uma hora sem ser atualizados. Todos os tokens agora estão atualizados a cada 10 minutos.

ATUALIZAÇÃO 9 de novembro de 2020: Este repositório foi atualizado para usar a funcionalidade de redirecionamento introduzida em [email protected] . Atualmente, você deve estar no lançamento canary do próximo para que essa abordagem funcione ( yarn add next@canary ).

Versões

• next@10
• react@17
• firebase@8
• [email protected]
• [email protected]

Documentação

Passo a passo e documentação completos aqui: renderização autenticada do lado do servidor com o Next.js e o FireBase.

Como usar

Para executar este exemplo:

• Clone o repositório: git clone [email protected]:vriad/next-firebase-ssr.git
• Navegue até o diretório: cd next-firebase-ssr
• Instale dependências: yarn
• Crie um projeto Firebase, se você ainda não o fez. Certifique-se de entrar na guia Autenticação no console, vá para "Método de inscrição" e habilite "email/senha"
• Adicione suas credenciais de clientes do Firebase ao firebaseClient.ts . Para obtê -los, vá para o console do Firebase> Abra seu projeto> ICON de equipamentos> Configurações do projeto> Geral> Seus aplicativos> Firebase SDK Snippet> Clique no botão Radio "Config"> copiar/colar.
• Adicione sua conta de serviço (Admin) Credenciais ao projeto. Para fazer isso, vá para o console do Firebase> Abra seu projeto> Clique no ícone de engrenagem> Configurações do projeto> Contas de serviço> Clique em Node.js> Gere uma nova chave privada. Abra o arquivo json que downloads. Em seguida, crie uma cópia de .env.local.example e renomeie -a para .env.local . Este é o arquivo em que você colocará suas credenciais secretas de Firebase. Copie/cole os valores do arquivo JSON privado para o novo arquivo .env.local : privateKey se torna PRIVATE_KEY , project_id se torna PROJECT_ID e clientEmail se torna CLIENT_EMAIL .
• Execute yarn dev
• Vá para localhost:3000