Português (Brasil)

oidc
supabase
autenticação
rls
jwt

Integrando com Supabase

Aprenda como integrar o Logto com o Supabase para aprimorar a experiência de autenticação em suas aplicações.

Yijun

Developer

5/16/2024

Pare de perder semanas com autenticação de usuários

Lance aplicativos seguros mais rapidamente com o Logto. Integre a autenticação de usuários em minutos e concentre-se no seu produto principal.

Começar

Logto é um provedor moderno de serviços de autenticação de identidade que oferece suporte seguro, abrangente e amigável para login em aplicações. Ele também fornece uma variedade de SDKs e guias de integração em vários frameworks e linguagens de programação, permitindo integrar serviços de autenticação empresarial em sua aplicação de forma rápida e eficiente.

Este artigo foca principalmente em detalhar como integrar o Supabase com o Logto.

Fundamentos do Supabase

O Supabase utiliza a Segurança em Nível de Linha do Postgres para controlar as permissões de acesso a dados. Em termos simples, ao criar políticas de Segurança em Nível de Linha para tabelas no banco de dados, podemos restringir e gerenciar quem pode ler, escrever e atualizar dados em uma tabela.

Vamos supor que você tenha uma tabela chamada "posts" em seu banco de dados, com o seguinte conteúdo:

O campo user_id na tabela representa o usuário ao qual cada dado do post pertence. Você pode restringir cada usuário a acessar apenas seus próprios dados de post com base no campo user_id.

No entanto, antes que isso possa ser implementado, o Supabase precisa ter a capacidade de identificar o usuário atual que está acessando o banco de dados.

Adicionar dados do usuário às requisições do Supabase

Graças ao suporte do Supabase para JWT, quando nossa aplicação interage com o Supabase, podemos gerar um JWT contendo dados do usuário usando o segredo JWT fornecido pelo Supabase. Usamos esse JWT como o cabeçalho de Autenticação ao fazer requisições. Ao receber a requisição, o Supabase verifica automaticamente a validade do JWT e permite o acesso aos dados contidos nele durante os processos subsequentes.

Primeiramente, podemos obter o segredo JWT fornecido pelo Supabase em “Configurações do Projeto” no painel do Supabase:

Página de Configurações da API do Supabase

Depois, ao usar o SDK do Supabase para fazer requisições ao Supabase, utilizamos esse segredo para gerar nosso JWT e anexá-lo como o cabeçalho de Autenticação na requisição. (Observe que este processo ocorre no serviço de backend da sua aplicação, e o segredo JWT nunca deve ser exposto a terceiros).

Em seguida, navegue até o Editor SQL no painel do Supabase e crie uma função para recuperar o userId carregado na requisição:

O código usado na imagem é o seguinte:

Como mostra o código, no Supabase, você pode recuperar o payload do JWT que geramos chamando request.jwt.claims. O campo userId dentro do payload é o valor que configuramos.

Com esta função, o Supabase pode determinar o usuário que está acessando o banco de dados no momento.

Criar política de Segurança em Nível de Linha

Em seguida, podemos criar uma política de Segurança em Nível de Linha para restringir cada usuário a acessar apenas seus próprios dados de post com base no campo user_id na tabela de posts.

Navegue até a página do Editor de Tabelas no painel do Supabase e selecione a tabela posts.
Clique em "Adicionar Política RLS" no topo da tabela.
Na janela solicitada, clique em "Criar política".
Insira um Nome de Política e escolha o comando SELECT Policy.
No bloco using do código abaixo, insira:

Ao aproveitar políticas como essas, o controle de acesso a dados dentro do Supabase é alcançado.

Em aplicações reais, você criaria várias políticas para restringir ações dos usuários como inserção e modificação de dados. No entanto, isso está além do escopo deste artigo. Para mais informações sobre Segurança em Nível de Linha (RLS), consulte Proteja seus dados usando Segurança em Nível de Linha no Postgres.

Processo básico de integração com Logto

Como mencionado anteriormente, porque o Supabase utiliza RLS para seu controle de acesso, a chave para integrar com o Logto (ou qualquer outro serviço de autenticação) reside em obter o id do usuário autenticado e enviá-lo ao Supabase. Todo o processo é ilustrado no diagrama abaixo:

A seguir, explicaremos como integrar o Logto com o Supabase com base neste diagrama de processos.

Integração com Logto

O Logto oferece guias de integração para vários frameworks e linguagens de programação.

Geralmente, aplicativos construídos com esses frameworks e linguagens se enquadram em categorias como aplicativos Nativos, SPA (aplicativos de página única), aplicativos web tradicionais e aplicativos M2M (máquina a máquina). Você pode visitar a página Inícios rápidos do Logto para integrar o Logto em sua aplicação com base na stack de tecnologia que você está utilizando. Depois disso, siga as instruções abaixo para integrar o Logto em seu projeto com base no tipo de aplicação.

Aplicativo nativo ou SPA

Tanto os aplicativos nativos quanto os SPAs são executados em seu dispositivo, e as credenciais (token de acesso) obtidas após o login são armazenadas localmente em seu dispositivo.

Portanto, ao integrar seu aplicativo com o Supabase, você precisa interagir com o Supabase por meio de seu serviço de backend, pois você não pode expor informações sensíveis (como o segredo JWT do Supabase) no dispositivo de cada usuário.

