6 實現微信公衆號自動回覆功能

時間 2019-11-12

標籤實現微信公衆號自動回覆功能简体版

原文原文鏈接

一實先自動回覆功能的邏輯步驟

　　1 處理POST類型的控制邏輯，接收XML的數據包；node

　　2 解析XML數據包（得到數據包的消息類型或者是事件類型）；git

　　3 拼裝咱們定義好的消息；web

　　4 包裝成XML格式；npm

　　5 在5秒內返回回去json

二代碼實操--實現關注公衆號自動回覆功能

　　本節代碼參照上節課繼續修改和完善，目錄結構跟以前相同，新引入的模塊raw-body使用npm install安裝一下便可，app.js啓動文件和util.js不作變更，主要修改一下generator.js文件，以及在generator.js同級目錄下新建wechat.js文件和tools.js文件。api

　　wechat.js文件是將前一節generator.js文件中票據部分的代碼抽離出來單獨放在一個文件中，具體代碼以下：數組

'use strict';
// 引入模塊
var Promise = require('bluebird');
var request = Promise.promisify(require('request'));

//增長url配置項
var prefix = 'https://api.weixin.qq.com/cgi-bin/';
var api = {
    accessToken: prefix + 'token?grant_type=client_credential'
};

//利用構造函數生成實例 完成票據存儲邏輯
function weChat(opts) {
    var that = this;
    this.appID = opts.appID;
    this.appSecret = opts.appSecret;
    this.getAccessToken = opts.getAccessToken;
    this.saveAccessToken = opts.saveAccessToken;
    //獲取票據的方法
    this.getAccessToken()
        .then(function(data) {
            //從靜態文件獲取票據，JSON化數據，若是有異常，則嘗試更新票據
            try {
                data = JSON.parse(data);
            } catch (e) {
                return that.updateAccessToken();
            }
            //判斷票據是否在有效期內，若是合法，向下傳遞票據，若是不合法，更新票據
            if (that.isValidAccessToken(data)) {
                Promise.resolve(data);
            } else {
                return that.updateAccessToken();
            }
        })
        //將拿到的票據信息和有效期信息存儲起來
        .then(function(data) {
            //console.log(data);
            that.access_token = data.access_token;
            that.expires_in = data.expires_in;

            that.saveAccessToken(data);
        })
};

//在weChat的原型鏈上增長驗證有效期的方法
weChat.prototype.isValidAccessToken = function(data) {
    //進行判斷，若是票據不合法，返回false
    if (!data || !data.access_token || !data.expires_in) {
        return false;
    }
    //拿到票據和過時時間的數據
    var access_token = data.access_token;
    var expires_in = data.expires_in;
    //獲取當前時間
    var now = (new Date().getTime());
    //若是當前時間小於票據過時時間，返回true，不然返回false
    if (now < expires_in) {
        return true;
    } else {
        return false;
    };
};

//在weChat的原型鏈上增長更新票據的方法
weChat.prototype.updateAccessToken = function() {
    var appID = this.appID;
    var appSecret = this.appSecret;
    var url = api.accessToken + '&appid=' + appID + '&secret=' + appSecret;

    return new Promise(function(resolve, reject) {
        //使用request發起請求
        request({
            url: url,
            json: true
        }).then(function(response) {
            var data = response.body;
            var now = (new Date().getTime());
            var expires_in = now + (data.expires_in - 20) * 1000;
            //把新票據的有效時間賦值給data
            data.expires_in = expires_in;
            resolve(data);
        })
    })
};

//向外暴露weChat
module.exports = weChat;

　　generator.js文件進行精簡後，添加判斷對xml數據的格式化方法以及判斷事件，添加關注事件測試信息，具體代碼以下：服務器

'use strict';
// 引入模塊
var sha1 = require('sha1');
var getRawBody = require('raw-body');
var weChat = require('./wechat');
var tools = require('./tools');

