利用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脚本已经作用在百度首页,并成功获取到了我们需要的数据。