diff --git a/src/content/docs/pt-br/recipes/captcha.mdx b/src/content/docs/pt-br/recipes/captcha.mdx index e1c47f8f16eea..b4a0eb5f44690 100644 --- a/src/content/docs/pt-br/recipes/captcha.mdx +++ b/src/content/docs/pt-br/recipes/captcha.mdx @@ -4,30 +4,38 @@ description: Aprenda como criar uma rota de API e buscá-la do cliente. i18nReady: true type: recipe --- +import { Steps } from '@astrojs/starlight/components'; [Endpoints do servidor](/pt-br/guides/endpoints/#endpoints-do-servidor-rotas-de-api) podem ser usados como endpoints de API REST para executar funções como autenticações, acesso à banco de dados, e verificações sem expor dados sensíveis ao cliente. Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem expor o segredo aos clientes. ## Pré-requisitos + - Um projeto com [SSR](/pt-br/guides/server-side-rendering/) (`output: 'server'`) habilitado ## Receita -1. Crie um endpoit `POST` que aceite dados do recaptcha, e então verifique-o com a API do reCAPTCHA. Aqui, você definir valores secretos ou ler variáveis de ambiente com segurança. + +1. Crie um endpoint `POST` que aceite dados do recaptcha, e então verifique-o com a API do reCAPTCHA. Aqui, você pode definir valores secretos ou ler variáveis de ambiente com segurança. + ```js title="src/pages/recaptcha.js" export async function POST({ request }) { const dados = await request.json(); const URLrecaptcha = 'https://www.google.com/recaptcha/api/siteverify'; - const corpoRequisicao = { - secret: "CHAVE_SECRETA_DO_SEU_SITE", // Isso pode ser uma variável de ambiente - response: dados.recaptcha // O token passado pelo cliente + const requestHeaders = { + 'Content-Type': 'application/x-www-form-urlencoded' }; + const corpoRequisicao = new URLSearchParams({ + secret: "CHAVE_SECRETA_DO_SEU_SITE", // Isso pode ser uma variável de ambiente + response: dados.recaptcha // O token passado pelo cliente + }); const resposta = await fetch(URLrecaptcha, { method: "POST", - body: JSON.stringify(corpoRequisicao) + headers: requestHeaders, + body: corpoRequisicao.toString() }); const dadosResposta = await resposta.json(); @@ -41,7 +49,7 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem ```astro title="src/pages/index.astro" - + @@ -59,7 +67,7 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem .then((response) => response.json()) .then((gResponse) => { if (gResponse.success) { - // Veruficação do captcha foi um sucesso + // Verificação do captcha foi um sucesso } else { // Verificação do captcha falhou } @@ -69,3 +77,4 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem ``` +