Software

Detect Failed Requests through Net Extensions


Top-of-the-line issues that ever occurred to t he consumer expertise of the net has been internet extensions. Browsers are highly effective however extensions convey a brand new degree of performance. Whether or not it is crypto wallets, media gamers, or different in style plugins, internet extensions have develop into important to daily duties.

Engaged on MetaMask, I’m thrust right into a world of constructing every little thing Ethereum-centric work. A kind of functionalities is guaranteeing that .eth domains resolve to ENS when enter to the tackle bar. Requests to https://vitalik.ethnaturally fail, since .eth is not a natively supported high degree area, so we have to intercept this errant request.

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

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

Net extensions present a browser.webRequest.onErrorOccurred technique that builders can plug into to hear for errant requests. This API does not catch 4** and 5** response errors. Within the case above, we search for .eth hostnames and redirect to ENS.

You could possibly make use of onErrorOccurred for any variety of causes, however detecting customized hostnames is a good one!

  • CSS Animations Between Media Queries

    CSS Animations Between Media Queries

    CSS animations are proper up there with sliced bread. CSS animations are environment friendly as a result of they are often {hardware} accelerated, they require no JavaScript overhead, and they’re composed of little or no CSS code. Very often we add CSS transforms to components through CSS throughout…

  • CSS @supports

    CSS @helps

    Characteristic detection through JavaScript is a consumer aspect greatest follow and for all the fitting causes, however sadly that very same performance hasn’t been obtainable inside CSS.  What we find yourself doing is repeating the identical properties a number of instances with every browser prefix.  Yuck.  One other factor we…

  • Sara Soueidan’s Favorite CodePen Demos
  • AJAX Username Availability Checker Using MooTools

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button