Monitorar e proteger apps da Web

Depois de publicar seus apps, monitore e proteja-os:

• Se você publicar com o Firebase Hosting, vincule seu projeto do Firebase ao Cloud Logging para monitorar o uso e acessar os registros de solicitações da Web. Saiba mais em Acessar, pesquisar e filtrar seus registros de solicitações da Web com o Cloud Logging.

• Se você utilizar o App Prototyping agent para publicar com o Firebase App Hosting, use os recursos de observabilidade para monitorar o desempenho do seu site. Também é possível gravar registros no Cloud Logging e ver registros e métricas no console do Firebase.

• Se você usar a IA no seu aplicativo com o Genkit, monitore como os recursos de IA generativa são executados na produção.

• Se o app incluir serviços do Firebase, proteja-os com o Firebase App Check.

Monitorar o desempenho do site com a observabilidade do App Hosting

O painel Visão geral do app no Firebase Studio fornece métricas e informações importantes sobre seu app, permitindo que você monitore o desempenho do seu app da Web usando as ferramentas de observação integradas do App Hosting. Depois que o site for lançado, acesse a visão geral clicando em Publicar. Neste painel, é possível:

• Clique em Publicar para lançar uma nova versão do app.
• Compartilhar o link do aplicativo ou abri-lo diretamente em Acessar seu app.
• Analisar um resumo do desempenho do aplicativo nos últimos sete dias, incluindo o número total de solicitações e o status do lançamento mais recente. Clique em Ver detalhes para acessar ainda mais informações no console do Firebase.
• Veja um gráfico com o número de solicitações que seu aplicativo recebeu nas últimas 24 horas, dividido por código de status HTTP.

Se você fechar o painel de visão geral do aplicativo, poderá reabri-lo a qualquer momento clicando em Publicar.

Saiba mais sobre como gerenciar e monitorar lançamentos do App Hosting em Gerenciar lançamentos e versões.

Monitoramento do Genkit para seus recursos implantados

É possível monitorar as etapas, entradas e saídas de recursos do Genkit ativando a telemetria no código do seu fluxo de IA. O recurso de telemetria do Genkit permite monitorar o desempenho e o uso dos fluxos de IA. Esses dados podem ajudar a identificar áreas para melhoria, resolver problemas, otimizar comandos e fluxos para melhorar o desempenho e a economia e acompanhar o uso dos fluxos ao longo do tempo.

Para configurar o monitoramento no Genkit, adicione a telemetria aos fluxos de IA do Genkit e confira os resultados no console do Firebase.

Importante: o monitoramento do Genkit depende dos dados de telemetria gravados no Google Cloud Logging, Metrics e Trace, que são serviços pagos. Acesse a página Preços do Google Cloud Observability para ver detalhes de preços e saber mais sobre os limites do nível sem custo financeiro.

Etapa 1: adicionar a telemetria ao código do fluxo do Genkit no Firebase Studio

Para configurar o monitoramento no seu código:

1. Se você ainda não estiver na visualização do Code, clique em Mudar para o Code para abri-lo.

2. Verifique o package.json para confirmar a versão do Genkit que está instalada.

3. Abra o terminal (Ctrl-Shift-C ou Cmd-Shift-C no macOS).

4. Clique no terminal e instale o plug-in do Firebase usando a versão que corresponde ao arquivo package.json. Por exemplo, se os pacotes do Genkit no package.json estiverem na versão 1.0.4, execute o comando abaixo para instalar o plug-in:

   npm i --save @genkit-ai/firebase@1.0.4

5. No Explorador, expanda src > ai > flows. Um ou mais arquivos TypeScript que contêm seus fluxos do Genkit aparecem na pasta flows.

6. Clique em um dos fluxos para abri-lo.

   Dica: observe a seção do prompt do arquivo. É possível editá-la manualmente para refinar as respostas do Gemini.

7. Na parte inferior da seção de importações do arquivo, faça as adições a seguir para importar e ativar o FirebaseTelemetry:

   import { enableFirebaseTelemetry } from '@genkit-ai/firebase';
   
   enableFirebaseTelemetry();
   

   Dica: para saber mais sobre as opções de telemetria avançada no Genkit, consulte Configuração avançada.

Etapa 2: configurar permissões

O Firebase Studio ativou as APIs necessárias para você ao configurar seu projeto do Firebase, mas você também precisa fornecer permissões à conta de serviço do App Hosting.

Para configurar as permissões:

1. Abra o console do Google Cloud IAM, selecione seu projeto e conceda os seguintes papéis à conta de serviço do App Hosting:

   • Gravador de métricas do Monitoring (roles/monitoring.metricWriter)
   • Agente do Cloud Trace (roles/cloudtrace.agent)
   • Gravador de registros (roles/logging.logWriter)

2. Republique seu app no App Hosting.

3. Quando a publicação for concluída, carregue o aplicativo e comece a usá-lo. Após cinco minutos, o aplicativo começará a registrar dados de telemetria.

Etapa 3: monitorar os recursos de IA generativa no console do Firebase

Quando a telemetria está configurada, o Genkit registra o número de solicitações, o sucesso e a latência de todos os fluxos. Para cada fluxo específico, o Genkit coleta métricas de estabilidade, mostra gráficos detalhados e registra os traces capturados.

Para monitorar os recursos de IA implementados com o Genkit:

