Chrome の「chrome.tabs.sendMessage」で「sendResponse が非同期関数または Promise の解決を待機していません」を解決する方法は?

トラブルシューティング「sendResponse が非同期関数または Promise の解決を待機していない」

問題:
Chrome の chrome。 tabs.sendMessage の sendResponse 関数は待機しません。

問題分析:

提供されたコードでは、コンテンツ スクリプト (contentscript.js) 内の getThumbnails 関数は、実行する時間。ただし、onMessage リスナーの sendResponse 関数は、場合によっては getThumbnails の実行が完了する前に、ただちに呼び出されます。これにより、sendResponse は応答で unknown または null を返します。

解決策 1: Async キーワードを削除し、別の Async 関数を宣言する

• onMessage から async キーワードを削除します。リスナー関数。
• メッセージを処理する別の非同期関数を作成します。
• onMessage リスナーから別の非同期関数を呼び出し、応答を適切に処理します。

解決策 2: 非同期リスナーの API にパッチを適用する

• chrome.runtime.onMessage を使用するすべてのスクリプトで使用する前にパッチを追加してください。
• このパッチは、リスナー内で Promise または非同期関数の応答を有効にするために addListener メソッドを再定義します。

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
}

による実装パッチ:

// 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 };
  }
});

以上がChrome の「chrome.tabs.sendMessage」で「sendResponse が非同期関数または Promise の解決を待機していません」を解決する方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。