Iniezione di script di contenuto e richiesta di permessi di origine incrociata

Question

Sono curioso di sapere se il seguente scenario è un bug in Chrome, che funziona come previsto o un errore dello sviluppatore.

Quindi, ho un'estensione. Nella sua manifest.json chiedo autorizzazioni tra origine per due siti:

"permissions": [ 
    "http://www.foo.com/*", 
    "http://www.bar.com/*" 
] 

Dichiaro inoltre uno script contenuto:

"content_scripts": [ 
    { 
     "matches": ["http://www.foo.com/*"], 
     "js": ["injectedScript.js"] 
    } 
] 

Così, ho indicato che vorrei per iniettare "injectedScript .js "in tutti i domini di foo.com. "InjectedScript.js" sembra qualcosa di simile:

var xhr = new XMLHttpRequest(); 
xhr.onreadystatechange = handleStateChange; // Implemented elsewhere. 
xhr.open("GET", 'http://www.bar.com/123'), true); 
xhr.send(); 

Ora, un IFRAME viene aggiunto alla pagina del mio Chrome Extension. Ecco come si presenta: src

<iframe src="http://www.foo.com/123"></iframe> 

di questa struttura soddisfa il mio modello di script contenuti. In quanto tale, quando viene caricato il frame, viene iniettato injectedScript.js. Ma la XMLHttpRequest all'interno di injectedScript ha esito negativo.

Ora, questo mi fa chiedere quale sia il comportamento previsto. È frustrante riscontrare problemi CORS quando ho richiesto le autorizzazioni appropriate ... ma posso anche capire che sto tentando di accedere a "http://www.bar.com/123" da un'origine esterna alla mia chrome-extension ... anche se un iframe è stato caricato nell'estensione di cui ho il permesso di accesso.

Qualche idea da qualcuno in merito?

EDIT: Se vi state chiedendo che cosa potrei essere sempre a da un punto di vista pratico - vorrei per iniettare alcuni javascript che può chiamare getImageData su un video nella pagina iniettato. Tuttavia, non posso, perché getImageData pensa che i dati src del video siano corrotti. Ho richiesto le autorizzazioni appropriate, ma non rientra nell'iframe.

UPDATE: Ecco una foto: http://i.imgur.com/PR48HO2.png

Answer 1

The Same-Origin politica viene attuata per prevenire attacchi dannosi JavaScript (si può leggere di più su questo here) ed è una parte importante del modello di sicurezza del web. Quindi, purtroppo, non puoi utilizzare direttamente una richiesta HTTP in uno script di contenuto.

Tuttavia, se vi capita di avere accesso al file che si desidera consentire l'accesso a è possibile aggiungere il seguente codice PHP per consentire Cross-Origin:

header('Access-Control-Allow-Origin: *'); 

Questo codice permette in pratica qualsiasi indirizzo web/IP utilizzare Cross-Origin nel seguente file.

Se non si ha accesso al file, è possibile eseguire una soluzione alternativa, come invece di tentare di ottenere direttamente l'HTML, chiamare uno script PHP su un server personale che lo preleverà per te che ha l'autorizzazione incrociata attivata usando il codice sopra.

Ecco un esempio:

header('Access-Control-Allow-Origin: *'); 

$URL = ("http://www.bar.com/123"); 

$HTMLfromURL = file_get_contents($URL); 

echo $HTMLfromURL 

E poi sul lato Chrome Extension sono:

Nota: Il XMLHTTPRequest in uso è obsoleto e provoca impatti prestazioni sul lato utente . Il codice riportato di seguito è una versione asincrona dello stesso che non ha l'impatto negativo sulle prestazioni.

var URL = "http://example.com/myscript.php"; 
var xhr = new XMLHttpRequest(); 
xhr.open("GET", URL, true); 
xhr.onload = function (e) { 
if (xhr.readyState === 4) { 
    if (xhr.status === 200) { 
     var HTMLfromURL = xhr.responseText; 
} else { 
      // Received unexpected HTML error code (such as 404, or 403) 
      console.error(xhr.statusText); 
     } 
     } 
    }; 
xhr.onerror = function (e) { 
    console.error(xhr.statusText); 
    // Run this code if failed to load page 
}; 
xhr.send(null);