Mejora la seguridad de las extensiones

Mejora de la seguridad en el manifiesto V3

Esta es la última de las tres secciones en las que se describen los cambios necesarios para el código que no forma parte del service worker de la extensión. En ella, se describen los cambios necesarios para mejorar la seguridad de las extensiones. En las otras dos secciones, se explica cómo actualizar tu código para la actualización a Manifest V3 y reemplazar las solicitudes web de bloqueo.

Quita la ejecución de cadenas arbitrarias

Ya no puedes ejecutar lógica externa con executeScript(), eval() y new Function().

  • Mueve todo el código externo (JS, Wasm y CSS) al paquete de extensión.
  • Actualiza las referencias de secuencia de comandos y estilo para cargar recursos desde el paquete de extensión.
  • Usa chrome.runtime.getURL() para compilar URLs de recursos en el tiempo de ejecución.
  • Usa un iframe de zona de pruebas: eval y new Function(...) aún son compatibles con los iframes de zona de pruebas. Para obtener más detalles, consulta la guía sobre iframes en la zona de pruebas.

El método executeScript() ahora está en el espacio de nombres scripting en lugar del espacio de nombres tabs. Para obtener información sobre cómo actualizar llamadas, consulta Cómo mover executeScript().

Existen algunos casos especiales en los que aún es posible ejecutar cadenas arbitrarias:

Quita el código alojado de forma remota

En Manifest V3, toda la lógica de la extensión debe ser parte del paquete de extensión. Ya no puedes cargar ni ejecutar archivos alojados de forma remota de acuerdo con la política de Chrome Web Store. Los siguientes son algunos ejemplos:

  • Archivos JavaScript extraídos del servidor del desarrollador
  • Cualquier biblioteca alojada en una CDN
  • Bibliotecas de terceros empaquetadas que recuperan de forma dinámica el código alojado de forma remota

Hay enfoques alternativos disponibles, según tu caso de uso y el motivo del hosting remoto. En esta sección, se describen los enfoques que se deben tener en cuenta. Si tienes problemas para trabajar con el código alojado de forma remota, tenemos guías disponibles.

Funciones y lógica basadas en la configuración

Tu extensión carga y almacena en caché una configuración remota (por ejemplo, un archivo JSON) durante el tiempo de ejecución. La configuración almacenada en caché determina qué funciones están habilitadas.

Lógica externalizada con un servicio remoto

Tu extensión llama a un servicio web remoto. Esto te permite mantener el código privado y cambiarlo según sea necesario, a la vez que evitas la sobrecarga adicional de volver a enviarlo a Chrome Web Store.

Cómo incorporar código alojado de forma remota en un iframe de zona de pruebas

El código alojado de forma remota es compatible con los iframes de zona de pruebas. Ten en cuenta que este enfoque no funciona si el código requiere acceso al DOM de la página de incorporación.

Cómo agrupar bibliotecas de terceros

Si usas un framework popular, como React o Bootstrap, que antes cargabas desde un servidor externo, puedes descargar los archivos reducidos, agregarlos a tu proyecto y, luego, importarlos de forma local. Por ejemplo:

<script src="./react-dom.production.min.js"></script>
<link href="./bootstrap.min.css" rel="stylesheet">

Para incluir una biblioteca en un trabajador de servicio, establece la clave "background.type" en "module" en el manifiesto y usa una sentencia import.

Usa bibliotecas externas en secuencias de comandos insertadas con pestañas

También puedes cargar bibliotecas externas en el entorno de ejecución. Para ello, agrégalas al array files cuando llames a scripting.executeScript(). De todos modos, puedes cargar datos de forma remota durante el tiempo de ejecución.

chrome.scripting.executeScript({
  target: {tabId: tab.id},
  files: ['jquery-min.js', 'content-script.js']
});

Cómo insertar una función

Si necesitas más dinamismo, la nueva propiedad func en scripting.executeScript() te permite insertar una función como una secuencia de comandos de contenido y pasar variables con la propiedad args.

Manifest V2
let name = 'World!';
chrome.tabs.executeScript({
  code: `alert('Hello, ${name}!')`
});

En un archivo de secuencia de comandos en segundo plano.

Manifest V3
async function getCurrentTab() {/* ... */}
let tab = await getCurrentTab();

function showAlert(givenName) {
  alert(`Hello, ${givenName}`);
}

let name = 'World';
chrome.scripting.executeScript({
  target: {tabId: tab.id},
  func: showAlert,
  args: [name],
});

En el service worker en segundo plano.

El repositorio de Samples de extensiones de Chrome contiene un ejemplo de inserción de funciones que puedes analizar. Un ejemplo de getCurrentTab() se encuentra en la referencia de esa función.

Busca otras soluciones alternativas

Si los enfoques anteriores no te ayudan con tu caso de uso, es posible que debas encontrar una solución alternativa (es decir, migrar a una biblioteca diferente) o encontrar otras formas de usar la funcionalidad de la biblioteca. Por ejemplo, en el caso de Google Analytics, puedes cambiar al Protocolo de medición de Google en lugar de usar la versión oficial de JavaScript alojada de forma remota, como se describe en nuestra Guía de Google Analytics 4.

Actualiza la política de seguridad del contenido

"content_security_policy" no se quitó del archivo manifest.json, pero ahora es un diccionario que admite dos propiedades: "extension_pages" y "sandbox".

Manifest V2
{
  ...
  "content_security_policy": "default-src 'self'"
  ...
}
Manifest V3
{
  ...
  "content_security_policy": {
    "extension_pages": "default-src 'self'",
    "sandbox": "..."
  }
  ...
}

extension_pages: Se refiere a los contextos de tu extensión, incluidos los archivos HTML y los trabajadores del servicio.

sandbox: Se refiere a cualquier página de extensión en zona de pruebas que use tu extensión.

Quita las políticas de seguridad del contenido no admitidas

El manifiesto V3 no permite ciertos valores de la política de seguridad del contenido en el campo "extension_pages" que se permitían en el manifiesto V2. Específicamente, Manifest V3 no permite aquellos que permiten la ejecución de código remoto. Las directivas script-src,, object-src y worker-src solo pueden tener los siguientes valores:

  • self
  • none
  • wasm-unsafe-eval
  • Solo extensiones descomprimidas: cualquier fuente de localhost (http://localhost, http://127.0.0.1 o cualquier puerto en esos dominios)

Los valores de la política de seguridad del contenido para sandbox no tienen esas restricciones nuevas.