2012-08-05 69 views
1

我有一個Chrome擴展,它有一個對jQuery文件的引用。
這是我的彈出HTML(只有頭部標記):鉻擴展 - 清單版本2

<head> 
    <title>My Extention</title> 
    <script type="text/javascript" src="http://www.MySite.com/Resources/JS/JQuery/jquery-1.7.2.min.js"></script> 
    <script type="text/javascript" src="MyExtensionScript.js"></script> 
</head> 

所以在「MyExtensionScript.js」我以爲我可以使用jQuery但顯然$函數沒有定義。
這是我的manifest.json文件:

{ 
    "name": "My Test Extension", 
    "version": "1.0", 
    "manifest_version": 2, 
    "description": "Test version of My Extension", 
    "browser_action": { 
    "default_icon": "test.ico", 
    "default_popup": "Test.html" 
    }, 
    "permissions": [ 
    "cookies", 
    "tabs", 
    "<all_urls>" 
    ] 
} 
在它的工作清單第1版

,但現在沒有。我試圖使用「web_accessible_resources」並添加到他們「http://www.MySite.com/Resources/JS/JQuery/jquery-1.7.2.min.js」,但那也不起作用。有任何想法嗎?
另外,我有一個腳本注入到當前頁面並返回一條消息(在我的例子中是當前頁面的一些html源代碼),這種行爲是否會受到轉換爲清單2版本的影響? 謝謝大家:)

編輯:我有一個Web應用程序,使跨域腳本(使用JSONP)。在我的擴展中,我有一個腳本,用$ .getJSON調用我的站點中的Web服務。現在它不起作用。我很確定它與新的清單版本有關,但我如何再次啓用跨域腳本?

回答

4

您需要使用本地存儲在您的擴展中的jQuery文件,而不是從您的站點引用。

這是由於Chrome的嚴格Content Security Policy,僅允許執行本地腳本,沒有內嵌代碼。

Web Accessible Resources是您的擴展中的文件,可以通過網絡訪問,而不是您的擴展程序可以訪問的網絡上的資源。例如,如果您想要使用擴展程序中存儲的圖像更改頁面的背景圖像,則必須將該圖像添加到清單中的web_accessible_resouces列表中。

清單版本的更改不應影響您的內容腳本,除非它們執行了不再允許的操作。您可以查看Chrome manifestVersion文檔還有哪些變化。

+0

https資源可以列入白名單,但仍建議將腳本打包爲擴展名。 – 2012-08-05 09:53:47

+0

@RobW - 我如何將白名單中的http資源添加到白名單以及爲什麼仍然建議使用擴展名打包腳本? – 2012-08-05 15:08:05

+1

@GilTankus'http'資源不能被列入白名單(因此我說「https」)。重新包裝:假設用戶與互聯網斷開連接。然後,當資源是外部的時候,您的擴展將無法工作。 – 2012-08-05 21:23:50

1

我只是在我的內容腳本中包含jquery。只需確保在腳本之前加載它。

{ 
    "manifest_version": 2, 
    "default_title": "Babble", 
    "version": "1.2", 
    "description": "Chat in your language with friends in their language", 
    "default_locale": "en", 
    "default_icons": { 
    "16": "img/icon16.png", 
    "48": "img/icon48.png", 
    "128": "img/icon128.png" 
    }, 

    "content_scripts":[ 
    { 
     "matches": ["http://mail.google.com/*", "https://mail.google.com/*"], 
     "css" : ["css/style.css"], 
     "js" : ["js/jquery.js" , "js/translate.js" , "js/jquery.cookie.js"] 
    } 
    ] 
}