1. Após cinco minutos, abra o Genkit no console do Firebase e analise os comandos e as respostas do Genkit.

   O Genkit compila as seguintes métricas de estabilidade:

   • Solicitações totais: é o número total de solicitações recebidas pelo seu fluxo.
   • Taxa de sucesso: a porcentagem de solicitações que foram processadas com êxito.
   • Latência do 95º percentil: a latência do 95º percentil do fluxo, que é o tempo necessário para processar 95% das solicitações.

   • Uso de tokens:

     • Tokens de entrada: o número de tokens enviados ao modelo no comando.
     • Tokens de saída: o número de tokens gerados pelo modelo na resposta.

   • Uso de imagens:

     • Imagens de entrada: o número de imagens enviadas ao modelo no comando.
     • Imagens de saída: o número de imagens geradas pelo modelo na resposta.

   Se você expandir as métricas de estabilidade, gráficos detalhados estarão disponíveis:

   • Volume de solicitações ao longo do tempo.
   • Taxa de sucesso ao longo do tempo.
   • Tokens de entrada e saída ao longo do tempo.
   • Latência (95º e 50º percentil) ao longo do tempo.

Saiba mais sobre o Genkit no Genkit.

Proteger seu app com o Firebase App Check

Se você integrou os serviços do Firebase ou do Google Cloud ao seu app, o Firebase App Check ajuda a proteger os back-ends do app contra abusos, impedindo que clientes não autorizados acessem seus recursos do Firebase. Ele funciona com os Serviços do Google (incluindo o Firebase e o Google Cloud) e com seus próprios back-ends personalizados para manter seus recursos seguros.

Recomendamos adicionar App Check a qualquer app que você publicar publicamente para proteger seus recursos de back-end contra abuso.

Esta seção orienta você a configurar App Check no Firebase Studio usando o reCAPTCHA Enterprise para um app da Web criado pelo App Prototyping agent. No entanto, é possível configurar App Check em qualquer app que implemente serviços do Firebase e possa implementar provedores personalizados. Saiba mais no Firebase App Check.

O reCAPTCHA Enterprise oferece até 10.000 avaliações sem custos.

Etapa 1: configurar o reCAPTCHA Enterprise para seu app

1. Abra a seção reCAPTCHA Enterprise do console do Google Cloud.

2. Selecione o nome do seu Projeto do Firebase no seletor de projetos do console do Google Cloud.

3. Se você precisar ativar a API reCAPTCHA Enterprise, faça isso.

4. Clique em Começar e adicione um Nome de exibição para a chave do site do reCAPTCHA.

5. Aceite a chave padrão Tipo de aplicativo da Web.

6. Clique em Adicionar um domínio e selecione uma opção. Adicione o domínio App Hosting (por exemplo, studio--PROJECT_ID.REGION.hosted.app) e todos os domínios personalizados que você usa ou planeja usar com o app.

7. Clique em Próxima etapa.

8. Deixe a opção Você vai usar desafios? desmarcada.

9. Clique em Criar chave.

10. Copie e salve o ID da chave e prossiga para Configurar App Check.

Etapa 2: configurar o App Check

1. Abra o console do Firebase e clique em Build > App Check no menu de navegação.

2. Clique em Começar e em Registrar ao lado do app.

3. Clique para expandir ReCAPTCHA e cole o ID da chave que você gerou para o reCAPTCHA Enterprise.

4. Clique em Salvar.

Etapa 3: adicionar o App Check ao código

1. Volte para o Firebase Studio e, na visualização Code, adicione a chave do site gerada ao arquivo .env:

   NEXT_PUBLIC_RECAPTCHA_SITE_KEY=RECAPTCHA_SITE_KEY
   

2. Se você ainda não tiver a configuração do Firebase salva em .env, faça o seguinte:

   • No console do Firebase, abra Configurações do projeto e localize-o na seção que corresponde ao seu app.

   • Na visualização Code do terminal:

     1. Faça login no Firebase: firebase auth login
     2. Selecione o projeto: firebase use FIREBASE_PROJECT_ID
     3. Receba a configuração do Firebase: firebase apps:sdkconfig

3. Adicione a configuração ao arquivo .env para que ele fique assim:

   NEXT_PUBLIC_FIREBASE_API_KEY=FIREBASE_API_KEY
   NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=FIREBASE_AUTH_DOMAIN
   NEXT_PUBLIC_FIREBASE_PROJECT_ID=FIREBASE_PROJECT_ID
   NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=FIREBASE_STORAGE_BUCKET
   NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=FIREBASE_MESSAGING_SENDER_ID
   NEXT_PUBLIC_FIREBASE_APP_ID=FIREBASE_APP_ID
   NEXT_PUBLIC_RECAPTCHA_SITE_KEY=RECAPTCHA_SITE_KEY
   

4. Adicione o App Check ao código do app. Você pode pedir ao Gemini para adicionar App Check com o reCAPTCHA Enterprise ao seu app. Especifique "reCAPTCHA Enterprise" e confira novamente. Siga as etapas em Inicializar App Check.

5. Republique seu site no App Hosting. Teste seus recursos do Firebase para gerar alguns dados.

6. Para verificar se o App Check está recebendo solicitações no console Firebase, abra Build > App Check.

7. Clique para inspecionar os serviços do Firebase. Depois de verificar se as solicitações estão chegando, clique em Aplicar para aplicar o App Check.

8. Repita a verificação e a aplicação para o Firebase Authentication.

Se, depois de registrar seu aplicativo no App Check, você quiser executá-lo em um ambiente em que o App Check normalmente não seria classificado como válido, como localmente, durante o desenvolvimento ou em uma integração contínua (CI), crie um build de depuração do seu app que use o provedor de depuração do App Check em vez de um provedor de atestado real. Saiba mais em Usar o App Check com o provedor de depuração em apps da Web.

Próximas etapas

• Personalize seu espaço de trabalho do Firebase Studio.

• Desenvolva, publique e monitore um web app de pilha completa com o App Prototyping agent.