Depurar serviços em segundo plano

A seção Serviços em Segundo plano do Microsoft Edge DevTools é uma coleção de ferramentas para as APIs Web que permitem que seu site envie e receba dados mesmo quando um usuário não usa seu site e permitem que o navegador relate problemas de produção para seu servidor.

O DevTools do Microsoft Edge considera cada uma das seguintes APIs como um serviço em segundo plano:

• Busca em segundo plano
• Sincronização em segundo plano
• Notificações
• Manipulador de pagamento
• Sincronização periódica em segundo plano
• Mensagens por push
• API de relatório

A seção Serviços em Segundo plano registra eventos de API, mesmo quando você não está usando o DevTools, para ajudá-lo a garantir que os eventos sejam enviados e recebidos conforme o esperado.

Busca em segundo plano

A API de Busca em Segundo Plano permite que o service worker de um Progressive Web App baixe de forma confiável grandes recursos, como filmes ou podcasts, como um serviço em segundo plano. Para registrar eventos de Busca em Segundo Plano por três dias, mesmo quando o DevTools não está aberto:

1. Abra o DevTools clicando com o botão direito do mouse na página da Web e selecionando Inspecionar. Ou pressionando Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em segundo plano , selecione Busca em segundo plano. A página de Busca em Segundo Plano é aberta.

   

4. Clique em Gravar (). Depois de disparar algumas atividades de busca em segundo plano, o DevTools registra os eventos na tabela.

   

5. Clique em um evento para exibir seus detalhes no espaço abaixo da tabela.

   

Sincronização em segundo plano

A API de sincronização em segundo plano permite que o service worker offline de um Progressive Web App envie dados para um servidor depois de restabelecer uma conexão confiável com a Internet. Para registrar eventos de Sincronização em Segundo Plano por três dias, mesmo quando o DevTools não está aberto:

1. Abra o DevTools clicando com o botão direito do mouse na página da Web e selecionando Inspecionar. Ou pressionando Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em segundo plano , selecione Sincronização em segundo plano. A página Sincronização em Segundo Plano é aberta.

   

4. Clique em Gravar (). Depois de disparar algumas atividades de sincronização em segundo plano, o DevTools registra os eventos na tabela.

   

5. Selecione um evento para exibir seus detalhes no espaço abaixo da tabela.

   

Notificações

Depois que um service worker recebe uma mensagem push de um servidor, ele usa a API de notificações para exibir os dados para um usuário. Para registrar notificações por 3 dias, mesmo quando o DevTools não está aberto:

1. Abra o DevTools clicando com o botão direito do mouse na página da Web e selecionando Inspecionar. Ou pressionando Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em segundo plano , selecione Notificações. A página Notificações é aberta.

   

4. Clique em Gravar (). Depois de disparar algumas atividades de notificações, o DevTools registra os eventos na tabela.

   

5. Clique em um evento para exibir seus detalhes no espaço abaixo da tabela.

   

Manipulador de pagamento

A API do manipulador de pagamento permite que aplicativos da web lidem com solicitações de pagamento em nome dos usuários. Veja a API do manipulador de pagamentos no MDN.

Para registrar a solicitação de pagamento e os eventos de resposta por três dias, mesmo quando o DevTools não está aberto:

1. Clique com o botão direito do mouse na página da Web e selecione Inspecionar. O DevTools é aberto.

   Ou pressione Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em segundo plano , selecione Manipulador de pagamento. A página Manipulador de Pagamento é aberta.

   

4. Clique em Gravar (). Depois de disparar algumas solicitações de pagamento, o DevTools registra os eventos na tabela.

   

5. Clique em um evento para exibir seus detalhes no espaço abaixo da tabela.

   

Sincronização periódica em segundo plano

A API de Sincronização em Segundo Plano Periódica permite que o service worker de um Aplicativo Web Progressivo recupere dados de um servidor, periodicamente, mesmo quando o site não é aberto. Consulte Usar a API de Sincronização em Segundo Plano Periódica para obter regularmente conteúdo atualizado em Sincronizar e atualizar um PWA em segundo plano.

Para registrar eventos periódicos de sincronização em segundo plano por três dias, mesmo quando o DevTools não estiver aberto:

1. Abra o DevTools clicando com o botão direito do mouse na página da Web e selecionando Inspecionar. Ou pressionando Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em Segundo Plano , selecione Sincronização em Segundo Plano Periódica. A página Sincronização periódica em segundo plano é aberta.

   

4. Clique em Gravar (). Depois de disparar algumas atividades periódicas de sincronização em segundo plano, o DevTools registra os eventos na tabela.

   

Mensagens por push

Para exibir uma notificação por push para um usuário, o service worker de um Progressive Web App deve primeiro usar a API de Mensagem por Push para receber dados de um servidor. Quando o service worker estiver pronto para exibir a notificação, ele usará a API de notificações. Para registrar mensagens por push por 3 dias, mesmo quando o DevTools não está aberto:

1. Abra o DevTools clicando com o botão direito do mouse na página da Web e selecionando Inspecionar. Ou pressionando Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em segundo plano , selecione Enviar mensagens por push. A página Mensagens por Push é aberta.

   

4. Clique em Gravar (). Depois de disparar algumas atividades de mensagem por push, o DevTools registra os eventos na tabela.

   

5. Clique em um evento para exibir os detalhes no espaço abaixo da tabela.

   

API de relatório

A API de relatórios permite que os desenvolvedores da Web recebam relatórios de violações de segurança, chamadas de API preteridas e outros de seus sites de produção.

Para ver os relatórios que foram enviados pelo navegador usando a API de relatórios:

1. Abra o DevTools clicando com o botão direito do mouse na página da Web e selecionando Inspecionar. Ou pressionando Ctrl+Shift+I (Windows, Linux) ou Command+Option+I (macOS).

2. No DevTools, na barra de ferramentas principal, selecione a guia Aplicativo . Se essa guia não estiver visível, clique no botão Mais guias () ou no botão Mais Ferramentas ().

3. À esquerda, na seção Serviços em segundo plano , selecione API de relatórios. A página da API de relatório é aberta.

   

4. A página API de relatório exibe os relatórios enviados na tabela na parte superior.

   

5. Clique em um relatório para exibir os detalhes no espaço abaixo da tabela.

   

6. A página da API de relatório também exibe a lista de pontos de extremidade de relatório configurados por meio do Reporting-Endpoints cabeçalho HTTP na tabela na parte inferior.