Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

i18n(pt-BR): update recipes/captcha.mdx file #9530

Merged
merged 2 commits into from
Oct 2, 2024
Merged

i18n(pt-BR): update recipes/captcha.mdx file #9530

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
33747bd
i18n(pt-BR): update `recipes/captcha.mdx` file
viniciusdeliz Oct 2, 2024
ca633bb
Merge branch 'main' into i18n/recipes/captcha
yanthomasdev Oct 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 16 additions & 7 deletions src/content/docs/pt-br/recipes/captcha.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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.
<Steps>
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();
Expand All @@ -41,7 +49,7 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem
```astro title="src/pages/index.astro"
<html>
<head>
<script src="https://www.google.com/recaptcha/api.js"></script>
<script is:inline src="https://www.google.com/recaptcha/api.js"></script>
</head>

<body>
Expand All @@ -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
}
Expand All @@ -69,3 +77,4 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem
</body>
</html>
```
</Steps>
Loading