Resume contenido con la IA integrada

Thomas Steiner

Fecha de publicación: 11 de noviembre de 2024; última actualización: 20 de mayo de 2025

Explicación	Web	Extensiones	Estado de Chrome	Intent
MDN	Chrome 138	Chrome 138	Ver	Intención de enviar

Puedes ofrecer a tus usuarios la capacidad de destilar artículos extensos, documentos complejos o incluso conversaciones de chat animadas en resúmenes concisos y reveladores.

La API de Summarizer se puede usar para generar diferentes tipos de resúmenes en diversas longitudes y formatos, como oraciones, párrafos, listas con viñetas y mucho más. Creemos que esta API es útil en las siguientes situaciones:

• Resumir los puntos clave de un artículo o una conversación de chat
• Sugerir títulos y encabezados para artículos
• Crear un resumen conciso e informativo de un texto extenso
• Generar un avance de un libro basado en una reseña

Comenzar

La API de Summarizer está disponible a partir de Chrome 138 estable.

Antes de usar esta API, acepta la Política de Uso Prohibido de IA Generativas de Google.

Ejecuta la detección de funciones para ver si el navegador admite la API de Summarizer.

if ('Summarizer' in self) {
  // The Summarizer API is supported.
}

Descarga del modelo

La API de Summarizer usa un modelo entrenado para generar resúmenes de alta calidad. La API está integrada en Chrome, y Gemini Nano es el modelo que se descarga la primera vez que un sitio web usa esta API.

Para determinar si el modelo está listo para usarse, llama a la función asíncrona Summarizer.availability(). Devuelve una promesa con los siguientes valores.

• "unavailable" significa que la implementación no admite las opciones solicitadas.
• "downloadable" significa que la implementación admite las opciones solicitadas, pero, primero, el navegador debe descargar algo, como un modelo (en el caso de Chrome, Gemini Nano) o un ajuste del modelo.
• "downloading" significa que la implementación admite las opciones solicitadas, pero debe finalizar una descarga en curso antes de poder continuar.
• "available" significa que la implementación admite las opciones solicitadas y el resumidor puede continuar.

Para activar la descarga del modelo y crear el resumidor, llama a la función asíncrona Summarizer.create(). Si la respuesta a availability() fue downloadable o downloading, se recomienda escuchar el progreso de la descarga. De esta manera, puedes informar al usuario y señalar que la descarga puede tardar en completarse antes de que se pueda generar el resumen.

const summarizer = await Summarizer.create({
  monitor(m) {
    m.addEventListener('downloadprogress', (e) => {
      console.log(`Downloaded ${e.loaded * 100}%`);
    });
  }
});

Funciones de la API

La función create() te permite configurar un nuevo objeto de resumen según tus necesidades. Toma un objeto options opcional con los siguientes parámetros:

• sharedContext: Es el contexto compartido adicional que puede ayudar al resumidor.
• type: Es el tipo de resumen, con los valores permitidos key-points (predeterminado), tldr, teaser y headline. Consulta la siguiente tabla para obtener detalles.
• format: Es el formato del resumen, con los valores permitidos markdown (predeterminado) y plain-text.
• length: Es la longitud del resumen, con los valores permitidos short, medium (predeterminado) y long. El significado de estas longitudes varía según el type solicitado. Por ejemplo, en la implementación de Chrome, un breve resumen de puntos clave consta de tres viñetas, y un resumen breve es una oración.

Una vez establecidos, los parámetros no se pueden cambiar. Crea un objeto de resumen nuevo si necesitas modificar los parámetros.

En la siguiente tabla, se muestran los diferentes tipos de resúmenes y sus longitudes correspondientes. Las longitudes representan el valor máximo posible, ya que, a veces, los resultados pueden ser más cortos.

En el siguiente ejemplo, se muestra cómo inicializar el resumidor.

const options = {
  sharedContext: 'This is a scientific article',
  type: 'key-points',
  format: 'markdown',
  length: 'medium',
};

const availability = await Summarizer.availability();
let summarizer;
if (availability === 'unavailable') {
  // The Summarizer API isn't usable.
  return;
}
if (availability === 'available') {
  // The Summarizer API can be used immediately .
  summarizer = await Summarizer.create(options);
} else {
  // The Summarizer API can be used after the model is downloaded.
  summarizer = await Summarizer.create(options);
  summarizer.addEventListener('downloadprogress', (e) => {
    console.log(`Downloaded ${e.loaded * 100}%`);
  });
  await summarizer.ready;
}

Ejecuta el resumidor

Existen dos formas de ejecutar el resumidor: transmisión y lote (sin transmisión).

Resumen por lotes

Con el resumen por lotes, el modelo procesa la entrada como un todo y, luego, produce el resultado.

Para obtener un resumen por lotes, llama a la función summarize(). El primer argumento es el texto que deseas resumir. El segundo argumento opcional es un objeto con un campo context. Este campo te permite agregar detalles de contexto que podrían mejorar el resumen.

const longText = document.querySelector('article').innerHTML;
const summary = await summarizer.summarize(longText, {
  context: 'This article is intended for a tech-savvy audience.',
});

Resumen de transmisiones

La resumir en tiempo real ofrece resultados en tiempo real. El resultado se actualiza de forma continua a medida que se agrega y ajusta la entrada. Para obtener un resumen de transmisión, llama a summarizeStreaming() en lugar de summarize().

const longText = document.querySelector('article').innerHTML;
const stream = summarizer.summarizeStreaming(longText, {
  context: 'This article is intended for junior developers.',
});
for await (const chunk of stream) {
  console.log(chunk);
}

Demostración

Puedes probar la API de Summarizer en el Playground de la API de Summarizer.

Esfuerzo de estandarización

Estamos trabajando para estandarizar la API de Summarizer y garantizar la compatibilidad entre navegadores.

Nuestra propuesta de API recibió el apoyo de la comunidad y se trasladó al W3C Web Incubator Community Group para su análisis. El equipo de Chrome solicitó comentarios al Grupo de Arquitectura Técnica del W3C y les pidió a Mozilla y WebKit sus posturas sobre los estándares.

Participa en el esfuerzo de estándares uniéndote al Web Incubator Community Group.

Enviar comentarios

Queremos ver lo que estás creando con la API de Summarizer. Comparte tus sitios web y aplicaciones web con nosotros en X, YouTube y LinkedIn.

Para enviar comentarios sobre la implementación de Chrome, informa un error o envía una solicitud de función.