Google Analytics off-line mais fácil

Você tem um app da Web progressivo, com um service worker que permite que ele funcione off-line. Ótimo! Você também configurou o Google Analytics para seu app da Web e não quer perder nenhum insight analítico do uso que ocorre off-line. No entanto, se você tentar enviar dados ao Google Analytics off-line, essas solicitações vão falhar e os dados serão perdidos.

A solução, não é surpresa, são os service workers. Especificamente, ele adiciona código ao seu worker de serviço para armazenar solicitações do Google Analytics (usando IndexedDB) e tentar novamente mais tarde, quando houver uma rede disponível. Compartilhávamos o código para processar essa lógica como parte do app da Web do Google I/O de código aberto, mas percebemos que esse era um padrão útil e que copiar e colar código pode ser frágil.

Hoje, temos o prazer de anunciar que tudo o que você precisa para processar solicitações do Google Analytics off-line no seu worker de serviço foi agrupado em um pacote npm: npm install --save-dev sw-offline-google-analytics

Como usar o sw-offline-google-analytics

No código do service worker atual, adicione o seguinte:

// This code should live inside your service worker JavaScript, ideally
// before any other 'fetch' event handlers are defined:

// First, import the library into the service worker global scope:
importScripts('path/to/offline-google-analytics-import.js');

// Then, call goog.offlineGoogleAnalytics.initialize():
// See https://github.com/GoogleChrome/workbox/tree/main/packages/workbox-google-analytics
goog.offlineGoogleAnalytics.initialize();

// At this point, implement any other service worker caching strategies
// appropriate for your web app.

Isso é tudo!

O que está acontecendo por trás dos bastidores?

sw-offline-google-analytics configura um novo manipulador de eventos fetch no seu worker de serviço, que responde a solicitações feitas ao domínio do Google Analytics. A biblioteca ignora solicitações que não são do Google Analytics, aos outros manipuladores de eventos fetch do worker de serviço a chance de implementar estratégias adequadas para esses recursos. Primeiro, ele vai tentar atender à solicitação na rede. Se o usuário estiver on-line, o processo vai continuar normalmente.

Se a solicitação de rede falhar, a biblioteca armazenará automaticamente informações sobre a solicitação em IndexedDB, junto com um carimbo de data/hora indicando quando a solicitação foi feita inicialmente. Sempre que o worker de serviço é iniciado, a biblioteca verifica se há solicitações na fila e tenta reenviá-las, junto com alguns outros parâmetros do Google Analytics:

  • Um parâmetro qt, definido como o tempo decorrido desde a tentativa inicial da solicitação, para garantir que o tempo original seja atribuído corretamente.
  • Todos os parâmetros adicionais e valores fornecidos na propriedade parameterOverrides do objeto de configuração transmitidos para goog.offlineGoogleAnalytics.initialize(). Por exemplo, é possível incluir uma dimensão personalizada para distinguir as solicitações reenviadas pelo worker do serviço das que foram enviadas imediatamente.

Se o reenvio da solicitação for bem-sucedido, ótimo! A solicitação é removida do IndexedDB. Se a nova tentativa falhar e a solicitação inicial tiver sido feita há menos de 24 horas, ela será mantida em IndexedDB para ser repetida na próxima vez que o service worker for iniciado. Não há garantia de que as impressões do Google Analytics com mais de quatro horas serão processadas, mas não custa nada reenviar as impressões mais antigas "por via das dúvidas".

O sw-offline-google-analytics também implements uma estratégia "priorizar a rede, voltando ao cache" para o código JavaScript analytics.js real necessário para inicializar o Google Analytics.

Ainda tem mais!

sw-offline-google-analytics faz parte do projeto sw-helpers, que é uma coleção de bibliotecas destinada a fornecer melhorias de implementação de worker de serviço.

Também faz parte desse projeto o sw-appcache-behavior, uma biblioteca que implementa estratégias de armazenamento em cache definidas em um manifesto do AppCache em um service worker. O objetivo é ajudar você a migrar do AppCache para service workers, mantendo uma estratégia de cache consistente, pelo menos inicialmente.

Se você tiver outras ideias para a biblioteca, entre em contato. Envie uma solicitação no Issue Tracker.