Extensión de Google Chrome: inyecciones de secuencias de comandos

Estoy tratando de hacer que mi extensión de Chrome inyecte algo de javascript con content_scriptsusando este anterior responder como una referencia.

manifiesto.json

"name": "My Chrome Extension",
"version": "1.0",
"manifest_version": 2,
"content_scripts": [{
    "matches": ["http://pagetoinject/script/into/*"],
    "js": ["contentscript.js"]
}]  

contenido.js:

var s = document.createElement('script');
s.src = chrome.extension.getURL("script.js");
(document.head||document.documentElement).appendChild(s);
s.parentNode.removeChild(s);

(También lo intenté este método sin éxito. )

var s = document.createElement('script');
s.src = chrome.extension.getURL("script.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

Sigo recibiendo este error de javascript. Aquí está un captura de pantalla.

GET chrome-extension://invalid/
(anonymous function)

1. En su archivo de manifiesto, "manifest_version": 2 está especificado. Esto activa automáticamente un modo más estricto, en el que todos los archivos de la extensión no están disponibles para las páginas web de forma predeterminada.
2. Su código original nunca funcionaría, porque el <script> El elemento se elimina inmediatamente después de la inyección (el archivo de script no tiene posibilidad de cargarse).

Como resultado de 1., aparece el siguiente error en la consola:

Failed to load resource                             chrome-extension://invalid/

Para solucionar el problema, agregue script.js a la lista blanca, "web_accessible_resources" en tus manifest file:

{
  "name": "Chrome Extension",
  "version": "1.0",
  "manifest_version": 2,
  "content_scripts": [{
      "matches": ["http://pagetoinject/script/into/*"],
      "js": ["contentscript.js"]
  }],
  "web_accessible_resources": ["script.js"]
}

Además de las respuestas anteriores, noto que en su contentscript.js solo está agregando otro script, es decir script.js ¿Por qué no agregas directamente script.js a través de content_scripts en manifest.json.

Otra razón para obtener este error es si CORS está bloqueando la URL. Verifique el encabezado de solicitud de red de la página para ver si contiene Política de seguridad de contenido:

Content-Security-Policy: default-src 'self' http://example.com; connect-src http://example.com/; script-src http://example.com/

Puede intentar abrir la URL en una nueva pestaña del navegador para verificar que la URL de la imagen sea correcta:

chrome-extension://mjcbjlencnokpknflpneebajalcnnifo/images/pattern.jpg

Una forma de evitar esto es usar un URI de datos de imagen:

data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7

Repetitivo para la extensión de Chrome:

https://github.com/commanddotcom/boilerplate-chrome-extension-js-injection

El problema aquí es que estás usando manifest_version : 2. si haces eso manifest-version: 1 no tendras ningun problema. La versión 2 restringe muchas de estas funciones para mejorar la seguridad. Referirse Política de seguridad de contenido de Google para obtener más detalles sobre las restricciones impuestas en la versión 2 del manifiesto. No pude encontrar su caso específico mencionado en el CSP, pero cuando cambié la versión del manifiesto a 1 y ejecuté su código, funcionó bien.