// 創建中間件函數並暴露出去
module.exports = function(opts, handler) {
    //實例化weChat()函數
    //var wechat = new weChat(opts);
    return function*(next) {
        //console.log(this.query);
        var that = this;
        var token = opts.token;
        var signature = this.query.signature;
        var nonce = this.query.nonce;
        var timestamp = this.query.timestamp;
        var echostr = this.query.echostr;
        // 進行字典排序
        var str = [token, timestamp, nonce].sort().join('');
        // 進行加密
        var sha = sha1(str);
        //使用this.method對請求方法進行判斷
        if (this.method === 'GET') {
            // 若是是get請求 判斷加密後的值是否等於簽名值
            if (sha === signature) {
                this.body = echostr + '';
            } else {
                this.body = 'wrong';
            };
        } else if (this.method === 'POST') {
            //若是是post請求 也是先判斷簽名是否合法 若是不合法 直接返回wrong
            if (sha !== signature) {
                this.body = 'wrong';
                return false;
            };
            //經過raw-body模塊 能夠把把this上的request對象 也就是http模塊中的request對象 去拼裝它的數據 最終拿到一個buffer的xml數據
            //經過yield關鍵字 獲取到post過來的原始的XML數據
            var data = yield getRawBody(this.req, {
                length: this.length,
                limit: '1mb',
                encoding: this.charset
            });
            //console.log(data.toString());打印XML數據（當微信公衆號有操做的時候 終端能夠看到返回的XML數據）
            //tools爲處理XML數據的工具包 使用tools工具包的parseXMLAsync方法 把XML數據轉化成數組對象
            var content = yield tools.parseXMLAsync(data);
            //console.log(content);打印轉化後的數組對象
            //格式化content數據爲json對象
            var message = tools.formatMessage(content.xml);
            console.log(message);
            //打印message
            //判斷message的MsgType 若是是event 則是一個事件
            if (message.MsgType === 'event') {
                //若是是訂閱事件
                if (message.Event === 'subscribe') {
                    //獲取當前時間戳
                    var now = new Date().getTime();
                    //設置回覆狀態是200
                    that.status = 200;
                    //設置回覆的類型是xml格式
                    that.type = 'application/xml';
                    //設置回覆的主體
                    that.body = '<xml>' +
                        '<ToUserName><![CDATA[' + message.FromUserName + ']]></ToUserName>' +
                        '<FromUserName><![CDATA[' + message.ToUserName + ']]></FromUserName>' +
                        '<CreateTime>' + now + '</CreateTime>' +
                        '<MsgType><![CDATA[text]]></MsgType>' +
                        '<Content><![CDATA[你好，同窗！]]></Content>' +
                        '</xml>';
                    return;
                }
            }
        }

    }
};

　　tools.js是處理XML數據的工具文件：微信

'use strict';
//引入模塊
var xml2js = require('xml2js');
var Promise = require('bluebird');
//導出解析XML的方法
exports.parseXMLAsync = function(xml) {
    return new Promise(function(resolve, reject) {
        xml2js.parseString(xml, { trim: true }, function(err, content) {
            if (err) {
                reject(err);
            } else {
                resolve(content);
            };
        });
    });
};
//由於value值多是嵌套多層的 因此先對value值進行遍歷
function formatMessage(result) {
    //聲明空對象message
    var message = {};
    //對result類型進行判斷
    if (typeof result === 'object') {
        //若是是object類型 經過Object.keys()方法拿到result全部的key 並存入keys變量中
        var keys = Object.keys(result);
        //對keys進行循環遍歷
        for (var i = 0; i < keys.length; i++) {
            //拿到每一個key對應的value值
            var item = result[keys[i]];
            //拿到key
            var key = keys[i];
            //判斷item是否爲數組或者長度是否爲0
            if (!(item instanceof Array) || item.length === 0) {
                //若是item不是數組或者長度爲0 則跳過繼續向下解析
                continue;
            }
            //若是長度爲1
            if (item.length === 1) {
                //拿到value值存入val變量
                var val = item[0];
                //判斷val是否爲對象
                if (typeof val === 'object') {
                    //若是val爲對象 則進一步進行遍歷
                    message[key] = formatMessage(val);
                } else {
                    //若是不是對象 就把值賦給當前的key放入message裏 並去除收尾空格
                    message[key] = (val || '').trim();
                }
            }
            //若是item的長度既不是0也不是1 則說明它是一個數組
            else {
                //把message的key設置爲空數組
                message[key] = [];
                //對數組進行遍歷
                for (var j = 0, k = item.length; j < k; j++) {
                    message[key].push(formatMessage(item[j]));
                }
            }
        }
    }
    return message;
}

