ホームページ > ウェブフロントエンド > jsチュートリアル > Chrome の `onMessage` リスナーで `sendResponse()` が非同期関数を待機しないのはなぜですか?

Chrome の `onMessage` リスナーで `sendResponse()` が非同期関数を待機しないのはなぜですか?

DDD
リリース: 2024-11-22 16:29:14
オリジナル
737 人が閲覧しました

Why Doesn't `sendResponse()` Wait for Asynchronous Functions in Chrome's `onMessage` Listener?

「sendResponse」が非同期関数や Promise の解決を待たない

はじめに

popup.js からメッセージを送信する場合contentscript.js に、 sendResponse() 関数は、getThumbnails() 関数が完了するまで待機することが期待されます。ただし、このシナリオでは、sendResponse() が待機していないため、非同期性の問題が発生します。

問題の説明

主な問題は、Chrome がまだ onMessage リスナーの戻り値の Promise をサポートしていないことです。マニフェスト V2 と V3 の両方にあります。その結果、リスナーが async キーワードを宣言すると、onMessage で必要なリテラルの true 値の代わりに Promise が返されます。これにより、返された Promise が無視され、メッセージング チャネルが途中で閉じられます。

解決策: リスナーに互換性を持たせる

現在の Chrome 実装との互換性を確保するには、以前から async キーワードを削除します。関数パラメータ (request、sender、sendResponse) を指定し、メッセージを処理するための別の非同期関数を宣言します。処理:

chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
  if (msg.message === "get_thumbnails") {
    processMessage(msg).then(sendResponse);
    return true; // keep the messaging channel open for sendResponse
  }
});

async function processMessage(msg) {
  console.log('Processing message', msg);
  // ... asynchronous processing code
  return 'foo';
}
ログイン後にコピー

非同期/Promise リスナーを許可するための API へのパッチ適用

または、Chrome を使用して次のコードを各スクリプトに追加することで、API にパッチを適用して非同期/Promise リスナーを許可することもできます。 runtime.onMessage:

if ('crbug.com/1185241') { // replace with a check for Chrome version that fixes the bug
  const {onMessage} = chrome.runtime, {addListener} = onMessage; 
  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 の `onMessage` リスナーで `sendResponse()` が非同期関数を待機しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート