Extensión de Chrome que agrega javascript externo al html de la página actual

Posterior a mirar en diversos repositorios y páginas webs al terminar hemos dado con la resolución que te compartimos a continuación.

Solución:

Los scripts de contenido hacen no se ejecutan en el alcance de la página (consulte también), se ejecutan en un contexto entre su extensión y la página web.

Dado que los rastreadores son del tipo “script inyectado”, estos se ejecutan completamente en el contexto de la página web. Pero el _gaq y Hasync las variables no lo hacen. Como resultado, los scripts de seguimiento no pueden leer las variables de configuración.

Hay dos (tres) formas de solucionarlo.

1. Inyecte su código (como se publicó en la pregunta) usando este método. Usar este método para su propósito es desanimado, porque su secuencia de comandos sobrescribe una variable global de uso común. La implementación de su secuencia de comandos con este método rotura el seguimiento en muchos sitios web – No lo uses.
2. Ejecute completamente el código dentro del alcance de un script de contenido:
   Dos opciones:
   1. Incluya los archivos externos en la extensión
   2. Incluya los archivos externos en la extensión, además de implementar una función de actualización automática.

Método 1: copia completamente local

manifest.json (solo se muestran las partes relevantes):

  "name": "Website Safety",
  "version": "1.0",
  "manifest_version": 2,
  "description": "The Website Safety Extension.",
  "permissions": [
    "tabs", "http://*/*", "https://*/*"
  ],
  "content_scripts": [
    
      "matches": [""],
      "js": ["ga-config.js", "ga.js", "js15_as.js"]
    
  ]

En ga-config.js, defina las variables de la siguiente manera:

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-31046309-1']);
_gaq.push(['_setAllowLinker', true]);
_gaq.push(['_trackPageview']);

var _Hasync= _Hasync|| [];
_Hasync.push(['Histats.start', '1,1342541,4,0,0,0,00000000']);
_Hasync.push(['Histats.fasi', '1']);
_Hasync.push(['Histats.track_hits', '']);

Descargue https://ssl.google-analytics.com/ga.js y guárdelo como ga.js.
Descargue http://s10.histats.com/js15_as.js y guárdelo como js15_as.js.

Método 2: inyectar un GA actualizado

Si desea tener una versión actualizada de GA, debe utilizar una forma complicada de inyectar el código, porque los scripts de contenido no se puede incluir desde una URL externa.

Una versión anterior de esta respuesta se basó en la página de fondo y chrome.tabs.executeScript para este propósito, pero desde Chrome 20, hay un método mejor disponible: use el chrome.storage API para almacenar en caché el código JavaScript. Para mantener el código actualizado, almacenaré una marca de tiempo de “última actualización” en el almacenamiento; también puedes usar el chrome.alarms API en su lugar.

Nota: No olvide incluir una copia local del archivo externo en su extensión, en caso de que el usuario no tenga conexión a Internet, etc.^{Sin una conexión a Internet, Google Analytics no funcionaría de todos modos.}

Guión de contenido, activate-ga.js.

var UPDATE_INTERVAL = 2 * 60 * 60 * 1000; // Update after 2 hour

// Retrieve GA from storage
chrome.storage.local.get(
    lastUpdated: 0,
    code: ''
, function(items) 
    if (Date.now() - items.lastUpdated > UPDATE_INTERVAL) 
        // Get updated file, and if found, save it.
        get('https://ssl.google-analytics.com/ga.js', function(code) 
            if (!code) return;
            chrome.storage.local.set(lastUpdated: Date.now(), code: code);
        );
    
    if (items.code) // Cached GA is available, use it
        execute(items.code);
    else // No cached version yet. Load from extension
        get(chrome.extension.getURL('ga.js'), execute);
);

// Typically run within a few milliseconds
function execute(code) 
    try  window.eval(code);  catch (e)  console.error(e); 
    // Run the rest of your code.
    // If your extension depends on GA, initialize it from here.
    // ...


function get(url, callback) 
    var x = new XMLHttpRequest();
    x.onload = x.onerror = function()  callback(x.responseText); ;
    x.open('GET', url);
    x.send();

Archivo de manifiesto mínimo:

  "name": "Website Safety",
  "version": "1.0",
  "manifest_version": 2,
  "permissions": [
    "tabs", "http://*/*", "https://*/*"
  ],
  "content_scripts": [
    
      "matches": [""],
      "js": ["activate-ga.js"]
    
  ],
  "web_accessible_resources": ["ga.js"]

El mismo método se puede utilizar para otros rastreadores. Los requisitos mínimos de permiso:

• https://ssl.google-analytics.com/ga.js, por lo que debe agregarse en la sección de permisos. https://*/* o también es suficiente.
• Opcional: unlimitedStorage – Si desea almacenar una gran cantidad de datos con chrome.storage.

Actualización 2015

El nuevo Analítica universal El fragmento definitivamente puede manejar múltiples rastreadores, así que suponiendo que le dé al suyo un nombre único y ejecute todos Código de análisis en el contexto de la página, debería estar listo.

// add Universal Analytics to the page (could be made conditional)
runFunctionInPageContext(function () 
  (function(i,s,o,g,r,a,m)function(),i[r].l=1*new Date();a=s.createElement(o);
  a.async=1;a.src=g;document.documentElement.appendChild(a)
  )(window,document,'script','//www.google-analytics.com/analytics.js','ga');
);

// all Google Analytics calls should use our tracker name  
// and be run inside the page's context
runFunctionInPageContext(function () 
  ga('create', 'UA-12345-6', 'auto', 'name': 'myTracker');
  ga('myTracker.send', 'pageview'); // note the prefix
);

// simple helper function
function runFunctionInPageContext(fn) 
  var script = document.createElement('script');
  script.textContent = '(' + fn.toString() + '());';
  document.documentElement.appendChild(script);
  document.documentElement.removeChild(script);

Tenga en cuenta que hay una pequeña modificación en el fragmento de análisis para usar document.documentElement en lugar del primero

luego llamas a algunas funciones de la biblioteca:

var service, tracker, out;

function initAnalyticsConfig(config) 
  document.getElementById('settings-loading').hidden = true;
  document.getElementById('settings-loaded').hidden = false;

  var checkbox = document.getElementById('analytics');
  checkbox.checked = config.isTrackingPermitted();
  checkbox.onchange = function() 
    config.setTrackingPermitted(checkbox.checked);
  ;

function startApp() 
  // Initialize the Analytics service object with the name of your app.
  service = analytics.getService('ice_cream_app');
  service.getConfig().addCallback(initAnalyticsConfig);

  // Get a Tracker using your Google Analytics app Tracking ID.
  tracker = service.getTracker('UA-XXXXX-X');

  // Record an "appView" each time the user launches your app or goes to a new
  // screen within the app.
  tracker.sendAppView('MainView');


window.onload = startApp;