Quelle est la meilleure façon d'appeler un contenu des scripts en fonction de l'arrière-plan de script dans une extension de Firefox?

Question 1

Je veux appeler une fonction qui est mise en œuvre dans le contenu du script d'extension, qui obtient le texte sélectionné à partir de pages web, à partir d'une fonction dans l'arrière-plan script qui sera appelé plus tard dans un écouteur est connecté à un élément de menu.

Est-ce possible et quel serait le chemin le plus court pour le faire?

Voici les extraits de code:

le manifeste.json

 "background": {
    "scripts": ["background.js"]
  },
  
  "content_scripts": [
  {
    "matches": ["<all_urls>"],
    "js": ["content.js"]
  }
]

content.js

var text = "";
    
function highlightedText() {
  text = content.getSelection();
}

background.js

function listenerFunction() {

    highlightedText();
    
    /* Doing various stuff that have to use the text variable */
  }
  
    browser.menus.onClicked.addListener((info, tab) => {
    highlightedText();
  });

Évidemment, le code ci-dessus ne fonctionne pas comme le "souligné" la fonction est désormais visible de l'arrière-plan de script.

Donc, quel est le moyen le plus rapide / le plus court chemin pour rendre le code du travail?

Question 2

OK. Je vais avoir à la crèche ce à partir de l'un de mes propres privés extensions, mais l'essentiel est ceci:

Dans le fond de script définir le menu, et de lui attribuer une fonction à la onclick prop:

browser.menus.create({
  id: 'images',
  title: 'imageDownload',
  contexts: ['all'],
  onclick: downloadImages
}, onCreated);

Toujours dans le même script obtenez de l'onglet actuel de l'information, et d'envoyer un message au contenu du script.

function getCurrentTab() {
  return browser.tabs.query({ currentWindow: true, active: true });
}

async function downloadImages() {
  const tabInfo = await getCurrentTab();
  const [{ id: tabId }] = tabInfo;
  browser.tabs.sendMessage(tabId, { trigger: 'downloadImages' });
}

Le contenu du script écoute le message:

browser.runtime.onMessage.addListener(({ trigger }) => {
  if (trigger === 'downloadImages') doSomething();
});

Et une fois que le traitement est fait passer un nouveau message à l'arrière-plan de script.

function doSomething() {
  const data = [1, 2, 3];
  browser.runtime.sendMessage({ trigger: 'downloadImages', data });
}

Et, dans un autre contexte script que j'ai la chose comme suit:

browser.runtime.onMessage.addListener(function (data) {
  const { trigger } = data;
  if (trigger === 'downloadImages') ...
});

Andy · Answer 1 · 2021-10-29T12:40:02

OK. Je vais avoir à la crèche ce à partir de l'un de mes propres privés extensions, mais l'essentiel est ceci:

Dans le fond de script définir le menu, et de lui attribuer une fonction à la onclick prop:

browser.menus.create({
  id: 'images',
  title: 'imageDownload',
  contexts: ['all'],
  onclick: downloadImages
}, onCreated);

Toujours dans le même script obtenez de l'onglet actuel de l'information, et d'envoyer un message au contenu du script.

function getCurrentTab() {
  return browser.tabs.query({ currentWindow: true, active: true });
}

async function downloadImages() {
  const tabInfo = await getCurrentTab();
  const [{ id: tabId }] = tabInfo;
  browser.tabs.sendMessage(tabId, { trigger: 'downloadImages' });
}

Le contenu du script écoute le message:

browser.runtime.onMessage.addListener(({ trigger }) => {
  if (trigger === 'downloadImages') doSomething();
});

Et une fois que le traitement est fait passer un nouveau message à l'arrière-plan de script.

function doSomething() {
  const data = [1, 2, 3];
  browser.runtime.sendMessage({ trigger: 'downloadImages', data });
}

Et, dans un autre contexte script que j'ai la chose comme suit:

browser.runtime.onMessage.addListener(function (data) {
  const { trigger } = data;
  if (trigger === 'downloadImages') ...
});

Ne les onglets.getCurrent() travail en arrière-plan script dans votre code? Je reçois un non-traitée (promettre) TypeError: tabInfo est pas défini d'erreur. J'ai lu dans les onglets.getCurrent() documentation: Note: Cette fonction n'est utile que dans des contextes où il y a un onglet du navigateur, comme une page d'options. Si vous appelez à partir d'un fond de script ou une fenêtre, il sera de retour undefined.
Mon extension ne fonctionne si il n'a pas. Mon code est un exemple de la façon dont il devrait fonctionner, et qui fonctionne avec mon fond de script. Quelles sont les données que vous obtenez de tabs.getCurrent()?
@Costas j'ai ajouté un peu de mon code qui est manquante (la getCurrentTab la fonction). J'espère que ça va aider.
J'ai été faire undefined evidemment, à cause de tabs.getCurrent() était de retour undefined. Votre fixe le code de l'erreur. Maintenant, je suis pas un Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist à partir de cette ligne de code: browser.tabs.sendMessage(tabId, { trigger: 'downloadImages' }); J'ai ce code: browser.runtime.onMessage.addListener(({ trigger }) => { if (trigger === 'downloadImages') doSomething(); }); dans le contenu du script, mais évidemment il n'est pas vu de l'arrière-plan de script.
Vous avez demandé un exemple, je vous ai donné un. Il montre les bases à propos de la messagerie qui est ce que vous avez demandé. Ce code peut ne pas répondre à vos besoins spécifiquement vous avez juste à travailler autour d'elle un peu pour s'adapter à votre code. Ne vous contentez pas de soulever le code de cette réponse et espérer qu'il fonctionne. Penser que vous pouvez adapter le code pour l'adapter à vos besoins.
J'ai juste eu un coup d'oeil à l'extension de nouveau il y a quelques minutes... Dans le débogueur, dans Devtools je vois que seul le fond de script est chargé! Donc, c'est le problème. Le contenu du script ne se charge pas du tout. Je ne comprends pas pourquoi si, comme je ne vois pas de problèmes dans la manifest.json fichier.

Quelle est la meilleure façon d'appeler un contenu des scripts en fonction de l'arrière-plan de script dans une extension de Firefox?

La question

La meilleure réponse

Dans d'autres langues

Cette page est dans d'autres langues

Populaires dans cette catégorie

Questions populaires dans cette catégorie