Como detectar solicitações com falha por meio de extensões da Web

Uma das melhores coisas que já aconteceu com a experiência do usuário na Web foram as extensões da Web. Os navegadores são avançados, mas as extensões trazem um novo nível de funcionalidade. Quer se trate de carteiras de criptomoedas, reprodutores de mídia ou outros plug-ins populares, as extensões da Web tornaram-se essenciais para as tarefas diárias.

Ao trabalhar na MetaMask, sou empurrado para o mundo de fazer tudo o que é centrado no Ethereum funcionar. Uma dessas funcionalidades é garantir que o .eth sejam resolvidos para ENS quando inseridos na barra de endereços. Solicitações para https://vitalik.ethnaturalmente falham, pois o .eth não é um domínio de nível superior suportado nativamente, portanto, precisamos interceptar essa solicitação errônea.

// Add an onErrorOccurred event via the browser.webRequest extension API
browser.webRequest.onErrorOccurred.addListener((details) => {
  const { tabId, url } = details;
  const { hostname } = new URL(url);

  if(hostname.endsWith('.eth')) {
    // Redirect to wherever I want the user to go
    browser.tabs.update(tabId, { url: `https://app.ens.domains/${hostname}}` });
  }
},
{
  urls:[`*://*.eth/*`],
  types: ['main_frame'],
});

As extensões da Web fornecem um browser.webRequest.onErrorOccurred que os desenvolvedores podem conectar para ouvir solicitações errantes. Essa API faz não captura 4** e 5** erros de resposta. No caso acima, procuramos por .eth e redirecionamos para o ENS.

O senhor poderia usar onErrorOccurred por uma série de razões, mas detectar nomes de host personalizados é uma ótima opção!