Vamos supor que você esteja construindo seu SPA usando React e Express. Você integrou com sucesso o Logto em sua aplicação seguindo o Guia do SDK React do Logto (você pode consultar o código em nosso exemplo de react). Além disso, você adicionou a validação de token de acesso do Logto ao seu servidor backend de acordo com a documentação Proteja sua API no Node (Express).

Em seguida, você usará o token de acesso obtido do Logto para solicitar dados do usuário ao seu servidor backend:

Em seu servidor backend, você já extraiu o id do usuário logado a partir do token de acesso usando middleware:

Agora, você pode usar o getSupabaseClient descrito acima para anexar o userId ao JWT usado nas requisições subsequentes ao Supabase. Alternativamente, você pode criar um middleware para criar um cliente do Supabase para requisições que precisem interagir com o Supabase:

No fluxo de processamento subsequente, você pode chamar diretamente ctx.supabase para interagir com o Supabase:

Neste código, o Supabase retornará apenas os dados de post pertencentes ao usuário atual com base nas políticas anteriormente configuradas.

Aplicativo web tradicional

A principal diferença entre um aplicativo web tradicional e um aplicativo Nativo ou SPA é que um aplicativo web tradicional renderiza e atualiza as páginas exclusivamente no servidor web. Portanto, as credenciais dos usuários são gerenciadas diretamente pelo servidor web, enquanto, nos aplicativos Nativos e SPAs, elas residem no dispositivo do usuário.

Ao integrar o Logto num aplicativo web tradicional no Supabase, você pode recuperar diretamente o id do usuário logado a partir do backend.

Tomando um projeto Next.js como exemplo, após integrar o Logto em seu projeto seguindo o Guia do SDK Next.js, você pode usar o SDK do Logto para recuperar as informações do usuário e construir o JWT correspondente para interagir com o Supabase.

Aplicativo máquina a máquina

Máquina a máquina (M2M) é frequentemente usada quando seu aplicativo precisa se comunicar diretamente com servidores de recursos, como um serviço estático que busca posts diários, etc.

Você pode usar o Máquina a máquina: Autenticação com Logto guia para autenticação de aplicativo máquina a máquina. A integração entre Supabase e aplicativos M2M é semelhante à dos aplicativos Nativos e SPAs (conforme descrito na seção "Aplicativo nativo ou aplicativo de página única"). Ela envolve obter um token de acesso do Logto e, em seguida, validá-lo por meio de uma API backend protegida.

No entanto, é importante notar que aplicativos Nativos e SPAs são geralmente projetados para usuários finais, então o id do usuário obtido representa o próprio usuário. No entanto, o token de acesso para aplicativos máquina a máquina representa o próprio aplicativo, e o campo sub no payload do token de acesso é o id do cliente do aplicativo M2M, não um usuário específico. Portanto, durante o desenvolvimento, é crucial distinguir quais dados são destinados aos aplicativos M2M.

Além disso, se você quiser que um aplicativo M2M específico acesse o Supabase em nome de todo o serviço para contornar as restrições RLS, você pode usar o segredo service_role do Supabase para criar um cliente do Supabase. Isso é útil quando você quer realizar algumas tarefas administrativas ou automatizadas que requerem acesso a todos os dados sem serem restringidos pelas políticas de Segurança em Nível de Linha configuradas para usuários individuais.

O segredo service_role pode ser encontrado na mesma página que o segredo JWT:

Ao criar um cliente do Supabase, use o segredo service_role, então este cliente poderá acessar todos os dados no banco de dados:

Resumo

Neste artigo, exploramos a integração do Logto com o Supabase, destacando insights importantes e aspectos críticos de integração. Exploramos conceitos como autenticação JWT e políticas de Segurança em Nível de Linha, guiando você através do processo de incorporar perfeitamente o Logto em suas aplicações com Supabase. Com este conhecimento, esperamos que você possa aprimorar a segurança e a funcionalidade de suas aplicações com confiança, e até mesmo estender seus projetos com recursos adicionais.

Experimente o Logto Cloud gratuitamente

Fundamentos do Supabase#

Adicionar dados do usuário às requisições do Supabase#

Criar política de Segurança em Nível de Linha#

Processo básico de integração com Logto#

Integração com Logto#

Aplicativo nativo ou SPA#

Aplicativo web tradicional#

Aplicativo máquina a máquina#

Resumo#

Fundamentos do Supabase#

Adicionar dados do usuário às requisições do Supabase#

Criar política de Segurança em Nível de Linha#

Processo básico de integração com Logto#

Integração com Logto#

Aplicativo nativo ou SPA#

Aplicativo web tradicional#

Aplicativo máquina a máquina#

Resumo#

Fundamentos do Supabase

Adicionar dados do usuário às requisições do Supabase

Criar política de Segurança em Nível de Linha

Processo básico de integração com Logto

Integração com Logto

Aplicativo nativo ou SPA

Aplicativo web tradicional

Aplicativo máquina a máquina

Resumo

Fundamentos do Supabase

Adicionar dados do usuário às requisições do Supabase

Criar política de Segurança em Nível de Linha

Processo básico de integração com Logto

Integração com Logto

Aplicativo nativo ou SPA

Aplicativo web tradicional

Aplicativo máquina a máquina

Resumo