背景頁 · Chrome 擴展開發文檔

# 背景頁擴展常常用一個單獨的長時間運行的腳本來管理一些任務或者狀態。 Background pages to the rescue. 如同 [architecture overview](overview.html#arch) 的解釋。背景頁是一個運行在擴展進程中的HTML頁面。它在你的擴展的整個生命周期都存在，同時，在同一時間只有一個實例處于活動狀態。在一個有背景頁的典型擴展中，用戶界面（比如，瀏覽器行為或者頁面行為和任何選項頁）是由沉默視圖實現的。當視圖需要一些狀態，它從背景頁獲取該狀態。當背景頁發現了狀態改變，它會通知視圖進行更新。 ### 清單請在[擴展清單](manifest.html)中注冊背景頁。一般，背景頁不需要任何HTML，僅僅需要js文件，比如： ``` { "name": "My extension", ... **"background": { "scripts": ["background.js"] }**, ... } ``` 瀏覽器的擴展系統會自動根據上面`scripts`字段指定的所有js文件自動生成背景頁。如果您的確需要自己的背景頁，可以使用`page`字段，比如： ``` { "name": "My extension", ... **"background": { "page": "background.html" }**, ... } ``` 如果你需要瀏覽器更早啟動 — 例如，你想顯示通知 — 那么，你也許也希望指定["background"權限](manifest.html#permissions_)。 ### 細節可以用類似于幀之間通訊的方式，直接使用腳本調用在一個擴展的多個頁面之間進行通訊。[`chrome.extension.getViews()`](extension.html#method-getViews) 方法會返回屬于你的擴展的每個活動頁面的窗口對象列表，而[`chrome.extension.getBackgroundPage()`](extension.html#method-getBackgroundPage) 方法返回背景頁。 ### 范例下面的代碼片段演示了擴展如何在背景頁中與其他頁面交互。同時也展示如何使用背景頁來處理事件，如用戶點擊。例子中的擴展有一個背景頁，多個由image.html創建的view頁面。（通過[`chrome.tabs.create()`](tabs.html#method-create)）。 ``` _//In background.js:_ // React when a browser action's icon is clicked. chrome.browserAction.onClicked.addListener(function(tab) { var viewTabUrl = chrome.extension.getURL('image.html'); var imageUrl = _/* an image's URL */_; // Look through all the pages in this extension to find one we can use. var views = chrome.extension.getViews(); for (var i = 0; i < views.length; i++) { var view = views[i]; // If this view has the right URL and hasn't been used yet... if (view.location.href == viewTabUrl && !view.imageAlreadySet) { // ...call one of its functions and set a property. view.setImageUrl(imageUrl); view.imageAlreadySet = true; break; // we're done } } }); _//In image.html:_ <html> <script> function setImageUrl(url) { document.getElementById('target').src = url; } </script> <body> <p> Image here: </p> <img id="target" src="white.png" width="640" height="480"> </body> </html> ```