This content originally appeared on David Walsh Blog and was authored by David Walsh
One of the best things that ever happened to t he user experience of the web has been web extensions. Browsers are powerful but extensions bring a new level of functionality. Whether it’s crypto wallets, media players, or other popular plugins, web extensions have become essential to every day tasks.
Working on MetaMask, I am thrust into a world of making everything Ethereum-centric work. One of those functionalities is ensuring that .eth domains resolve to ENS when input to the address bar. Requests to https://vitalik.ethnaturally fail, since .eth isn’t a natively supported top level domain, so we need to intercept this errant request.
// 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'],
});
Web extensions provide a browser.webRequest.onErrorOccurred method that developers can plug into to listen for errant requests. This API does not catch 4** and 5** response errors. In the case above, we look for .eth hostnames and redirect to ENS.
You could employ onErrorOccurred for any number of reasons, but detecting custom hostnames is a great one!
The post How to Detect Failed Requests via Web Extensions appeared first on David Walsh Blog.
This content originally appeared on David Walsh Blog and was authored by David Walsh
David Walsh | Sciencx (2023-10-02T13:37:25+00:00) How to Detect Failed Requests via Web Extensions. Retrieved from https://www.scien.cx/2023/10/02/how-to-detect-failed-requests-via-web-extensions/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.