Une page Option vous permet de définir des préférences pour votre WebExtension que vos utilisateurs peuvent modifier. Les utilisateurs peuvent accéder à la page d'options de l'extension à partir du gestionnaire des add-ons du navigateur:

La façon dont les utilisateurs accèdent à la page et la manière dont elle est intégrée à l'interface utilisateur du navigateur varient d'un navigateur à l'autre.

Vous pouvez ouvrir la page en programmant en appelant  runtime.openOptionsPage().

Les pages d'options ont une politique de sécurité de contenu qui restreint les sources à partir de laquelle elles peuvent charger des ressources et interdit certaines pratiques dangereuses telles que l'utilisation eval(). Voir la politique de sécurité de contenu pour plus de détails.

Spécification de la page d'options

Pour créer une page d'options, écrivez un fichier HTML définissant la page. Cette page peut inclure des fichiers CSS et JavaScript, comme une page Web normale. Cette page, contine un exemple dans favourite-colour, comprend un fichier :

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
  </head>

<body>
  <form>
      <label>Favourite colour</label>
      <input type="text" id="colour" >
      <button type="submit">Save</button>
  </form>
  <script src="options.js"></script>
</body>

</html>

JavaScript en cours d'exécution dans la page peut utiliser toutes les APIs des WebExtension au quelle l'extension à des permissions. En particulier, vous pouvez utiliser l'API storage pour conserver les préférences.

Insérez les fichiers de la page dans votre extension.

Vous devez également inclure une clé options_ui dans votre fichier manifest.json, en lui donnant l'URL de la page.

"options_ui": {
  "page": "options.html",
  "browser_style": true
},

Examples

Le depot webextensions-examples sur GitHub contient plusieurs exemples de WebExtensions qui utilisent les options de page :

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : hellosct1
 Dernière mise à jour par : hellosct1,