wehub-resource-sync
5.9 KiB
Construindo Agentes de Uso de Computador (CUA)
Agentes de uso de computador podem interagir com sites da mesma forma que uma pessoa: abrindo um navegador, inspecionando a página e tomando a melhor ação seguinte com base no que veem. Nesta lição, você construirá um agente de automação de navegador que pesquisa no Airbnb, extrai dados estruturados de anúncios e identifica a estadia mais barata em Estocolmo.
A lição combina Browser-Use para navegação guiada por IA, Playwright e Chrome DevTools Protocol (CDP) para controle do navegador, Azure OpenAI para raciocínio habilitado por visão, e Pydantic para extração estruturada.
Introdução
Esta lição abordará:
- Entender quando agentes de uso de computador são mais adequados do que automação apenas via API
- Combinar Browser-Use com Playwright e CDP para gerenciamento confiável do ciclo de vida do navegador
- Usar Azure OpenAI vision e saída estruturada Pydantic para extrair dados de anúncios de páginas web dinâmicas
- Decidir quando usar um fluxo de trabalho de automação de navegador centrado em agente, ator ou híbrido
Objetivos de Aprendizagem
Após completar esta lição, você saberá como:
- Configurar Browser-Use com Azure OpenAI e Playwright
- Construir um fluxo de trabalho de automação de navegador que navega por um site real e lida com elementos dinâmicos da interface
- Extrair resultados tipados do conteúdo visível da página e transformá-los em lógica de negócio a jusante
- Escolher entre os padrões agente e ator baseado na previsibilidade da tarefa no navegador
Exemplo de Código
Esta lição inclui um tutorial em notebook:
- 15-browser-user.ipynb: Inicializa uma sessão Chrome via CDP, pesquisa anúncios no Airbnb para Estocolmo, extrai preços com a visão do Browser-Use e retorna a opção mais barata como dados estruturados.
Pré-requisitos
- Python 3.12+
- Implantação do Azure OpenAI configurada em seu ambiente
- Chrome ou Chromium instalado localmente
- Dependências do Playwright instaladas
- Familiaridade básica com Python assíncrono
Configuração
Instale os pacotes usados no notebook:
pip install browser_use playwright python-dotenv
playwright install chromium
Configure as variáveis de ambiente do Azure OpenAI usadas pelo notebook:
AZURE_OPENAI_ENDPOINT=...
AZURE_OPENAI_API_KEY=...
AZURE_OPENAI_CHAT_DEPLOYMENT_NAME=...
# Opcional: padrão para a versão mais recente da API quando omitido
AZURE_OPENAI_API_VERSION=...
Visão Geral da Arquitetura
O notebook demonstra um fluxo de trabalho híbrido de automação de navegador:
- O Chrome inicia com CDP habilitado para que tanto Playwright quanto Browser-Use possam compartilhar a mesma sessão do navegador.
- Um agente Browser-Use lida com tarefas de navegação abertas como abrir Airbnb, fechar pop-ups e buscar Estocolmo.
- A página ativa é inspecionada com um esquema Pydantic estruturado para extrair títulos de anúncios, preços noturnos, avaliações e URLs.
- A lógica Python compara os anúncios extraídos e destaca o resultado mais barato.
Esta abordagem mantém o raciocínio flexível baseado em visão que o Browser-Use oferece ao mesmo tempo que lhe dá controle determinístico do navegador quando necessário.
Principais Lições e Boas Práticas
Quando Usar Agente vs Ator
| Cenário | Usar Agente | Usar Ator |
|---|---|---|
| Layouts dinâmicos | Sim, IA pode se adaptar a mudanças de página | Não, seletores frágeis podem quebrar |
| Estrutura conhecida | Não, agente é mais lento que controle direto | Sim, rápido e preciso |
| Encontrar elementos | Sim, linguagem natural funciona bem | Não, seletores exatos são necessários |
| Controle de tempo | Não, menos previsível | Sim, controle total sobre waits e retries |
| Fluxos complexos | Sim, lida com estados inesperados da UI | Não, requer ramificação explícita |
Boas Práticas do Browser-Use
- Comece com um agente para exploração e navegação dinâmica.
- Troque para controle direto da página quando a interação ficar previsível.
- Use modelos de saída estruturada para que os dados extraídos sejam validados e tipados.
- Adicione atrasos estrategicamente após ações que disparam mudanças visíveis na UI.
- Capture capturas de tela enquanto itera para facilitar a depuração de falhas.
- Espere que sites mudem e projete estratégias de contingência para pop-ups e mudanças no layout.
- Misture padrões agente e ator para obter tanto flexibilidade quanto precisão.
Aplicações do Mundo Real
- Reserva de viagens e monitoramento de preços
- Comparação de preços e checagem de disponibilidade em e-commerce
- Extração estruturada de sites dinâmicos
- Testes e verificação de UI habilitados por visão
- Monitoramento de sites e alertas
- Preenchimento inteligente de formulários em fluxos multi-etapas
Recursos Adicionais
- Template de integração Browser-Use Playwright
- Parâmetros do ator Browser-Use e extração de conteúdo
- Configuração do Curso
Aviso Legal:
Este documento foi traduzido utilizando o serviço de tradução por IA Co-op Translator. Embora nos esforcemos para garantir a precisão, por favor, esteja ciente de que traduções automáticas podem conter erros ou imprecisões. O documento original em seu idioma nativo deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se tradução profissional realizada por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas decorrentes do uso desta tradução.