WebPreview

Visualize apps web em execução no sandbox do Agent convertendo links localhost em URLs externas de preview do Buda.

O WebPreview permite visualizar um app web que está rodando dentro do sandbox do Agent. Você pode pedir ao Agent, em linguagem natural, para iniciar o app, aguardar um link localhost e abri-lo no seu Local Browser.

Quando usar WebPreview

Use WebPreview quando o Agent criar ou editar um site, demo, jogo, dashboard ou projeto frontend, e você quiser ver o resultado rodando no navegador.

Você pode pedir em linguagem natural:

Start the dev server and give me the preview link.
Please use /buda-web-preview to check the process and give me a working preview link.
Open the page in your Local Browser and check whether it works.

Fluxo básico

  1. Peça ao Agent para rodar o app web ou iniciar o preview.
  2. Aguarde até que o Agent mostre um link localhost, por exemplo:
http://localhost:3000
  1. Clique nesse link na página do Buda, ou abra o Local Browser (não use o AI Browser) e digite o link na barra de endereço.
  2. O Buda converte o link localhost em uma URL externa de preview, normalmente terminando em *.budaapps.com.
  3. Aguarde essa URL *.budaapps.com abrir no navegador.

O mesmo vale para outras portas. Por exemplo, se você digitar isto no seu Local Browser:

http://localhost:4000

O Buda solicita uma URL de preview para a porta 4000 e abre a página externa acessível.

Se o preview não carregar

Se a página ficar em branco, travada no carregamento ou mostrar erro, peça ao Agent para verificar se o app está rodando e retornar um link novo.

Bons prompts:

Please check whether the preview service is running and give me the preview link.
Please use /buda-web-preview to check the process and give me a preview link.
The preview did not load. Please check the dev server on port 3000 and give me a working link.

Se o seu Local Browser mostrar o botão Despertar, você também pode clicar nele. O Buda enviará uma solicitação de verificação ou reinício ao Agent e atualizará o preview quando o serviço voltar.

Deixe o app em preview pedir que o Agent continue

Esta seção é para quem constrói o app exibido no preview — um app App-in-Skill ou qualquer app web local.

Uma página aberta no Local Browser pode pedir que o Agent atual assuma uma tarefa, para que a pessoa não precise voltar ao chat e descrever o mesmo trabalho de novo. A página só pode pedir: o Buda mostra a solicitação na própria barra de confirmação e nada chega ao Agent até a pessoa clicar em Enviar ao agente.

Envie uma mensagem para a janela pai:

window.parent.postMessage(
  {
    type: "buda:agent-action-request",
    version: 1,
    requestId: "my-app:generate:7",
    prompt: "Leia drama/episode-7.json e continue produzindo este episódio.",
  },
  "*",
);

O que a pessoa vê

Uma barra no topo do preview com o texto do próprio Buda — Este aplicativo está pedindo ao agente para continuar o trabalho — o texto exato do prompt logo abaixo, um botão Enviar ao agente e um botão de fechar. Clicar em Enviar ao agente envia esse prompt para o chat atual como mensagem da própria pessoa.

Regras que a mensagem precisa seguir

Uma mensagem que quebre qualquer uma delas é ignorada em silêncio: nada aparece e nenhum erro é levantado.

RegraDetalhe
RemetentePrecisa vir da página carregada diretamente no preview. Um iframe aninhado chamando window.top.postMessage é rejeitado.
OrigemPrecisa coincidir exatamente com a origem da URL carregada no preview.
type / versionExatamente buda:agent-action-request e 1.
requestId1–128 caracteres de a-z A-Z 0-9 _ . : -. Uso único — depois que a pessoa envia ou dispensa, aquele id nunca mais aparece.
promptNão vazio após trim e com no máximo 4000 caracteres. Esse texto exato é o que a pessoa lê e o que é enviado.
Um de cada vezEnquanto uma solicitação aguarda confirmação, as seguintes são ignoradas. Envie a próxima depois que a barra sumir.
NavegaçãoLevar o preview para outra URL limpa a solicitação pendente e a lista de ids já usados.

O app não escolhe o texto da própria confirmação. Campos extras — incluindo o campo label que alguns rascunhos iniciais enviavam — são ignorados, e a barra sempre mostra o título do Buda mais o prompt bruto. Isso é proposital: o conteúdo do preview é entrada não confiável, então a pessoa precisa ver a instrução real antes de aprovar.

Q&A

Abri uma URL *.budaapps.com e apareceu Unauthorized. O que fazer?

Volte ao seu Local Browser e digite novamente a URL localhost original, por exemplo:

http://localhost:3000

O Buda solicitará uma nova URL de preview assinada e abrirá a página novamente.

O preview mostra Gateway Error. O que fazer?

O processo do app pode não estar rodando, ou pode estar em outra porta. Peça ao Agent:

Please use /buda-web-preview to check the process and give me a preview link.

Você também pode clicar em Despertar no seu Local Browser para acionar o mesmo fluxo de recuperação. Você pode abrir a página da buda-web-preview skill para ver os detalhes desta skill gerenciada pelo sistema.

Preciso saber o comando para iniciar o app?

Normalmente, não. Diga ao Agent o que você quer em linguagem natural, por exemplo:

Please start this project and show me the web preview.

O Agent deve inspecionar o projeto, iniciar o servidor correto e mostrar o link de preview.

On this page