Question

Good day everyone! I decided to try making an extension for Chrome for the first time and I have this idea but I don’t know how to start. I hope you’d point me to the right direction.

I want to detect if a certain URL is opened then change the value of one of its query strings. For example:

1. I open the page http://downloadpage.url/?page=info&id=123456
2. The extension will detect this and change the query string “page” value from “info” to “download” and continue opening the page with the new values.

How do I do this? I think the permissions needed would be WebRequest and WebRequestBlocking but I’m not sure. I tried the steps here: Detect if URL is opened – Chrome extension but it doesn’t seem to work even after changing background_page to background to account for my manifest’s version (my Chrome version is 21.0.1180.89). I was hoping I could just modify the code there but unfortunately it didn’t work for me and now I’m lost.

Answer 1

Following Rob W’s link in his comment above (Thanks Rob!) I came up with some code that works according to what I wanted. First I added the following to the manifest to run a content script when I’m in the intended URL:

  "content_scripts": [
     {
       "matches": [
          "http://downloadpage.url/*"
       ],
       "js": ["background.js"]
     }
  ]

Obviously the URL is fake…

Then created a file called background.js with the following function which makes it easy to grab the query strings. The original code came from here and I modified it a bit to make it reusable for other links or strings.:

function getQueryString(URL) {
  if (!URL) {
    URL = location.search;
  }
  else
  {
    var a = document.createElement('a');
    a.href = URL;
    URL = a.search;
  }

  var result = {}, queryString = URL.substring(1),
      re = /([^&=]+)=([^&]*)/g, m;

  while (m = re.exec(queryString)) {
    result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
  }

  return result;
}

Then finally the code that does the redirect with the modified query string is below:

if (page == "info")
{
  var ID = getQueryString()["id"];

  location.replace('http://downloadpage.url/?page=download&id='+ID;);
}

I’m still open for better and more elegant solutions but this does what I want to do. If you have a better idea please let me know. Cheers!