[Chrome extension] 被 Chrome extension manifest v2 搞翻了
今天正想要來修改一下自己寫的 chrome extension 時,
意外的在擴充功能頁面,看到了奇怪的訊息,
說「我們目前正逐漸汰換資訊清單第 1 版。請升級至第 2 版。」
這是什麼意思呢?
按下了連結,導到了 Google Chrome Extensions: Manifest Version 的頁面,
原來是說 chrome 正在逐漸汰換掉舊的 manifest v1 版本,之後都要改用 v2 才行了~
不過並不是加了一個 “manifest_version”: 2 如此簡單,
稍微瞄了一下說明,主要變革是一些 inline script 都不能用了,
就連平常在網頁元素中加上 onclick=”…” 這種寫法也不行,
全都必須抽出來在別的外部 js 檔才行,影響真的是非常的大…
雖然可以理解這是為了加強安全性(減少類似 cross-site scripting 等等的攻擊),
不過這等於是原本的程式都要大幅度的修改才行,真的是很不妙呀~~ =_=
看過說明,先實際把 manfiest_version 改成 2 看看,
一跑就發現我的兩個擴充功能都掛了 =_=…
到目前為止,把其中一個修正完畢了,另外一個還在努力中 =_=….
1. 修改 manifest.json 中的屬性
第一個要修改的,自然就是加上 manifest_version 了,目前是要設成 2。
另外,檢查一下 Google Chrome Extensions: Formats: Manifest Files 上的說明,
有部分的屬性改變了,例如原本的 background_page 屬性要換成 background:
“manifest_version”: 2,
“background”: {
“page”: “background.html”
},
}
2. HTML 檔中的 <script> 要抽出到獨立的 js 檔案
舉例來說,原本可能會這樣寫:
<html>
<head>
<script type=”text/javascript” src=”common.js”></script>
<script type=“text/javascript”>
function jsRun()
{
console.log(“running!”);
}
</script>
</head>
<body>
</body>
</html>
如果像上面這樣寫的話,在執行時就可以在 chrome 的 console 視窗,
看到這個錯誤訊息「Refused to execute inline script because it violates the following Content Security Policy directive: “script-src ‘self’ chrome-extension-resource:”.」
這種稱為 inline script 的東東,就算想在 manfiest v2 裡加上什麼東西來避免,
也是沒有辦法的…
唯一的辦法,就是把它抽出來放到另外的 js 檔案~
所以上面的一個 HTML 檔案就必須被分成 HTML 和 js 兩個檔案~
當然如果你有好幾個 HTML 檔案,可以把 javascript 的部分抽出集合成一個 js 檔也是可以~
<html>
<head>
<script type=“text/javascript” src=“common.js”></script>
<script type=“text/javascript” src=“popup.js”></script>
</head>
<body>
</body>
</html>
抽出來的 js 檔案則如下:
function jsRun()
{
console.log(“running!”);
}
3. HTML 元素中的事件函式也不能直接寫在元素內,要抽取出來
當然這是一種新式的好習慣,將 HTML 與 javascript 行為分開,
不過像我可能還蠻習慣這種舊式寫法的:
像這種在 HTML 元素裡,直接加上 onclick, onchange 之類的事件函式,
就都會被擋下來~~
必須用事後加上事件處理函式的方式~
例如,像我是用 jQuery 的語法,幫按鈕加上按下後的處理函式,
不過當然這下面的 javascript 的部分還是要抽出到別的 js 檔,不能跟 <button> 放在一起:
$(“#btnSave”).on(“click”, function(event)
{
jsSave();
});
4. 禁止使用 eval() 等函數來將資料變成可執行的程式碼
eval() 是很方便的東西,可以將一串文字拿來執行,
可以有很多的應用,當然也造成了容易有漏洞的產生~
像下面我原本是用 eval() 來把一個 JSON 物件的字串還原成 object,
但現在就會被擋下來了:
上面的例子還算好解決,改用 JSON.parse() 一樣可以把 JSON 物件還原回來,
不過如果原本是用 eval() 來執行一些運算或函式的話,可能就不太好解了…
5. setTimeout() 函式內,必須指定一個函式名稱,而不能是一個字串
其實在 setTimeout() 的第一個參數裡,大部分人應該都是用一個字串,
裡面可以放任意的 javascript 敘述~
不過現在在 manifest v2 版中,只能放一個函式名稱了…
如果函式有參數的話,想當然會遇到一些麻煩…
幸運的是,我寫的擴充功能是還沒有遇到… =_=
修正過的程式碼就像下面這樣:
以上幾點是目前遇到的問題,不過現在我也只處理好一個擴充功能,
另外一個處理上遇到的困難點較多,
有機會再來分享吧~願同志們一起繼續努力~~ Orz…
//
//
3 thoughts on “[Chrome extension] 被 Chrome extension manifest v2 搞翻了”
感谢你的分享,我的“人人2B过滤器”也需要更换了!
非常感谢,更新时发现被v2坑了OTL
非常感谢,受益匪浅