express 实战微信公众号开发一(环境搭建)

说在前头

本文首发于个人订阅号 前端糖果屋 或个人技术网站 程序员导航网

express是什么

express，基于 Node.js 平台，快速、开放、极简的 Web 开发框架

工欲善其事，必先利其器

• 首先得申请一个微信个人订阅号，当然有能力认证到企业的更好，有更丰富的 API 可以使用。这个在微信公众平台申请就可以。这里给出申请地址：个人订阅号申请地址
• 要用 express，nodejs，npm 包管理器当然必不可少啦。在这里可以下载:
  nodejs 下载地址，根据个人操作系统下载对应安装包，然后傻瓜式安装即可。
  注 1：最好选择 v8.9.0 以上的版本下载，可以免去日后一些版本不兼容的问题。
  注 2：windows 下载.msi 安装包，macOs 下载.pkg 安装包，安装的时候会有 add path 选项，环境变量会自动配置进系统，安装完之后不用再手动配置系统环境变量，这是安装包较二进制文件（压缩包）比较方便的地方。
  安装完成后，点击桌面 开始 ，输入 cmd，打开命令提示符，输入 node -v，回车,输入 npm -v，回车，出现版本号说明安装成功。
  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-2nOgY9XI-1582868443013)(https://shop.io.mi-img.com/ap...]

用 express 脚手架生成工程

• 全局安装

  npm i express-generator -g

• 生成目录名为 wechat-express 的工程

  express -e wechat-express

• 进入工程根目录

  cd wechat-express

• 安装依赖(使用淘宝源安装会快很多，相信我)

  npm install --registry=https://registry.npm.taobao.org

• 运行

  npm start

• 打开浏览器查看

配置 nodemon，让 nodejs 开发更便利。

官网是这样介绍的：

Nodemon is a utility that will monitor for any changes in your source and automatically restart your server. Perfect for development

译： Nodemon 是一个实用程序，它将监视源代码中的任何更改并自动重新启动服务器。适合在开发环境中使用它。

咱们都知道 nodejs 开发，修改了源代码之后需要重新运行才能看到最新的运行结果。那 nodemon 的出现呢，就是监听源代码中的==任何更改==，并自动重启服务器。

安装 nodemon

npm install nodemon //yarn add nodemon

使用 nodemon

• 首先在工程根目录下创建nodemon.json文件，写入以下内容

  {
    "restartable": "rs",
    "ignore": [".git", ".svn", "node_modules/**/node_modules"],
    "verbose": true,
    "execMap": {
      "js": "node --harmony"
    },
    "watch": [],
    "env": {
      "NODE_ENV": "development"
    },
    "ext": "js json"
  }

• 再打开package.json 文件，给 script 属性中添加一行，保存。

  "scripts": {
    "start": "nodemon app.js",
    "nodemon": "nodemon app.js" //多加这一行
  },

• 运行

  npm run nodemon

• 运行之后是这个样子的，可以发现随意改变下文件，保存，工程就会自动重启

创建微信 Token 验证路由

• 根目录下打开终端，安装jssha这个加解密的库

npm install jssha

• 然后在工程的 routes 文件夹下创建一个 wechat.js 文件，写入以下内容

注意：wechat.js文件中有个自定义Token，这个Token必须为英文或数字，长度为3-32字符。

const express = require("express");
const router = express.Router();
const jsSHA = require("jssha");
/**
 * 授权验证
 */
router.get("/", function(req, res, next) {
  const token =
    "这里是你的自定义Tken，与公众平台的Token相对应，不然会验证不成功";
  //1.获取微信服务器Get请求的参数 signature、timestamp、nonce、echostr
  let signature = req.query.signature, //微信加密签名
    timestamp = req.query.timestamp, //时间戳
    nonce = req.query.nonce, //随机数
    echostr = req.query.echostr; //随机字符串

  //2.将token、timestamp、nonce三个参数进行字典序排序
  let array = [token, timestamp, nonce];
  array.sort();

  //3.将三个参数字符串拼接成一个字符串进行sha1加密
  let tempStr = array.join("");
  let shaObj = new jsSHA("SHA-1", "TEXT");
  shaObj.update(tempStr);
  let scyptoString = shaObj.getHash("HEX");

  //4.开发者获得加密后的字符串可与signature对比，标识该请求来源于微信
  if (signature === scyptoString) {
    console.log("验证成功");
    res.send(echostr);
  } else {
    console.log("验证失败");
    res.send("验证失败");
  }
});
module.exports = router;

• 打开根目录下app.js文件，引入该路由并注册

const wechatRouter = require("./routes/wechat");

app.use("/wechat", wechatRouter);

本地验证路由地址毫无疑问就是 http://localhost:3000/wehat
完后将整个工程打包放到线上环境，这里推荐使用宝塔面板结合pm2进程管理工具部署express工程，真的会简化好多操作！！！
假定我们部署后映射的线上域名是 https://www.iiter.cn
ok 我们接下来打开微信公众平台配置。

微信公众平台配置

点击左侧菜单栏 开发 -> 基本配置 右侧开启服务器配置

然后填写服务器配置

URL： 为线上的 验证Token的路由地址，对应的当然就是 https://www.iiter.cn/wechat
Token： 这里的Token就是刚刚上一步自定义的Token，复制过来粘贴即可。
EncodingAESKey： 点击随机生成即可。
消息加解密方式：选择明文模式
确认无误的话，点击提交。
验证成功则会弹出验证成功的消息。
打开公众号，随意输入文字发送，公众号会回复给你相同的文字。

下一篇我们讲讲如何处理用户消息，实现自定义回复功能。

扫码关注公众号查看效果。