Integração do Passport.js com Logto
Um guia prático e exemplo para integrar Passport.js com Logto.
Passport.js é um middleware de autenticação para Node.js que pode ser introduzido de forma discreta em qualquer aplicação web baseada em Express. Este guia abrangente irá concentrar-se em utilizar o plugin passport-openidconnect
, oferecendo uma forma simples mas eficaz de incorporar Logto com Passport.js. Ao longo deste tutorial, estaremos a usar Express.js para construir a nossa aplicação. Todo o código que iremos discutir está disponível num repositório público do GitHub.
Configuração do express com sessão
Antes de mergulhar no processo de integração, precisamos de configurar o projeto básico instalando o Express.js e o seu middleware de sessão.
Assumindo que tens preparado um ambiente de projeto TypeScript (se não, consulta a documentação oficial do TypeScript), começa por instalar os pacotes necessários:
Preparar o ficheiro principal
Cria src/app.ts
com o seguinte código:
Este script inicializa a aplicação Express e configura cookieParser
e o middleware session
para gestão de sessões baseadas em cookies, crucial para armazenar resultados de autenticação no Passport.js. Depois utiliza o módulo http
para lançar o serviço.
Criar uma aplicação Logto
Para prosseguir, é necessária uma aplicação Logto. Cria uma ao visitar a Logto Console, navega até “Applications” e clica em “Create application”. Seleciona “Express”, nomeia a tua aplicação e clica em “Create application”.
Após completar ou terminar de ler o guia de criação, encontrarás uma página detalhada com informações de configuração para os próximos passos.
Definir URIs
Na página de detalhes da aplicação, configura dois valores:
- Redirect URIs: Define como
http://localhost:3000/callback
para alinhar com a rota de callback do projeto. - Post Sign-out Redirect URIs: Usa
http://localhost:3000
para simplicidade, direcionando utilizadores para a página inicial após o logout.
Podes alterar estes valores mais tarde.
Configurar Passport.js com as definições da aplicação
Instalar dependências
Instala passport
e o plugin de estratégia OIDC, passport-openidconnect
:
Preparar ficheiro de configuração
Cria app/config.ts
para gestão de configurações:
Configura as variáveis de ambiente de acordo:
Variável de Ambiente | Descrição | Exemplo |
---|---|---|
APP_ID | ID da App do Logto | 4ukboxxxxxxxxx |
APP_SECRET | Segredo da App do Logto | 5aqccxxxxxxx |
ENDPOINT | Endpoint do Logto | https://g5xxx.logto.app/ |
Inicializar Passport.js com a estratégia OIDC
Cria src/passport.ts
Este código inicializa o Passport com a OpenIDConnectStrategy
. Os métodos de serialização e desserialização são definidos para fins de demonstração.
Certifica-te de inicializar e anexar o middleware Passport na tua aplicação:
Construindo as rotas de autenticação
Vamos agora criar rotas específicas para os processos de autenticação:
Iniciar sessão: /sign-in
Esta rota constrói e redireciona para uma rota de autenticação OIDC.
Lidar com o callback de início de sessão: /callback
Este maneja o callback do início de sessão OIDC, armazena tokens e redireciona para a página inicial.
Terminar sessão: /sign-out
Este redireciona para o URL de término de sessão do Logto, depois de volta para a página inicial.
Obtendo estado de autenticação e protegendo rotas
Desenvolve a página inicial com estado de autenticação:
Aqui, a informação do utilizador é exibida usando JSON.stringify
, e a existência de request.user
é usada para proteger rotas.
Conclusão
Parabéns por integrar o Passport.js com Logto. Espero que este guia te ajude a migrar de sistemas existentes para usar o Logto. Para uma experiência de autenticação melhorada, considera experimentar o Logto Cloud hoje. Bom código!