user1797147
user1797147

Reputation: 937

Javascript, ajax, cross domain call, overriding Content Security Policy

I parse a web-page and depending on content, I need a ajax call to my localhost. On local host will be a PHP script that will exchange data via AJAX, probably in JSON format (I'm not sure yet, still reading and testing).

This is a plugin and I try to test over Google page

https://www.google.de

I follow this simple ajax example:

https://www.w3schools.com/xml/ajax_xmlhttprequest_response.asp

I successfully made the call itself

//loadDoc("http://localhost/index.php", myCallback);  <-- this NOT
//loadDoc("https://www.google.de", myCallback);   <-- this WORKS

/*
Content Security Policy: Ignoring “'unsafe-inline'” within script-src: ‘strict-dynamic’ specified  (unknown)
Content Security Policy: Ignoring “https:” within script-src: ‘strict-dynamic’ specified  (unknown)
Content Security Policy: Ignoring “http:” within script-src: ‘strict-dynamic’ specified
*/

function loadDoc(url, cFunction) {
  var xhttp;
  xhttp=new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      cFunction(this);
    }
 };
  xhttp.open("GET", url, true);
  xhttp.send();
}


function myCallback(xhttp) {

  alert("I'm alive from my local server");

}

The (BIG) problem is that I discovered the "Content Security Policy" will not allow me to make calls to other domains, even if I'm in my own context (my browser, FF 53).

Now seems that this can be easily tricked at least for GET requests like I need, by inserting a script in the DOM, like this

AJAX cross domain call

and especially this great post of Rob W

Insert code into the page context using a content script

So I tried like this, but still not working.

// var actualCode = ['/* Code here. Example: */' + 'alert(0);',
                  // '// Beware! This array have to be joined',
                  // '// using a newline. Otherwise, missing semicolons',
                  // '// or single-line comments (//) will mess up your',
                  // '// code ----->'].join('\n');

var script = document.createElement('script');
script.src = "http://localhost/index.php";
script.type = "text/javascript";
document.appendChild(script);
// script.textContent = actualCode;
// (document.head||document.documentElement).appendChild(script);
// script.remove();

The security is not a concern since I'll use my localhost only. What I miss here?

EDITED

Those are errors shown by Firefox debugger

Blocked loading mixed active content “http://localhost/index.php”[Learn More]  axtest.js:16
Content Security Policy: Ignoring “'unsafe-inline'” within script-src: ‘strict-dynamic’ specified  (unknown)
Content Security Policy: Ignoring “https:” within script-src: ‘strict-dynamic’ specified  (unknown)
Content Security Policy: Ignoring “http:” within script-src: ‘strict-dynamic’ specified

Upvotes: 0

Views: 3780

Answers (2)

user1797147
user1797147

Reputation: 937

Despite I already accepted a answer, I found a much easily solution that works in my case. It's all about local browser security policy, no need to inject any JS code.

First, plugin's manifest.json had to be updated with this

    "permissions": [
      "history",
      "browsingData",
        "tabs",
        "<all_urls>",
        "http://localhost/*",
        "storage"
  ]

Second (thanks @Quentin) local browser policy needs to be re-configured. Turn off the CSP for your entire browser by disabling security.csp.enable in the about:config menu

Upvotes: 0

MrCode
MrCode

Reputation: 64536

Append it to the body or head element, not the root document:

document.body.appendChild(script);

The mixed active content error is due to loading the initial page over https(SSL) and then trying to load a http (unsecured) URL. Either load the page without https or setup https on the URL you're calling.

Upvotes: 1

Related Questions