通过Chrome扩展来批量复制知乎好友

1.初始化文件
Chrome 官方扩展教程地址
新建一个文件夹 zhi-follow
下图中 1 部分为默认的图标3种尺寸
会显示在 Chrome 中

2. 定义按钮样式

页面上会有两个展示按钮，方便随时控制收听的进度

 1 .follow_them_box{ 2  position: fixed; 3  right: 200px; 4  top: 200px; 5  background-color: #fff; 6  width: 80px; 7  height: 30px; 8  line-height: 30px; 9  text-align: center;10  cursor: pointer;11  background: #8ab923;12  background-color: #9dcc4a;13  background-image: linear-gradient(top,#adda4d,#86b846);14  background-repeat: repeat-x;15  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#adda4d', endColorstr='#86b846', GradientType=0);16  text-shadow: 0 1px 0 rgba(255,255,255,.3);17  border: 1px solid #6d8f29;18  color: #3e5e00!important;19  border-radius: 5px;20  box-shadow: 0 1px 0 rgba(255,255,255,.5) inset,0 1px 0 rgba(0,0,0,.2);21 }22 .remove_box{23  top: 260px;24 }

3. manifest.json 文件配置

JSON做配置文件非常方便 PHP Python等都有便利的第三方包来解析

配置文件说明：

background 用来配置后台默认运行的JS 这里我们不需要。
content_scripts 用来配置在页面中载入的静态资源 matches来确定我们的资源会被加载到哪些域名

其他配置就是一些版本说明等。

js 这一栏配置上要加载的jQuery框架和我们的程序js

 1 { 2  "background": { 3    "persistent": false, 4    "scripts": [ "background.js" ] 5   }, 6  "content_scripts": [ { 7    "css": [ "show_follow.css" ], 8    "exclude_matches": [ "http://www.zhihu.com/read" ], 9    "js": [ "jquery-2.1.1.min.js","show_follow.js"],10    "matches": [ "http://www.zhihu.com/*" ]11   } ],12  "description": "批量收听指定用户的好友",13  "icons": {14    "128": "128.png",15    "16": "16.png",16    "48": "48.png"17   },18  "manifest_version": 2,19  "name": "「批量+」",20  "permissions": [ "storage" ],21  "short_name": "批量+",22  "update_url": "https://clients2.google.com/service/update2/crx",23  "version": "1.0"24 }

4. 写入主要功能
show_follow.js 相当于我们的入口文件，可定义各种功能。

4.1 先定义需要插入页面的dom按钮
4.2 绑定按钮事件
4.3 获取知乎页面中的 xsrf 值，否则无法提交表单
4.4 批量关注

jQuery(document).ready(function($) {  var z_url = "www.zhihu.com";  var follow = {    uchk_obj : $('.zm-profile-header-info-title'),    flink : $('.zm-profile-side-following>a').attr('href'),    fl_btn_obj : $('.zg-btn-follow'),    fl_them_div : '<div id="follow_them_box" title="本按钮只在用户好友页有效，收听当前所有新人">follow them</div>',    remove_div : '<div id="remove_box" title="清除页面中已经收听过的人">remove</div>',    hash_array : new Array(),    uchk : function(){      if (follow.uchk_obj.html() == '获得'){        return true;      }else{        console.info('uchk');        return false;      }    },    show_fl_btn : function(){      $('body').append(follow.fl_them_div);      $('body').append(follow.remove_div);    },    follow_user : function(uid,xsrf){      $.ajax({         url: '/node/MemberFollowBaseV2',         data: {method:'follow_member',            params:'{"hash_id":"'+uid+'"}',            _xsrf:xsrf           },         dataType: "text",         type: "POST",         success: function(response) {         }       });    },    //删除已收听过的人    remove_followed : function(){      $('#remove_box').on("click", function(){        var temp = '';        var uid = '' ;        //清空已收听        $('.zg-btn-unfollow').each(function(index, el) {          temp = $(this).html();          switch(temp){            case '取消关注':              $(this).parents('.zm-profile-section-item').css('display', 'none');              break;            default:              break;          }        });      });    },    follow_them : function(){      $('#follow_them_box').on("click", function(){        var xsrf = $("input[name='_xsrf']").val();        $('.zg-btn-follow').each(function(index, el) {          uid = $(this).attr('data-id');          $(this).parents('.zm-profile-section-item').css('display', 'none');          follow.hash_array.push(uid);        });        var times = 0;        var max_num = 0;        if (follow.hash_array.length < 50){            max_num = follow.hash_array.length;        }else{          max_num = 50;        }        var int=self.setInterval(function(){          follow.follow_user(follow.hash_array[times],xsrf);          times++;          if (times == max_num){            follow.hash_array = [];            int=window.clearInterval(int);          }        },1000);      });    }  };  if ( follow.uchk() ){    follow.show_fl_btn();    follow.remove_followed();    follow.follow_them();  }});

操作演示：

1. 在Chrome扩展中载入扩展包