写chrome插件主要就是写js , 我们要构造界面(HTML), 以及样式(CSS), 以及chrome给我们提供的jsAPI, 主要是chrome的API, 调试的话可以使用chrome的开发者工具(f12)直接调试;
API地址的截图先过一遍, 这个非常重要:
如果从来没写过chrome插件, 我们可以参考这个打开, 里面有很多现成的DEMO, 我们能够直接在线看一些简单的DEMO代码:
我写的这个youku自动订阅助手使用了bootstrap和jQ(个人认为是标配,(●'◡'●)),也用了糖饼的artDialog插件,谢谢糖饼大神 , 主界面截图如下:
如果你点击登陆订阅的按钮就会刷新验证码,这个验证码在优酷获取的, 同时跳出一个prompt的弹窗要求你输入验证码,再点击确认就可以自动订阅在订阅列表中的用户;
在设置界面中可以设置自动登陆的用户和密码,用户名和密码通过"---"(横杠)分开,每条用户信息之间通过","(逗号)分开:
如果要批量订阅的话很好用, 那么问题来了,如果你有400个账号的话, 这400个账号同时要订阅(关注)400个账号, 那么你怎么办? 用自动输入验证码工具就好了哇,@me;
优酷登录的流程是先通过GET获取验证码, 然后再通过ajax发送验证码,用户名,密码,JSONCallBack,到一个地址,如果登录成功就返回成功的代码,并给客户端设置cookie;
订阅是通过GET一个链接,参数为你想订阅的订阅号;
chrome的插件需要一个配置文件, 这个文件的名字叫做“manifest.json”, (grunt的使用也需要一个配置的JSON,用处是一样的), 文件的里面就是各种配置参数, 在chrome打包扩展程序的时候会用到这些配置信息:
{ "name": "ykNono", "version": "0.0.0", "manifest_version": 2, "description": "youku登录助手", "browser_action" : {
//配置应用在chrome中显示的logo图片 "default_icon" : "yk_nono.png", "default_title" : "youku_login",
//可以通过点击应用的按钮打开 "default_popup" : "popup.html" },
//可以通过访问chrome的历史记录打开; "chrome_url_overrides" : { "history": "popup.html" },
//申请跨域请求,申请该插件中cookie的保存和读取; "permissions": [ "http://*/", "cookies" ] }
还有一个主界面的html,叫做"popup.html", 目前的结构如下:
然后在chrome中打开chrome://extensions/, 点击打包扩展程序:
此时又有另一个对话框出来, 我们点击"扩展程序根目录"浏览到新建的插件目录, 第一次不需要"私有密钥文件",因为chrome会帮助你生成一个key文件,以后直接选择这个key文件,毕竟后面都写了“可选”了....:
然后点击“打包扩展程序",就会生成一个crx后缀的文件,如果有问题chrome会告诉你哪里有错,你找到对应的问题自己改;
然后就可以把这个crx文件拖到”chrome://extensions/“的选项卡,chrome会提示你安装;
crx.crx直接的插件地址:http://files.cnblogs.com/files/diligenceday/crx.rar
github地址:https://github.com/sqqihao/youku_auto_sub
API参考:chrome浏览器的API参考
作者: NONO
出处:http://www.cnblogs.com/diligenceday/
QQ:287101329