javascript - Chrome Extension: Edit the current url on click and then redirect to the edited one - Stack Overflow

admin管理员组

文章数量:1345134

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:

I modified it as:

.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"
  ]
}

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./science/article/pii/S0006899315008550

I modified it as:

http://www.sciencedirect..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!

• javascript
• jquery
• google-chrome
• google-chrome-extension

Share Improve this question Follow asked Nov 30, 2015 at 3:23 SaturnSaturn 5111 silver badge55 bronze badges 1

• I feel I have problems in how to get popup.js run on click, and some problems in url editing. – Saturn Commented Nov 30, 2015 at 3:31

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 5

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./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.

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./','sciencedirect./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/');})(); 

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.

Anyone looking to edit the url based on some pattern can use the chrome extension Edit Url by Regex

For example for the scenario in this post, while using the extension, you can provide the regex as http.*/science/ and the value as http://www.sciencedirect..ezp.lib.unimelb.edu.au/science/ and click submit. The url will get updated as expected.

本文标签： javascriptChrome Extension Edit the current url on click and then redirect to the edited oneStack Overflow