exports.formatMessage = function(xml) {
    return new Promise(function(resolve, reject) {
        xml2js.parseString(xml, { trim: true }, function(err, content) {
            if (err) {
                reject(err);
            } else {
                resolve(content);
            };
        });
    });
};

exports.formatMessage = formatMessage;

　　以上代碼完成後，當關注微信測試公衆號的時候，會自動回覆『你好，同窗！』的提示信息。app

三封裝消息響應模塊

　　上面，咱們已經實現了關注微信測試公衆號自動回覆的功能。可是，在generator.js的代碼中回覆主體部分，使用的是字符串拼接的方式，並且是寫死的只能針對「關注事件」響應回覆消息，顯然這並非咱們想要的效果，從微信公衆平臺的開發文檔，咱們能夠看到，有以下如所示的這麼多種消息回覆類型：

　　這麼多種消息回覆類型，若是咱們像以前代碼中寫的那樣，使用字符串拼接的方式來實現，很顯然，這並不科學：

　　一方面，以這種字符串拼接的方式來設置消息回覆繁瑣易出錯，另外一方面，將消息回覆的代碼放在generator.js裏也不是一種科學的書寫方式，咱們最好把消息回覆的這些代碼封裝成一個獨立的消息響應模塊，而後給集成到weChat()這個構造函數上，讓生成的實例幫咱們完成其餘事情。

　　在消息響應模塊中，咱們使用了EJS和heredoc這兩個模塊，用於處理模板數據格式，一樣是使用npm install命令安裝模塊就能夠了。

　　新建模板文件template.js，用於存放回復消息模板以及一些處理函數：

'use strict';

//引入ejs模塊 EJS是一個JavaScript模板庫 用來從JSON數據中生成HTML字符串
var ejs = require('ejs');
//引入heredoc模塊 heredoc是一個簡易的模版 用來組織複雜文本串 簡化的代碼難度 是用來引用字符串的一種方式
var heredoc = require('heredoc');
//針對不一樣的消息類型獲取不一樣的模板
var template = heredoc(function() {
    /*
        <xml>
        <ToUserName><![CDATA[<%= toUserName %>]]></ToUserName>
        <FromUserName><![CDATA[<%= fromUserName %>]]></FromUserName>
        <CreateTime> <%= createTime %></CreateTime>
        <MsgType><![CDATA[<%= msgType %>]]></MsgType>
        <% if (msgType === 'text'){ %>
            <Content><![CDATA[<%= content %>]]></Content>
        <% } else if (msgType === 'image'){ %>
            <Image>
                <MediaId><![CDATA[<%= content.media_id %>]]></MediaId>
            </Image>
        <% } else if (msgType === 'voice'){ %>
            <Voice>
                <MediaId><![CDATA[<%= content.media_id %>]]></MediaId>
            </Voice>
        <% } else if (msgType === 'video'){ %>
            <Video>
                <MediaId><![CDATA[<%= content.media_id %>]]></MediaId>
                <Title><![CDATA[<%= content.title %>]]></Title>
                <Description><![CDATA[<%= content.description %>]]></Description>
            </Video> 
        <% } else if (msgType === 'music'){ %>
            <Music>
                <Title><![CDATA[<%= content.TITLE %>]]></Title>
                <Description><![CDATA[<%= content.DESCRIPTION %>]]></Description>
                <MusicUrl><![CDATA[<%= content.musicUrl %>]]></MusicUrl>
                <HQMusicUrl><![CDATA[<%= content.hqMusicUrl %>]]></HQMusicUrl>
                <ThumbMediaId><![CDATA[<%= content.thumbMediaId %>]]></ThumbMediaId>
            </Music>
        <% } else if (msgType === 'news'){ %>
            <ArticleCount><%= content.length %></ArticleCount>
            <Articles>
            <%= content.forEach(function(item){ %>
                <item>
                    <Title><![CDATA[<%= item.title %>]]></Title> 
                    <Description><![CDATA[<%= item.description %>]]></Description>
                    <PicUrl><![CDATA[<%= item.picUrl %>]]></PicUrl>
                    <Url><![CDATA[<%= item.url %>]]></Url>
                </item>
            <% }) %>
            </Articles>    
        <% } %>
        </xml>
    */
});

