Skip to content
Advertisement

Using JavaScript in Browser’s Bookmarklet to Edit the URL with Regex

So I know it’s possible to run JavaScript by storing them in the browser’s bookmark (aka. bookmarklet), but I’m not sure if it’s possible to use bookmarklet to auto-edit the current URL (and then bring you to the new URL).

What I’m trying to do:

In the URL, replace everything before (and including) the string

/image/thumb/

with

https://a1.mzstatic.com/us/r1000/0/

and remove everything after (and including) the last

/

So for example, the following URL:

https://is2-ssl.mzstatic.com/image/thumb/Music/v4/4e/61/09/4e610911-7e0e-d348-8246-11ef6ffe00ab/886443607118.jpg/540x540bb.webp

should become (and redirect to)

https://a1.mzstatic.com/us/r1000/0/Music/v4/4e/61/09/4e610911-7e0e-d348-8246-11ef6ffe00ab/886443607118.jpg

after clicking on the bookmark with JavaScript.


Some more examples:

https://is2-ssl.mzstatic.com/image/thumb/Features122/v4/b0/26/80/b0268001-9527-3477-1df2-c68f02271a9f/ffe8be4a-2798-4a68-b691-9a91edb1c177.png/216x216sr.webp

should become (and redirect to)

https://a1.mzstatic.com/us/r1000/0/Features122/v4/b0/26/80/b0268001-9527-3477-1df2-c68f02271a9f/ffe8be4a-2798-4a68-b691-9a91edb1c177.png

https://is4-ssl.mzstatic.com/image/thumb/Video124/v4/ac/c2/b0/acc2b0a3-8105-2f22-2b0d-ea274223e959/Jobe81235fa-44f7-43f8-a7d6-421093c13e0b-110141253-PreviewImage_preview_image_nonvideo_sdr-Time1616098999993.png/300x300.jpg

should become (and redirect to)

https://a1.mzstatic.com/us/r1000/0/Video124/v4/ac/c2/b0/acc2b0a3-8105-2f22-2b0d-ea274223e959/Jobe81235fa-44f7-43f8-a7d6-421093c13e0b-110141253-PreviewImage_preview_image_nonvideo_sdr-Time1616098999993.png

Answer

Use String.prototype.match(regExp) to get the url part which you want and then combine the url part with your url prefix.

function replaceUrl(url) {
   const prefix = 'https://a1.mzstatic.com/us/r1000/0';
   const lastPart = url.split("/image/thumb/")[1];
   const match = lastPart ? lastPart.slice(0, lastPart.lastIndexOf("/")) : null;
   const targetUrl = match ? `${prefix}/${match}` : url;
   return targetUrl;
}
const targetUrl = replaceUrl('https://is2-ssl.mzstatic.com/image/thumb/Music/v4/4e/61/09/4e610911-7e0e-d348-8246-11ef6ffe00ab/886443607118.jpg/540x540bb.webp');

Add a bookmarklet, the bookmarklet’s script is like:

javascript:(function(){
  function replaceUrl(url) {
   const prefix = 'https://a1.mzstatic.com/us/r1000/0';
   const lastPart = url.split("/image/thumb/")[1];
   const match = lastPart ? lastPart.slice(0, lastPart.lastIndexOf("/")) : null;
   const targetUrl = match ? `${prefix}/${match}` : url;
    return targetUrl;
 }
 const targetUrl = replaceUrl(location.href);
 window.open(targetUrl,"_blank");
})()

The location.href is the url of current tab, you can change it to whatever you need (may be url from links of current page etc.). the second parameter of window.open() could be _blank(open in a new tab) or _self(open in current tab)

Advertisement