ホームページ >ウェブフロントエンド >jsチュートリアル >Chrome 拡張機能のコンテンツ スクリプトからグローバル変数にアクセスする方法

Chrome 拡張機能のコンテンツ スクリプトからグローバル変数にアクセスする方法

Patricia Arquette
Patricia Arquetteオリジナル
2024-10-26 05:45:02617ブラウズ

How to Access Global Variables from Content Scripts in Chrome Extensions?

Chrome 拡張機能のコンテンツ スクリプトからグローバル変数にアクセスする

jQuery.load( ) コンテンツ スクリプトでは、分離が原因でエラーが持続します。

解決策: スクリプト インジェクションとイベント リスナー

ページのウィンドウのグローバル プロパティにアクセスするには、以下の利用を検討してください。

  1. スクリプトの挿入: ページのコンテキストに新しいスクリプト要素を挿入します:
var s = document.createElement('script');
s.src = chrome.extension.getURL('script.js');
(document.head||document.documentElement).appendChild(s);

スクリプトが読み込まれたら、きれいにするために削除します:

s.onload = function() {
    s.remove();
};
  1. イベント リスナー: イベント リスナーを使用してデータを転送します:
document.addEventListener('RW759_connectExtension', function(e) {
    // e.detail contains transferred data, e.g., GLOBALS
});

コード例:

contentscript.js (document_end で実行):

// Inject script
var s = document.createElement('script');
s.src = chrome.extension.getURL('script.js');
(document.head||document.documentElement).appendChild(s);

// Event listener
document.addEventListener('RW759_connectExtension', function(e) {
    alert(e.detail); // Access GLOBALS
});

script.js ("run_at": "document_end" マニフェスト内):

setTimeout(function() {
    document.dispatchEvent(new CustomEvent('RW759_connectExtension', {
        detail: GLOBALS // Send data
    }));
}, 0);

マニフェスト ファイルの web_accessible_resources セクションに「script.js」を忘れずに追加してください。

ベスト プラクティス:

挿入されるロジックを最小限に抑えるスクリプトを作成し、コンテンツ スクリプトでほとんどの処理を処理して、拡張機能の信頼性と chrome.* API などの追加機能へのアクセスを確保します。

以上がChrome 拡張機能のコンテンツ スクリプトからグローバル変数にアクセスする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。