//編譯template模板
var compiled = ejs.compile(template);
//向外暴露模板
exports = module.exports = {
    compiled:compiled
};

　　消息響應模塊已經完成，如今，能夠把generator.js裏事件判斷和消息回覆部分的代碼進行從新調整：

            //格式化content數據爲json對象
            var message = tools.formatMessage(content.xml);
            console.log(message);//打印message
            //將message掛載到this.weixin上
            this.weixin = message;
            //使用yield next將控制權交出去 交給業務層 讓業務層決定如何對解析後的微信消息作分析和回覆
            yield handler.call(this, next);
            //進行回覆
            wechat.reply.call(this);

　　能夠看到，以前截圖的不科學部分的代碼，已經刪掉了，而消息回覆的部分指向了reply的方法，而這個方法，咱們尚未添加，如今打開wechat.js文件：

//在weChat的原型鏈上增長reply方法
weChat.prototype.reply = function() {
    var content = this.body;
    var message = this.weixin;
    //調用工具函數
    var xml = tools.template(content, message);
    //設置回覆狀態是200
    this.status = 200;
    //設置回覆的類型是xml格式
    this.type = 'application/xml';
    //設置回覆主體
    this.body = xml;
};
//向外暴露weChat
module.exports = weChat;

　　在reply方法中，調用了工具函數tools裏的template方法，處理消息模板，打開tools.js文件，記得要先引入咱們之間寫好的template.js文件：

var template = require('./template');

　　而後聲明建立template方法：

//暴露消息模板工具
exports.template = function(content, message){
    //聲明info對象臨時存儲回覆的內容
    var info = {}
    //設置默認類型爲text
    var type = 'text';
    //設置獲取的基本信息
    var fromUserName = message.FromUserName;
    var toUserName = message.ToUserName;
    //若是content是一個數組 那麼content即爲圖文消息
    if(Array.isArray(content)){
        type = 'news';
    };
    //或者經過content的type進行覆蓋 或者使用默認類型
    type = content.type || type;
    //把content賦給info
    info.content = content;
    //獲取時間戳
    info.createTime = new Date().getTime();
    //將type值給msgType
    info.msgType = type;
    //回覆回去的用戶
    info.toUserName = fromUserName;
    info.fromUserName = toUserName;
    //返回
    return template.compiled(info);
};

　　如今，消息響應模塊這部分的代碼，咱們已經修改完了。

四完成消息自動回覆的功能

　　這部分，咱們將完成消息自動回覆的功能，爲了儘量的重用代碼，咱們把配置相關的代碼單獨拿出來，放在config.js文件中，在model下新建配置文件config.js，將入口啓動文件app.js裏的配置信息拿出來放到config.js裏：

'use strict';
//引入第三方模塊
var path = require('path');
var util = require('../libs/util');
//引入文本文件
var wechat_file = path.join(__dirname, '../accesstokendata/wechat.txt');
// 聲明對象字面量config 用於存儲配置信息、讀取寫入票據的方法
var config = {
    wechat: {
        appID: 'wx044125d0a173dd15',
        appSecret: '21295f049b49fe324d7302186c294fe7',
        token: 'beijingjiangweiwechatlearntokenvalueabcdefg',
        getAccessToken:function(){
            return util.readFileAsync(wechat_file);
        },
        saveAccessToken:function(data){
            data = JSON.stringify(data);
            return util.writeFileAsync(wechat_file, data);
        }
    }
};
//將config暴露出去
module.exports = config;

　　而後，修改入口啓動文件app.js：

'use strict';
// 引入模塊
var Koa = require('koa');
var path = require('path');
//引入中間件
var generator = require('./model/generator');
var util = require('./libs/util');
//引入配置文件config
var config = require('./model/config');
//引入回覆文件
var weixin = require('./model/weixin');
//引入文本文件
var wechat_file = path.join(__dirname, './accesstokendata/wechat.txt');
// 實例化Koa的web服務器
var app = new Koa();
//傳入配置參數和回覆內容
app.use(generator(config.wechat, weixin.reply));
//監聽3100端口
app.listen(3100);
console.log('listening:3100');

　　在啓動文件裏，咱們將config.js文件引入了，而且，新引入了weixin這個文件（在這個文件中，咱們能夠存放回復、支付等方法，這裏只添加了回覆的方法），並在app.use裏添加了weixin.reply方法，新建文件weixin.js文件，寫入以下內容：

