擴充套件與網頁的執行階段

基本上我們可以把Extension想成一個獨立的網站，他跟使用者載入頁面是完全獨立的兩個個體，擁有不同的執行階段，並且兩者之間只能籍由注入內容腳本來溝通(處理跨網域的問題)。

處於不同執行階段的腳本當然無法直接溝通，也因此會延伸一些問題，為了幫助大家釐清這個狀況，就讓我們來看看前面提過的三個腳本類型，分別所屬哪些執行階段，又有哪些延伸議題。

• 事件腳本 Event scripts ：
  • 描述擴充功能的執行階段。
  • 為了監聽各種API提供的事件，能長時間在背景運行(但不代表永遠運行)，擔任中央控制器的角色。
  • 除了event script外，大多數的腳本都不會長時間持續運作，所以在開發時，我們比較依懶event script來實作功能邏輯。
• 彈出視窗腳本 Popup scripts：
  • 描述擴充功能的執行階段。
  • 但作為資源(src)的方式在popup html裡載入，自然只有在popup開啟的狀態下才會載入。
  • 因為上面的因素，所以有些事件，彈出腳本是監聽不到的。(例如：套件的安裝或移除事件)
• 內容腳本 Content scripts：
  • 描述網頁環境的執行階段，而不是擴充功能的執行階段。
  • 內容腳本可視為使用者瀏覽網頁的一部份，也因此跟其他腳本類型比較起來，API的存取非常非常有限。
  • 但內容腳本能使用chrome. runtime底下的訊息API來間接使用 extension的完整功能。
  • 內容腳本能操作及維護使用者載入的網頁，這是其他兩個腳本組件作不到的事情。

三個腳本的API存取權自由度由大到小： 事件腳本 > 彈出視窗 > 內容腳本

三種類型的腳本之間均只能間接經由chrome. runtime的訊息API來傳遞訊息。我們會在之後的章節中詳細探討message API。

小結

• 我們要知道不同的腳本組件，有不同的執行階段以及詞作用域，彼此之間無法直接存取對方的變數跟方法。
• 執行階段是巢狀的，因此作為最外層的Chrome提供API讓擴充功能籍由內容腳本與網頁溝通。
• 內容腳本( Content script) 是一個非常特別的存在，事實應將他視為使用者載入頁面中的一部份，而不是extension的一部份。
• 腳本之間能經由各種不同的Message API來進行間接的溝通。

參考資料

• 作者說明了 extension 以及 載入網頁 是兩個執行狀態，並且講解如何溝通：http://blog.walty8.com/simple-gmail-notes-chrome-extension/
• 作者認為背景頁面擔任控制器的角色：http://www.benknowscode.com/2014/06/develop-patterns-browser-extensions.html
• 作者認為 extension 跟載入網頁 可視為兩個不同的網站：http://www.tomforth.co.uk/chromeextension/
• http://www.apress.com/us/book/9781484217740
• https://developer.chrome.com/extensions

花絮(？)

我知道連著好幾篇都在講架構還有概念，完全沒有實作會有點悶，但這些觀念搞清楚，我們在實作的過程中才不會迷失在腳本組件裡面。(好吧，其實迷路的是我，K了好多個小時，千言萬語不如一張圖)

總之下面開始就有實作了(哦耶)。