Gérer des événements à l'aide de scripts en arrière-plan

Les extensions sont des programmes basés sur des événements qui permettent de modifier ou d'améliorer l'expérience de navigation dans Chrome. Les événements sont des déclencheurs du navigateur, tels que l'accès à une nouvelle page, la suppression d'un favori ou la fermeture d'un onglet. Les extensions surveillent ces événements dans leur script d'arrière-plan, puis réagissent en suivant les instructions spécifiées.

Une page en arrière-plan est chargée lorsque cela est nécessaire, puis déchargée lorsqu'elle devient inactive. Voici quelques exemples d'événements:

  • L'extension est d'abord installée ou mise à jour vers une nouvelle version.
  • La page d'arrière-plan écoutait un événement, qui a été envoyé.
  • Un script de contenu ou une autre extension envoie un message.
  • Une autre vue de l'extension (un pop-up, par exemple) appelle runtime.getBackgroundPage.

Une fois chargée, une page en arrière-plan continue de s'exécuter tant qu'elle effectue une action, telle que l'appel d'une API Chrome ou l'envoi d'une requête réseau. De plus, la page d'arrière-plan ne se décharge pas tant que toutes les vues visibles et tous les ports de message ne sont pas fermés. Notez que l'ouverture d'une vue ne charge pas la page d'événement, mais l'empêche seulement de se fermer une fois chargée.

Les scripts d'arrière-plan efficaces restent inactifs jusqu'à ce qu'ils écoutent un incendie, réagissent avec les instructions spécifiées, puis se déchargent.

Enregistrer des scripts en arrière-plan

Les scripts d'arrière-plan sont enregistrés dans le fichier manifeste sous le champ "background". Ils sont répertoriés dans un tableau après la clé "scripts", et "persistent" doit être défini sur "false".

{
  "name": "Awesome Test Extension",
  ...
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  ...
}

Plusieurs scripts d'arrière-plan peuvent être enregistrés pour du code modularisé.

{
    "name": "Awesome Test Extension",
    ...
    "background": {
      "scripts": [
        "backgroundContextMenus.js",
        "backgroundOmniBox.js",
        "backgroundOauth.js"
      ],
      "persistent": false
    },
    ...
  }

Si une extension utilise actuellement une page persistante en arrière-plan, reportez-vous au guide de migration en arrière-plan pour savoir comment passer à un modèle non persistant.

Initialiser l'extension

Écouter l'événement runtime.onInstalled pour initialiser une extension lors de l'installation Utilisez cet événement pour définir un état ou pour une initialisation unique, comme un menu contextuel.

chrome.runtime.onInstalled.addListener(function() {
  chrome.contextMenus.create({
    "id": "sampleContextMenu",
    "title": "Sample Context Menu",
    "contexts": ["selection"]
  });
});

Configurer des écouteurs

Structurez les scripts d'arrière-plan autour des événements dont dépend l'extension. Définir des événements pertinents d'un point de vue fonctionnel permet aux scripts d'arrière-plan de rester inactifs jusqu'à ce que ces événements soient déclenchés et d'empêcher l'extension de manquer des déclencheurs importants.

Les écouteurs doivent être enregistrés de manière synchrone à partir du début de la page.

chrome.runtime.onInstalled.addListener(function() {
  chrome.contextMenus.create({
    "id": "sampleContextMenu",
    "title": "Sample Context Menu",
    "contexts": ["selection"]
  });
});

// This will run when a bookmark is created.
chrome.bookmarks.onCreated.addListener(function() {
  // do something
});

N'enregistrez pas les écouteurs de manière asynchrone, car ils ne seront pas déclenchés correctement.

chrome.runtime.onInstalled.addListener(function() {
  // ERROR! Events must be registered synchronously from the start of
  // the page.
  chrome.bookmarks.onCreated.addListener(function() {
    // do something
  });
});

Les extensions peuvent supprimer les écouteurs de leurs scripts d'arrière-plan en appelant removeListener. Si tous les écouteurs d'un événement sont supprimés, Chrome ne charge plus le script en arrière-plan de l'extension pour cet événement.

chrome.runtime.onMessage.addListener(function(message, sender, reply) {
    chrome.runtime.onMessage.removeListener(event);
});

Filtrer les événements

Utilisez des API compatibles avec les filtres d'événements pour limiter les écouteurs aux cas concernés par l'extension. Si une extension écoute l'événement tabs.onUpdated, essayez plutôt d'utiliser l'événement webNavigation.onCompleted avec des filtres, car l'API des onglets n'est pas compatible avec les filtres.

chrome.webNavigation.onCompleted.addListener(function() {
    alert("This is my favorite website!");
}, {url: [{urlMatches : 'https://www.google.com/'}]});

Réagir aux auditeurs

Les écouteurs permettent de déclencher une fonctionnalité une fois qu'un événement a été déclenché. Pour réagir à un événement, structurez la réaction souhaitée à l'intérieur de l'événement d'écouteur.

chrome.runtime.onMessage.addListener(function(message, callback) {
  if (message.data == "setAlarm") {
    chrome.alarms.create({delayInMinutes: 5})
  } else if (message.data == "runLogic") {
    chrome.tabs.executeScript({file: 'logic.js'});
  } else if (message.data == "changeColor") {
    chrome.tabs.executeScript(
        {code: 'document.body.style.backgroundColor="orange"'});
  };
});

Décharger les scripts d'arrière-plan

Les données doivent être conservées régulièrement afin de ne pas perdre d'informations importantes si une extension plante sans recevoir onSuspend. Pour ce faire, utilisez l'API storage.

chrome.storage.local.set({variable: variableInformation});

Si une extension utilise la transmission de messages, assurez-vous que tous les ports sont fermés. Le script en arrière-plan ne se déchargera pas tant que tous les ports de message ne seront pas fermés. L'écoute de l'événement runtime.Port.onDisconnect permet de savoir quand les ports ouverts sont fermés. Fermez-les manuellement avec runtime.Port.disconnect.

chrome.runtime.onMessage.addListener(function(message, callback) {
  if (message == 'hello') {
    sendResponse({greeting: 'welcome!'})
  } else if (message == 'goodbye') {
    chrome.runtime.Port.disconnect();
  }
});

La durée de vie d'un script en arrière-plan est observable en surveillant le moment où une entrée de l'extension apparaît et disparaît du gestionnaire de tâches de Chrome.

ALT_TEXT_HERE

Pour ouvrir le gestionnaire de tâches, cliquez sur le menu Chrome, pointez sur "Autres outils", puis sélectionnez "Gestionnaire de tâches".

Les scripts en arrière-plan se déchargent eux-mêmes après quelques secondes d'inactivité. Si un nettoyage de dernière minute est nécessaire, écoutez l'événement runtime.onSuspend.

chrome.runtime.onSuspend.addListener(function() {
  console.log("Unloading.");
  chrome.browserAction.setBadgeText({text: ""});
});

Cependant, il est préférable de conserver les données plutôt que de s'appuyer sur runtime.onSuspend. Il ne permet pas autant de nettoyage que nécessaire et ne vous aidera pas en cas de plantage.