'use strict';
//向外暴露reply接口 這裏使用了生成器函數
exports.reply = function*(next) {
    var message = this.weixin;
    //判斷用戶行爲 是普通消息仍是事件推送
    if (message.MsgType === 'event') {
        //訂閱事件 分爲搜索訂閱和二維碼訂閱
        if (message.Event === 'subscribe') {
            if (message.EventKey) {
                console.log('掃描二維碼進來' + message.EventKey + ' ' + message.ticket);
            }
            //經過this.body設置回覆消息
            this.body = '歡迎訂閱個人公衆號';
        }
        //取消訂閱事件
        else if (message.Event === 'unsubscribe') {
            console.log('用戶取消了關注');
            this.body = '';
        }
    } else {

    }
    yield next;
};

　　在weixin.js文件中，咱們添加了針對訂閱/取消訂閱進行消息回覆的業務邏輯。

　　咱們來測試一下關注和取消關注的時候，邏輯是否能跑通，仍是在終端項目目錄下，使用node app命令啓動服務，而後另開一個終端窗口，啓動魔法隧道內網映射，在微信公衆號開發文檔裏登陸咱們的測試號，取消關注時，控制檯會出現提示信息：

　　從新關注後，微信公衆號會有提示信息『歡迎訂閱個人公衆號』，以下圖所示：

　　這個過程，也許不會這麼順利，你們能夠根據控制檯的報錯信息，耐心仔細調整代碼，沒有其餘捷徑可走......

　　下面咱們來添加一些其餘的事件處理邏輯，仍是在weixin.js文件中：

'use strict';
//向外暴露reply接口 這裏使用了生成器函數
exports.reply = function*(next) {
    var message = this.weixin;
    //判斷用戶行爲 是事件推送仍是普通消息 先判斷的是事件推送
    if (message.MsgType === 'event') {
        //訂閱事件 分爲搜索訂閱和二維碼訂閱
        if (message.Event === 'subscribe') {
            if (message.EventKey) {
                console.log('掃描二維碼進來' + message.EventKey + ' ' + message.ticket);
            }
            //經過this.body設置回覆消息
            this.body = '歡迎訂閱個人公衆號';
        }
        //取消訂閱事件
        else if (message.Event === 'unsubscribe') {
            console.log('用戶取消了關注');
            this.body = '';
        }
        //地理位置事件
        else if (message.Event === 'LOCATION') {
            this.body = '您上報的位置是：' + message.Latitude + '/' + message.Longitude + '-' + message.Precision;
        }
        //點擊事件 自定義菜單事件
        else if (message.Event === 'CLICK') {
            this.body = '您點擊了菜單：' + message.EventKey;
        }
        //跳轉連接事件 點擊菜單跳轉連接時的事件推送
        else if (message.Event === 'VIEW') {
            this.body = '您點擊了菜單中的連接：' + message.EventKey;
        }
        //掃描事件
        else if (message.Event === 'SCAN') {
            console.log('關注後掃描二維碼' + message.EventKey + ' ' + message.Ticket);
            this.body = '看到你掃一下哦';
        }
    }
    //普通消息 文本消息
    else if (message.MsgType === 'text') {
        var content = message.Content;
        //除了回覆策略裏的內容就回復這句
        var reply = '額，你說的' + message.Content + '太複雜了，我理解不了';
        //回覆策略--文本
        if (content === '1') {
            reply = '我是回覆策略中的第一條';
        } else if (content === '2') {
            reply = '我是回覆策略中的第二條';
        } else if (content === '3') {
            reply = '我是回覆策略中的第三條';
        }
        //回覆策略--圖文
        else if(content === '4'){
            reply = [{
                title:'放開她，讓我來！',
                description:'放開她，讓我來！',
                picUrl:'http://ww2.sinaimg.cn/large/bd698b0fjw1eev97qkg05j20dw092dg3.jpg'
            },{
                title:'腿毛與秋褲',
                description:'腿毛與秋褲',
                picUrl:'http://upload.qqbody.com/allimg/1611/1203245I7-8.jpg'
            }]
        }
        //將回復reply交給body
        this.body = reply;
    }
    yield next;
};