利用Google Chrome開發插件,在網頁中植入js代碼


Google Chrome是一個很強大的瀏覽器,提供了各種各樣的插件,大大提升了使用了的效率,比如vimium、honx等。

Google在提供這些插件的同時還允許用戶開發自己的插件。

最近在寫js的腳本采集程序,需要測試在網頁中的運行情況,因此可以利用Chrome插件進行測試。

 

1.首先第一步是新建一個文件夾,並新建一個manifest.json文件,內容如下

{
  "manifest_version": 2,

  "name": "Js implants",
  "description": "在網頁中植入寫好的js",
  "version": "1.0",

  "icons": {
    "128" : "icon.png"
  },
  "permissions": [
    "tabs", "http://*/*","https://*/*"
  ],
  "content_scripts": [
    {"js":["maidian.js"],"matches":["http://www.baidu.com/"]}
  ]
}

字段解釋:

manifes_version聲明是我們使用的版本。

name和description分別代表我們插件的名稱和描述,version則是插件本身的版本號,這些是用來向用戶展示所安裝的插件的相關信息。

icons指插件顯示在的圖標。

permissions是插件使用的權限,tabs允許使用chrome.tabs和chrome.windows的api,后面則是匹配模式,指可以和該模式的網站運行的代碼進行交互。

Content scripts是在Web頁面內運行的javascript腳本。通過使用標准的DOM,它們可以獲取瀏覽器所訪問頁面的詳細信息,並可以修改這些信息。其中js指的是要注入的腳本,marches定義了在哪些頁面注入Content scripts。

 

2.然后要定義好在manifest.json中聲明的資源文件,如上包括了icon.png和maidian.js,然后把文件放在manifest.json的同級目錄下。

3.接着需要做的事就是加載我們自定義的插件了,打開chrome的拓展程序面板,選擇“加載正在開發的拓展程序”,選擇我們上述新建的文件夾,然后就可以看到我們自己的已經運行在chrome中了。

4.看看插件的運行情況。

可以看到我的js腳本已經作用在百度首頁,並成功獲取到了我們需要的數據。

 

官方教程及api:https://developer.chrome.com/extensions/getstarted


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM