油猴脚本之恢复知乎关注专栏功能

    知乎把关注专栏功能给删除了，但是保留了取消关注专栏功能

      

    抓包看了下取消关注：

    

    留意到在这个请求之前有个OPTIONS包，支持PUT，DELETE等方法，推测关注应该就是PUT

    

    尝试PUT发现报错

    

    换其他专栏试试

    

   

    关注成功，看来是已关注的专栏不能再关注
    那么脚本的思路便有了，脚本如下：

 

// ==UserScript==
// @name         知乎关注专栏
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  恢复知乎关注专栏功能
// @author       You
// @match        https://www.zhihu.com/column/*
// @require      https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js
// @grant        none
// ==/UserScript==

//copy from https://gist.githubusercontent.com/raw/2625891/waitForKeyElements.js
function waitForKeyElements (
    selectorTxt,    /* Required: The jQuery selector string that
                        specifies the desired element(s).
                    */
    actionFunction, /* Required: The code to run when elements are
                        found. It is passed a jNode to the matched
                        element.
                    */
    bWaitOnce,      /* Optional: If false, will continue to scan for
                        new elements even after the first match is
                        found.
                    */
    iframeSelector  /* Optional: If set, identifies the iframe to
                        search.
                    */
) {
    var targetNodes, btargetsFound;

    if (typeof iframeSelector == "undefined")
        targetNodes     = $(selectorTxt);
    else
        targetNodes     = $(iframeSelector).contents ()
                                           .find (selectorTxt);

    if (targetNodes  &&  targetNodes.length > 0) {
        btargetsFound   = true;
        /*--- Found target node(s).  Go through each and act if they
            are new.
        */
        targetNodes.each ( function () {
            var jThis        = $(this);
            var alreadyFound = jThis.data ('alreadyFound')  ||  false;

            if (!alreadyFound) {
                //--- Call the payload function.
                var cancelFound     = actionFunction (jThis);
                if (cancelFound)
                    btargetsFound   = false;
                else
                    jThis.data ('alreadyFound', true);
            }
        } );
    }
    else {
        btargetsFound   = false;
    }

    //--- Get the timer-control variable for this selector.
    var controlObj      = waitForKeyElements.controlObj  ||  {};
    var controlKey      = selectorTxt.replace (/[^\w]/g, "_");
    var timeControl     = controlObj [controlKey];

    //--- Now set or clear the timer as appropriate.
    if (btargetsFound  &&  bWaitOnce  &&  timeControl) {
        //--- The only condition where we need to clear the timer.
        clearInterval (timeControl);
        delete controlObj [controlKey]
    }
    else {
        //--- Set a timer, if needed.
        if ( ! timeControl) {
            timeControl = setInterval ( function () {
                    waitForKeyElements (    selectorTxt,
                                            actionFunction,
                                            bWaitOnce,
                                            iframeSelector
                                        );
                },
                300
            );
            controlObj [controlKey] = timeControl;
        }
    }
    waitForKeyElements.controlObj   = controlObj;
}

function followColumn(button){
      var action = "";
      var isFollow = true;
      if(button.textContent === '关注专栏'){
        action = "PUT";
        isFollow = true;
      }
      else if(button.textContent === '取消关注专栏'){
        action = "DELETE";
        isFollow = false;
      }
      var xmlhttp = new XMLHttpRequest();
      xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) {
            if (xmlhttp.status == 200) {
               if(isFollow){
                   button.textContent = '取消关注专栏';
               }
               else{
                   button.textContent = '关注专栏'
               }
            }
            else if (xmlhttp.status == 500){
                button.textContent = '取消关注专栏';
                alert('已关注专栏，请勿重复关注');
            }
        }
    };
    var column = location.href.split('/').pop();
    var index = column.indexOf('?');
    if(index != -1){
        column = column.substring(0, index);
    }
    xmlhttp.open(action, "https://zhuanlan.zhihu.com/api/columns/" + column + "/followers", true);
    xmlhttp.withCredentials = true;
    xmlhttp.send();
}

function createFollowButton(){
    var menu = document.querySelector('div.css-16qos9m');
    var menuItem = document.createElement('div');
    menuItem.className = 'css-7q9l37';
    var button = document.createElement('button');
    button.className = 'Button FEfUrdfMIKpQDJDqkjte Button--plain fEPKGkUK5jyc4fUuT0QP';
    button.setAttribute('type', 'button');
    button.setAttribute('xt-marked', 'ok');
    button.textContent = '关注专栏';
    button.addEventListener('click', function(){
        followColumn(button);
    });
    menuItem.appendChild(button);
    menu.appendChild(menuItem);
}


(function() {
    'use strict';
    waitForKeyElements ("div.css-16qos9m", createFollowButton);
})();

    讲下写脚本中踩过的坑，由于脚本加载的时候父节点div.css-16qos9m还不存在，所以用了waitForKeyElements 来等父节点生成后再调用创建关注专栏按钮的函数，考虑到国内的网络所以把整个脚本waitForKeyElements.js复制过来了

    最后的效果如下： 

   

    参考：https://stackoverflow.com/a/12899331