用web前端技术开发chrome扩展程序

[damoclesX]

现在前端技术真是无处不在啊。用前端技术来开发chrome扩展(测试在大多数基于chromium内核的浏览器都可用)。

参考地址: 入门：建立 Chrome 扩展程序

超级长的铺垫...:sleeping:

想要fq，之前花钱用别人的vpn账号，但是很不稳定，最近都不能用了（红杏），于是又去找免费的午餐了，经同事推荐，感觉还不错，找到了这个，是真免费，不过免费SHADOWSOCKS帐号的密码6小时换一次，开始发现不能翻的时候，都要去打开这个网址找到免费账号更换后的密码，多试几次我就烦了。想想这过程，点击收藏的网址，滚动到免费账号的地方，复制密码，再到客户端上面去改密码。（废话有点多哈:smile:）

于是想到去年什么时候做过的那种chrome扩展，只用了前端技术，抓取迅雷铺上面的电影，可以看到最新的更新内容，点击可以下载电影。这里也一样，我还是把免费fq账号的内容抓下来，要用的时候，直接点击下扩展，然后就给我账号密码，这多方便啊。说动就动

主要的东西就是，manifest.json,

{
  "manifest_version": 2,
  "name": "One-click Kittens",
  "description": "This extension demonstrates a browser action with kittens.",
  "version": "1.0",

  "permissions": [
    "https://secure.flickr.com/"
  ],
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  }

然后新建一个index.html文件，再找个好看点儿的图标。在index.html我用的功能比较少，主要是ajax请求那个跨域的页面(地址需要写在manifest.json的permissions的数组里面)，就可以得到那个页面的内容，然后用正则去匹配到账号密码的内容。

然后在chrome地址栏里面输入: chrome://extensions/ 选择开发者模式

选择加载已解压的扩展程序或者打包(可以得到一个crx的文件，想要发布到chrome扩展商店的话，要申请开发者账号，还要钱的)。我自己是选加载已解压的扩展程序，然后选择之前做的文件夹，然后就可以用了

以后用，我直接点一下，就出来了，感觉very good！:smile: