Chrome Extension: Edit the current url on click and then redirect to the edited one

问题

I am a psychology student and I read papers very often. The university libraries provide the access to the databases but I need to use library search engine and log in every time. Quite annoying. I found a way to avoid jumping around the pages.

Here is the method:

I add "ezp.lib.unimelb.edu.au" to the end of the target database address after I found a paper in Google Scholar, then it will redirect to the library login page.

For example, the paper's address is:

http://www.sciencedirect.com/science/article/pii/S0006899315008550

I modified it as:

http://www.sciencedirect.com.ezp.lib.unimelb.edu.au/science/article/pii/S000689315008550

I want to create a Chrome Extension to finish this job on click (too lazy). I tried for hours but it does not work.

Here is what I have done:

I have three files in a folder:

First file: manifest.json

{
  "manifest_version": 2,

  "name": "Damn! Take me to the library!",
  "description": "This extension automatically adds the 'ezp.lib.unimelb.edu.au' to the browser's address, allowing you to visit the databases bought by the library quickly",
  "version": "1.0",

  "browser_action": {
    "default_icon": "unimelb.png",
    "default_title": "Damn! Take me to the library!"
  },
  
  "background":{
    "scripts":["popup.js"]
  },

  "permissions": [
    "activeTab",
    "tabs"
  ]
}

Second file: popup.js

function getCurrentTabUrlthenChangeIt(callback) {
  var queryInfo = {
    active: true,
    currentWindow: true
  };

  chrome.tabs.query(queryInfo, function(tabs) {
    
    var tab = tabs[0];

    var url = tab.url;

    callback(url);

    var newurl = url.replace('/',"ezp.lib.unimelb.edu.au/");

    window.location.replace(newurl);


  });

}

Third file: unimelb.png

When I load this folder into Chrome, it does not work.

It's the first time I use JS, anyone has any suggestions?

Thanks!

回答1:

You can do this even without clicking. You can use the content script for this URL pattern so that your script gets injected to this page. Then you can send a message to the background script using chrome.runtime.sendMessage() and your listener will create a link you want here and then just reload the tab using chrome.tabs.update() with the new URL.

manifest.json

{
 "name": "My extension",
 ...

  "content_scripts": [{
      "matches": ["http://www.sciencedirect.com/science/article/pii/*"],
      "js": ["content-script.js"]
  }],
  ...
}

content-script.js

chrome.runtime.sendMessage({loadURL: true});

background.js

chrome.runtime.onMessage.addListener(function(message, sender, response) {
     if (message.loadURL) {
         var newurl = sender.tab.url.replace("/", "ezp.lib.unimelb.edu.au/");
         chrome.tabs.update(sender.tab.id, {url: newURL})     
     }
);

This is my first answer to the StackOverflow Community, I hope it helps.

回答2:

Instead of making an extension, it would be a lot easier to make a bookmarklet which can be used in any browser...

Right click on the bookmark bar
Choose "Add page..."
Under "Name", enter whatever you want "Journal redirect" or whatever

Under "URL", copy and paste the following code (no spaces)

javascript:(function(){location.href=location.href.replace('sciencedirect.com/','sciencedirect.com/ezp.lib.unimelb.edu.au/');})();

Now when you're on the page, click that bookmark and it'll redirect you.

Update: Try this code in the URL for other domains

javascript:(function(){var%20l=location;l.href=l.origin+l.href.replace(l.origin,'ezp.lib.unimelb.edu.au/');})();

回答3:

manifest.json

{
  "manifest_version": 2,

  "name": "Damn! Take me to the library!",
  "description": "This extension automatically adds the 'ezp.lib.unimelb.edu.au' to the browser's address, allowing you to visit the databases bought by the library quickly",
  "version": "1.0",

  "browser_action": {
    "default_icon": "unimelb.png",
    "default_title": "Damn! Take me to the library!"
  },
  
  "background":{
    "scripts":["background.js"]
  },

  "permissions": [
    "activeTab",
    "tabs"
  ]
}

background.js

//Wait for click

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.executeScript(null, {
  	"file": "popup.js"
  }, function(){ 
  	"popup.js";
  	console.log("Script Executed ...");
  });
})

popup.js

// Change the url to library when on click

var l=location;l.href=l.origin+l.href.replace(l.origin, '.ezp.lib.unimelb.edu.au');

They work well.

It's so cool to finish the first chrome extension. Thank for the help from Mottie.

来源：https://stackoverflow.com/questions/33990967/chrome-extension-edit-the-current-url-on-click-and-then-redirect-to-the-edited

标签

javascript

jquery

google-chrome

google-chrome-extension