ホームページ > ウェブフロントエンド > jsチュートリアル > ブレークポイントがない場合、Chrome 拡張機能のタブ情報が空のように表示されるのはなぜですか?

ブレークポイントがない場合、Chrome 拡張機能のタブ情報が空のように表示されるのはなぜですか?

Barbara Streisand
リリース: 2024-10-31 16:49:02
オリジナル
628 人が閲覧しました

Why Does My Chrome Extension's Tab Information Appear Empty Without Breakpoints?

非同期関数呼び出し: Chrome タブ情報取得の遅延を理解する

Chrome 拡張機能の開発中に、chrome.tabs.query を通じて取得された結果が次のように表示されるという問題が発生しました。コードがブレークポイントなしで実行された場合は使用できません。この問題を分析するために、chrome.tabs.query 関数の非同期の性質を詳しく調べます。

非同期関数呼び出し

chrome.tabs.query のような非同期関数は、次の場所でコードを実行します。メインの実行フローとは独立した、後の時点。コード スニペット内:

// Initialize an empty array
var fourmTabs = new Array();
// Initiate asynchronous `chrome.tabs.query` call
chrome.tabs.query({}, function (tabs) {
    // Iterate over returned tabs
    for (var i = 0; i < tabs.length; i++) {
        // Store tabs in array
        fourmTabs[i] = tabs[i];
    }
});
ログイン後にコピー

このコードを実行すると、chrome.tabs.query 呼び出しが実行されてリクエストが開始されますが、JavaScript の実行は次の行に続きます。 chrome.tabs.query の 2 番目の引数として指定されたコールバック関数は、すぐには呼び出されません。

// Print tab URLs (before callback has been called)
for (var i = 0; i < fourmTabs.length; i++) {
    if (fourmTabs[i] != null)
        window.console.log(fourmTabs[i].url);
    else {
        window.console.log("??" + i);
    }
}
ログイン後にコピー

上記のコードでは、ループが実行されるとき、コールバック関数が次の値を持っているため、fourmTabs 配列はまだ空です。まだ呼ばれていません。したがって、コンソールには「??」と出力されます。

ブレークポイントを使用すると、コードの実行が一時停止され、コールバック関数が実行して fourmTabs 配列を更新できるようになります。これにより、2 番目のループが更新されたタブ情報にアクセスし、URL が正しく出力されるようになります。

問題の解決

この問題を解決し、コードを実行したときにタブが使用できるようにするにはブレークポイントを使用するには、2 番目のループを chrome.tabs.query のコールバック関数内に移動します。これにより、コールバックが呼び出された後にループが実行されることが保証されます。

// Initialize an empty array
var fourmTabs = new Array();
// Initiate asynchronous `chrome.tabs.query` call
chrome.tabs.query({}, function (tabs) {
    // Update `fourmTabs` array
    for (var i = 0; i < tabs.length; i++) {
        fourmTabs[i] = tabs[i];
    }
    // Print tab URLs (after callback has been called)
    for (var i = 0; i < fourmTabs.length; i++) {
        if (fourmTabs[i] != null)
            window.console.log(fourmTabs[i].url);
        else {
            window.console.log("??" + i);
        }
    }
});
ログイン後にコピー

この変更により、2 番目のループは fourmTabs 配列が呼び出された後にのみ実行されるため、コードはブレークポイントを必要とせずに正しく実行されます。コールバック関数によって更新されました。

以上がブレークポイントがない場合、Chrome 拡張機能のタブ情報が空のように表示されるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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