Use um resolvedor de CAPTCHA com Playwright

1. 1.

   Instale Node.js 22+, Playwright e Chromium

   Instale o pacote playwright e seu binário do navegador Chromium. Instale o SDK JavaScript oficial do solvethree usando o pacote para download solvethree-sdk-0.1.0.tgz; as instruções de integração com Node.js fornecem o comando de instalação por download direto.

2. 2.

   Configure o hostname no solvethree

   O hostname da página HTTPS sob seu controle deve ter um perfil de reCAPTCHA ativo disponível para seu espaço de trabalho. Configure isso no console antes de executar o exemplo. Enviar um hostname e uma ação em uma tarefa não cria o perfil.

3. 3.

   Defina as três variáveis de ambiente

   Defina TARGET_URL como a URL completa da página HTTPS sob seu controle, SOLVETHREE_PROXY como a URL do proxy e SOLVETHREE_API_KEY como a chave de API do seu espaço de trabalho. Execute o script no servidor; não coloque a chave de API no JavaScript da página. O exemplo usa a ação login, que você deve alterar se sua aplicação usar outra ação.

4. 4.

   Disponibilize o formulário de exemplo

   A página deve conter uma textarea chamada g-recaptcha-response e um botão cujo nome acessível seja exatamente Submit. Se seu formulário for diferente, adapte a transferência descrita abaixo antes de executá-la.

O proxy da tarefa e o proxy do navegador do Playwright são configurados separadamente. Um proxy no contexto do navegador não roteia automaticamente as requisições de API do SDK feitas no servidor. Este exemplo fornece um proxy à tarefa e o reutiliza para o tráfego do navegador destinado ao site de destino.

// Install playwright and the official solvethree SDK first.
import { chromium } from 'playwright';
import { Solvethree } from '@solvethree/sdk';

const target = new URL(process.env.TARGET_URL); // Your configured HTTPS page.
const proxy = new URL(process.env.SOLVETHREE_PROXY);
const client = new Solvethree({ apiKey: process.env.SOLVETHREE_API_KEY });
const result = await client.solve({
  site: target.hostname, action: 'login', proxy: process.env.SOLVETHREE_PROXY,
});
const browser = await chromium.launch();
try {
  const context = await browser.newContext({
    proxy: {
      server: `${proxy.protocol}//${proxy.host}`,
      username: decodeURIComponent(proxy.username),
      password: decodeURIComponent(proxy.password),
    },
    userAgent: result.solution.userAgent,
    extraHTTPHeaders: { 'sec-ch-ua': result.solution.secChUa },
  });
  const page = await context.newPage();
  await page.goto(target.href);
  // This example form has this field and a button named Submit.
  // Adapt the selectors/callback to your own application's form contract.
  await page.locator('[name="g-recaptcha-response"]').waitFor({ state: 'attached' });
  await page.locator('[name="g-recaptcha-response"]').evaluate((field, token) => {
    field.value = token;
    field.dispatchEvent(new Event('input', { bubbles: true }));
  }, result.solution.token);
  await Promise.all([
    page.waitForResponse(response =>
      response.request().method() === 'POST' &&
      new URL(response.url()).origin === target.origin),
    page.getByRole('button', { name: 'Submit', exact: true }).click(),
  ]);
  // Check your application's success response here.
} finally {
  await browser.close();
}

solve cria a tarefa uma única vez e consulta seu status até que esteja pronta ou lance uma exceção. O navegador só é iniciado após essa chamada ser bem-sucedida. Seu contexto usa o proxy original, incluindo quaisquer credenciais codificadas em URL, e os valores retornados de solution.userAgent e solution.secChUa.

O formulário recebe solution.token, não o ID da tarefa. O exemplo aguarda o campo ser anexado ao DOM, pois uma textarea de token não precisa estar visível. Ele atribui o token, dispara um evento de entrada e depois clica em Submit.

• TARGET_URL pertence à sua aplicação. A tarefa de resolução recebe seu hostname como site; o Playwright navega até a URL completa.
• login é a ação do exemplo. Substitua-a pela ação usada pela sua aplicação.
• [name="g-recaptcha-response"] é o seletor do campo de token do exemplo. Substitua-o se sua aplicação esperar o token em outro campo ou parâmetro de requisição.
• Submit é o nome acessível do botão do exemplo. Substitua esse localizador ou use o fluxo de envio real da sua aplicação.
• O evento de entrada faz parte da transferência nesta demonstração. Uma aplicação real também pode exigir um callback, uma atualização do estado da aplicação, um valor de CSRF ou uma sessão existente. Não há um callback universal para preencher o token.

Antes de pagar por outra resolução, inspecione a requisição de saída da aplicação usando a observação de requisições e respostas do Playwright. Uma tarefa pronta significa que há uma solução disponível; a resposta da aplicação informa se o envio foi aceito.

O token enviado está ausente ou não foi alterado.

Inspecione o parâmetro real da requisição, não apenas o valor da textarea.

Experimente: Passe solution.token pelo fluxo de envio real da aplicação. Atualizar o campo da demonstração não ajudará se a aplicação montar a requisição a partir de um estado separado.

A requisição contém o token, mas é rejeitada.

Compare o proxy, o user agent, os client hints, o hostname de destino e a ação do envio com os da resolução. Verifique os requisitos de sessão e CSRF da aplicação.

Experimente: Mantenha a resolução e o envio no mesmo proxy, aplique a identidade de navegador retornada e atenda aos requisitos do formulário da aplicação antes de enviar.

O script falha antes de abrir o navegador.

Diferencie um erro de requisição HTTP de uma falha terminal da tarefa. Para uma tarefa com falha, inspecione errorCode e error.

Experimente: Corrija o problema de entrada, perfil ou conectividade informado em vez de reenviar repetidamente as mesmas entradas. O SDK lança uma exceção em caso de falha; não prossiga para a etapa de preenchimento do token.