WeChat微信 Bot 開發 - 接口配置信息

前言

最近在測試 WeChat 的 Bot 時，一開始連到的網址都無法登入。
舊的網址為 http://admin.wechat.com/debug/sandbox (2018-09-13 就失效了哦)，
要註冊的請到新的網站為 https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login

如果有裝 WeChat 的話，按下「登录」會出現條碼，掃下去就可以了。
當登入之後，就可以註冊測試帳號。

當我設定「接口配置信息」中的 URL 及 Token 之後，按下「提交」，總是出現「配置失敗」的訊息。

解決

在測試期間，我是使用 ngrok 來讓 local 可以讓外面連到。
而且，我們還可以看到外面 Call 進來的內容(Web Interface)，如下，

所以可以看到，在「接口配置信息」區段中按下「提交」，會發一個 GET 請求，裡面有 echostr, nonce, signature 及 timestamp 參數值。
要讓它成功的話，需要檢查驗證後，回傳 echostr 的內容回去。

在 node 可以加入 wechat 套件

npm install wechat

然後透過它(checkSignature)去檢查，如果沒問題，又有 echostr 參數，就回傳 echostr 的內容回去。
設定 express router 的 middleware 程式碼類似如下，

import * as WeChat from 'wechat';

protected static checkSignature(req, res, next) {
    try {
        const isSignatured = WeChat.checkSignature(
        req.query,
        'yourtokenhere'
        );
        if (isSignatured) {
            if (req.query.echostr) {
                res.send(req.query.echostr);
            } else {
                next();
            }
        } else {
            res.send(401, 'checkSignature fail');
        }
    } catch (e) {
        console.log(e);
    }
}

寫好程式後，再重新執行「接口配置信息」，就可以正常配置了哦!

參考資源

WeChat Official Account Platform
微信公共平台 Node 库
node.js 实现微信公众号
Build your WeChat chatbot
Guide for Message API