Comment résoudre « sendResponse n'attendant pas la fonction asynchrone ou la résolution de Promise » dans « chrome.tabs.sendMessage » de Chrome ?

Dépannage "sendResponse n'attend pas la fonction asynchrone ou la résolution de Promise"

Problème :
Chrome de Chrome. La fonction sendResponse de tabs.sendMessage n'attend pas fonctions asynchrones ou résolutions de promesses.

Analyse du problème :

Dans le code fourni, la fonction getThumbnails dans le script de contenu (contentscript.js) est une fonction asynchrone qui prend le temps d'exécuter. Cependant, la fonction sendResponse dans l'écouteur onMessage est invoquée immédiatement, potentiellement avant que getThumbnails n'ait terminé son exécution. Cela conduit sendResponse à renvoyer undéfini ou null en réponse.

Solution 1 : Supprimer le mot-clé asynchrone et déclarer une fonction asynchrone séparée

• Supprimer le mot-clé asynchrone de onMessage fonction d'écoute.
• Créez une fonction asynchrone distincte pour gérer le message traitement.
• Invoquez la fonction asynchrone distincte à partir de l'écouteur onMessage et gérez la réponse de manière appropriée.

Solution 2 : Corriger l'API pour l'écouteur asynchrone

• Ajoutez un correctif avant d'utiliser chrome.runtime.onMessage dans tous les scripts qui utilisent it.
• Le correctif redéfinit la méthode addListener pour activer les réponses de fonction Promise ou asynchrones au sein de l'écouteur.

Implémentation dans Contentscript.js :

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.message === "get_thumbnails") {
    getThumbnails().then(payload => {
      sendResponse({ payload });
      return true;  // Keep messaging channel open for sendResponse
    });
  }
});

async function getThumbnails() {
  // Your code to retrieve thumbnails
}

Mise en œuvre avec Patch :

// Patch to allow async/Promise listener
if ('crbug.com/1185241') {  // Replace with Chrome version check
  const { onMessage } = chrome.runtime;
  onMessage.addListener = fn => addListener.call(onMessage, (msg, sender, respond) => {
    const res = fn(msg, sender, respond);
    if (res instanceof Promise) return !!res.then(respond, console.error);
    if (res !== undefined) respond(res);
  });
}

chrome.runtime.onMessage.addListener(async msg => {
  if (msg === 'foo') {
    const res = await fetch('https://foo/bar');
    const payload = await res.text();
    return { payload };
  }
});

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!