Configurar login social com X

O conector oficial do Logto para login social do X (anteriormente Twitter).

dica:

Este guia assume que você tem um entendimento básico dos Conectores (Connectors) do Logto. Para aqueles que não estão familiarizados, consulte o guia de Conectores para começar.

Introdução

O conector X (Twitter) permite que os usuários finais façam login no seu aplicativo usando suas próprias contas X (Twitter) via protocolo de autenticação X OAuth 2.0.

Criar um aplicativo no Portal do Desenvolvedor X

Vá para o Portal do Desenvolvedor X e faça login com sua conta X. Se você não tiver uma conta, pode se registrar para obter uma.

Em seguida, crie um aplicativo.

Passo 1: Navegue até a seção de criação de aplicativos.

Depois de fazer login, vá para a seção "Projects & Apps" e clique em "Create App" (ou "New App", dependendo da interface).

Passo 2: Preencha os detalhes do aplicativo.

Complete o formulário com as seguintes informações:

• App Name: Forneça um nome único e descritivo para seu aplicativo.
• Application Description: (Opcional) Adicione uma breve descrição do que seu aplicativo faz.
• Website URL: Insira o URL da página inicial do seu aplicativo.
• Callback URL / Redirect URI: No nosso caso, será ${your_logto_endpoint}/callback/${connector_id}. por exemplo, https://foo.logto.app/callback/${connector_id}. O connector_id pode ser encontrado na barra superior da página de detalhes do conector no Logto Admin Console.

Passo 3: Selecione permissões e escopos.

Escolha as permissões que seu aplicativo requer. Para login social via X, certifique-se de habilitar os escopos necessários tweet.read e users.read.

Passo 4: Salve seu aplicativo.

Clique em "Create" ou "Save" para registrar seu aplicativo.

Após a criação, navegue até a seção "Keys and tokens" do seu aplicativo para recuperar seu OAuth 2.0 Client ID e Client Secret.

Configure seu conector

Na configuração do seu conector Logto, preencha os seguintes campos com os valores obtidos na seção "OAuth 2.0 Client ID and Client Secret" da página "Keys and tokens" do seu aplicativo:

• clientId: O Client ID do seu aplicativo.
• clientSecret: O Client Secret do seu aplicativo.

scope é uma lista delimitada por espaços de escopos. Se não for fornecido, o escopo padrão é tweet.read users.read.

Tipos de configuração

Nome	Tipo
clientId	string
clientSecret	string
scope	string

Testar conector X (Twitter)

É isso. O conector X (Twitter) deve estar disponível agora. Não se esqueça de Habilitar conector social na experiência de login.

Referência

Documentação do desenvolvedor X

Fluxo de Código de Autorização X OAuth 2.0 com PKCE