1

I am using a chrome extension to inject an AJAX request into a website. However I keep randomly getting this error:

Refused to connect to 'http://127.0.0.1:5005/' because it violates the following Content Security Policy directive: "connect-src 'self' static.licdn.com media.licdn.com static-exp1.licdn.com static-exp2.licdn.com media-exp1.licdn.com media-exp2.licdn.com https://media-src.linkedin.com/media/ www.linkedin.com s.c.lnkd.licdn.com m.c.lnkd.licdn.com s.c.exp1.licdn.com s.c.exp2.licdn.com m.c.exp1.licdn.com m.c.exp2.licdn.com wss://*.linkedin.com dms.licdn.com".

It doesn't happen all the time. Just some of the time. I am really confused. Is there a way around it?

This is the code inside chrome_extension.js

function checkName(){
    var fullNameSplit = $('#topcard h1').first().text().split(' ');
    var firstName = fullNameSplit[0]
    var lastName = fullNameSplit[fullNameSplit.length - 1]
    console.log(firstName, lastName)
    console.log('checking name')

    $.ajax({
        type:'POST',
        url:'http://127.0.0.1:5005/',
        data: JSON.stringify({first: firstName, last: lastName}),
        success: function(response) {
            data = JSON.parse(response)
            firstNameFound = data.first_name
            lastNameFound = data.last_name
            fullNameFound = data.full_name
            $('.profile-info').prepend('Full Name Found: '+fullNameFound+'</br></br>');
            //</br></br>First Name Found: '+firstNameFound+'</br></br>Last Name Found: '+lastNameFound+'</br></br>'

        },
        // dataType: 'json',
        contentType: "application/json"
    })
}

manifest.json

{
    "manifest_version": 2,

    "name": "Upstart Extension",
    "version": "1.0",

    "browser_action": {
        "default_icon": "icons/download.png"
        // "default_popup": "popup.html"
    },

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

    "permissions": [
        "activeTab",
        "https://ajax.googleapis.com/",
        "storage"
    ],

    "content_scripts": [
       {
            // "matches":["https://www.linkedin.com/*"],
            "matches": ["https://www.linkedin.com/*", "http://www.linkedin.com/*"],
            "js":["keypress.js", "jquery.js", "chrome_extension.js"],
            "run_at": "document_end"
        }
    ],
    "content_security_policy": "script-src 'self' http://127.0.0.1:5005/'; connect-src 'self' http://127.0.0.1:5005/'; object-src 'self'"
}
Morgan Allen
  • 3,291
  • 8
  • 62
  • 86
  • 1
    No, there's no way around it as that is the [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) and it's purpose is to prevent what you're trying to do. – sbolel Apr 23 '18 at 14:40
  • Then why does it work some of the time? – Morgan Allen Apr 23 '18 at 14:42
  • 1
    Does it work sometimes on that same page? There is most likely a different CSP when it succeeds. Look at the page HTML and the headers sent from the server when loading the page in the developer tools, do you see the security policy? – sbolel Apr 23 '18 at 14:44
  • It sometimes works on the page, sometimes it doesn't. I assume its just Linkedin not adding the security policy on all pages. – Morgan Allen Apr 23 '18 at 14:46
  • That's what I'd assume as well. I looked at the network requests and it looks like the CSP is a header on the first GET request to `www.linkedin.com`. Here's a [screenshot of the header](https://i.stack.imgur.com/90hHr.png) -- that's what I'd look for on other pages to see if it exists / what the differences are. – sbolel Apr 23 '18 at 14:49
  • Have you tried putting the XHR call in a script, and then adding that script into your Chrome extensions manifest.json, rather than injecting the XHR directly into the page? See [this](https://stackoverflow.com/a/34950159/1526037) answer for a sample. – sbolel Apr 23 '18 at 14:53
  • And here's the [documentation](https://developer.chrome.com/extensions/contentSecurityPolicy) for CSP within the context of Chrome extensions. It looks to me like it should be possible to make a request in a script. – sbolel Apr 23 '18 at 14:59
  • 1
    @SinanBolel I added the code. Can you take a look? I'm still getting the error – Morgan Allen Apr 23 '18 at 15:12
  • Your security policy has `https://example.com` in it -- change that to the address you're trying to hit (127.0.0.1). Also, change `script-src` to `connect-src` --- Try this: `"content_security_policy": "script-src 'self' https://127.0.0.1; "connect-src 'self' https://127.0.0.1; object-src 'self'"` – sbolel Apr 23 '18 at 15:15
  • Hmm...I tried some variations. Changed `https` to `http` and tried it with/without `:5005` but still getting the error. Any thoughts? – Morgan Allen Apr 23 '18 at 15:21
  • updated the code – Morgan Allen Apr 23 '18 at 15:22
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/169602/discussion-between-sinan-bolel-and-morgan-allen). – sbolel Apr 23 '18 at 15:31

1 Answers1

1

This looks like you're being blocked by a websites Content Security Policy which is a security policy set by the webserver which provides a list of servers it is allowed to connect to. Basically, it's a piece of security designed to stop exactly what you're doing because it looks like an XSS injection attack.

It likely only happens some of the time because only some sites have CSP enabled.

Is there a way around it?

Assuming CSP is effective, no there isn't a way around it unless the site in question adds the source you're connecting to to it's content policy.

rob
  • 2,119
  • 1
  • 22
  • 41