0

First off, I'm new to making chrome extensions, so don't assume I know a whole lot. For the extension I'm making the user needs to be able to right click on a link, select a context menu item, and the extension needs to get sent the final url of that link.

Specifically amazon affiliate links. So for example the following:

http://amzn.to/1VO7dlp

Would need to get converted to:

http://www.amazon.com/gp/product/0470281731/ref=as_li_ss_tl?ie=UTF8&fpl=fresh&pf_rd_m=ATVPDKIKX0DER&pf_rd_s=desktop-1&pf_rd_r=0WRZW1V7VVDJWS54WCM4&..... blah blah blah

I've looked around and I can't find any answers. Am I SOL?

The code I have so far is pretty basic:

//background.js

chrome.runtime.onInstalled.addListener(function() {
chrome.contextMenus.create({
    title: 'Add this Link',
    id: 'linkContext',
    contexts: ['link'],
 });
}); 

chrome.contextMenus.onClicked.addListener(function(data, tab) {
    if (data.menuItemId === "linkContext") { 
      chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
        chrome.tabs.sendMessage(tabs[0].id, 
          {
            linkUrl: data.linkUrl,
          }, 

          function(response) {
            alert(response.host);
          });
      });
    }
});


chrome.runtime.onMessage.addListener(

//content_script.js

function(request, sender, sendResponse) {
    if (request.linkUrl){

        pathArray = request.linkUrl.split( '/' );
        protocol = pathArray[0];
        host = pathArray[2];
        url = protocol + '//' + host;

        sendResponse({host: host});
    }
});

//manifest.json

{
  "name": "jQuery DOM",
  "manifest_version": 2,
  "version": "1.0",
  "description": "Manipulate the DOM when the page is done loading",
  "browser_action": {
    "name": "Manipulate DOM",
    "icons": ["icon.png"],
    "default_icon": "icon.png"
  },

  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },

  "permissions": [
    "contextMenus"
  ],

  "content_scripts": [ {
    "js": [ "jquery.min.js", "content_script.js" ],
    "matches": [ "http://*/*", "https://*/*"]
  }],

  "web_accessible_resources":[
    "menu.html",
    "menu.css"
  ]
}

Like I said I'm pretty new to this, so I'm unsure of how to proceed. I'd like to do some parsing of the "final url" so I can present information about it to the user. I.E. the Affiliate ID. But for that I can't use the shortened link from above.

Luc Gendrot
  • 806
  • 9
  • 11
  • You can try the following service: http://unshorten.it/api/documentation – rsanchez May 08 '16 at 02:51
  • I think that's what I'm going to have to do, upon further inspection I think this problem is unsolvable with pure JS/jQuery. If you add this as an answer I'll mark it as correct. – Luc Gendrot May 08 '16 at 05:32

1 Answers1

0

As Redirects is a response from the server back to you, you can read the header-field and see what url your initial url redirects to.

In this case, I just tested to open a new tab in Chrome, and opened the Network tab and navigated to your initial url. Then I saw two separate redirects (http status code 301), before the the full url of the resulting page was shown.

This you can do in code as well, to be able to get to the final url. :)

MunchyYDL
  • 351
  • 1
  • 5
  • Like I said, I'm new to this, would you mind providing a code example? It would be helpful not just for me, but for any future googlers who end up here. – Luc Gendrot May 07 '16 at 19:30
  • My bad, I might have answered too quickly on this one, seems like it can be tricky to do this via XMLHttpRequest or something similar. Please see this thread for more information: http://stackoverflow.com/questions/16430901/get-final-url-from-xhr-object-after-redirect – MunchyYDL May 07 '16 at 20:26