{"section":"tutorials","requestedLocale":"pt","requestedSlug":"cadastrar-client-id-e-client-secret-para-login-com-google","locale":"pt","slug":"cadastrar-client-id-e-client-secret-para-login-com-google","path":"docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google.md","branch":"main","content":"Para ativar o login por OAuth2 via Google, acesse o VTEX ID pelo Admin VTEX e preencha os campos `Client ID` e `Client secret`, conforme detalhado no artigo [Configurar login com Facebook e Google](https://help.vtex.com/pt/docs/tutorials/configurar-login-com-facebook-e-google).\n\n![Google OAuth](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_1.png)\n\nEsses valores são obtidos a partir de um projeto criado no serviço de APIs do Google Cloud Platform.\n\nSiga os passos abaixo:\n\n> ⚠️ Os passos a seguir descrevem procedimentos em uma plataforma externa e podem estar desatualizados. Para mais informações, consulte os artigos [Setting up OAuth 2.0](https://support.google.com/cloud/answer/6158849) e [OpenID Connect](https://developers.google.com/identity/protocols/oauth2/openid-connect) da documentação do Google.\n\n1. Acesse o  [Google Cloud Console](https://console.developers.google.com/).\n2. Na aba lateral, clique em __Credenciais__.\n3. Clique em __Criar projeto__.\n    ![Criar Projeto Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_2.png)\n\n4. Dê um nome ao projeto e clique em __Criar__.\n    ![Novo Projeto Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_3.png)\n5. No topo da página, clique no botão __Criar credenciais__.\n    ![Criar Credenciais Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_4.png)\n6. Clique na opção __ID do cliente OAuth__.\n    ![ID cliente OAuth Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_5.png)\n7. Clique no botão __Configurar tela de consentimento__.\n    ![Configurar Tela Consentimento Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_6.png)\n8. Escolha o tipo de usuário desejado para a sua loja (__Interno__ ou __Externo__) e clique no botão __Criar__.\n    ![Tipo usuário Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_7.png)\n9.  __Nome do app__: nome que será exibido aos seus clientes no momento do login.\n10. __Email para suporte do usuário__: endereço para que os usuários entrem em contato sobre o consentimento.\n11. __Logotipo do app__: imagem que corresponde ao logotipo da sua loja.\n12. __Domínios autorizados__: inclua os domínios que podem interagir com essa API. Adicione, no mínimo, o domínio da sua loja e o da VTEX: \n    - `loja.com` (exemplo, sempre sem o \"www\" ou correspondente)\n    - `vtex.com.br` (relativo aos nossos servidores de backend)\n13. __Dados de contato do desenvolvedor__: emails que o Google usará para notificar você sobre alterações no projeto\n14. Clique no botão __Salvar e continuar__.\n    ![Configurações Tela Consentimento PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_8.png)\n13. Clique no item do menu lateral esquerdo __Credenciais__.\n14. Em Tipo de aplicativo, selecione __Aplicativo da Web__.\n    ![Credenciais Aplicativo Web Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_9.png)\n15. __Nome__: informe um nome para identificação interna.\n16. __Origens JavaScript autorizadas__: cadastre as URLs exatas que poderão usar este método de autenticação, o que corresponde ao seu site; exemplo `https://www.loja.com`. Recomendamos cadastrar também a URL da sua conta: `https://{{accountName}}.myvtex.com` de sua conta, substituindo `{{accountName}}` pelo nome da sua conta, conforme descrito no Admin VTEX.\n17. __URIs de redirecionamento autorizados__: cadastre a URL de serviço da VTEX:\n\n    -`https://vtexid.vtex.com.br/VtexIdAuthSiteKnockout/ReceiveAuthorizationCode.ashx`\n\n    ![Configurações Aplicativo Web Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_10.png)\n\n18. Após concluir, as suas credenciais serão exibidas:\n    ![Cliente OAuth criado Google PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_11.png)\n    - Copie o __ID do cliente__ do Google e cole no campo `Client ID` no admin do VTEX ID.\n    - Copie a __chave secreta do cliente__ do Google e cole no campo `Client secret` no admin do VTEX ID.\n    ![Google OAuth](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/autenticação/conceitos-básicos-de-autenticação/cadastrar-client-id-e-client-secret-para-login-com-google_12.png)\n    Depois de configurar essas etapas, salve as alterações."}