首頁 >web前端 >js教程 >如何從 Chrome 擴充功能中的內容腳本存取全域變數?

如何從 Chrome 擴充功能中的內容腳本存取全域變數?

Patricia Arquette
Patricia Arquette原創
2024-10-26 05:45:02620瀏覽

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

從Chrome 擴充程式中的內容腳本存取全域變數

儘管嘗試透過jQuery.load 從目前Gmail 郵件中擷取GLOBALS 變數( )在內容腳本中,由於隔離,錯誤仍然存在。

解決方案:腳本注入和事件偵聽器

要存取頁面視窗的全域屬性,請考慮使用:

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

記得將「script.js」加入到清單檔案中的web_accessible_resources 部分。

最佳實踐:

最小化注入中的邏輯腳本並處理內容腳本中的大部分處理,以確保擴展可靠性和對chrome.* API等附加功能的存取。

以上是如何從 Chrome 擴充功能中的內容腳本存取全域變數?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn