前言
在前端开发中，我们经常需要和微信公众号或小程序进行交互。为了方便前端开发者快速搭建微信公众号或小程序，Google 开发了 mdc-weixin 这个 npm 包。
mdc-weixin 提供了常用的微信公众号或小程序接口，包括身份认证、消息处理、素材管理、菜单管理等等，能够大大减少前端开发者写微信相关功能的工作量。
本文将介绍如何使用 mdc-weixin 进行微信公众号或小程序开发。
安装
安装 mdc-weixin 可以使用 npm 命令：
npm install mdc-weixin --save
配置
在使用 mdc-weixin 前，需要先在微信公众号或小程序后台配置一些信息，包括：
- AppID 和 AppSecret，用于访问微信接口和触发微信事件。
- Token，用于接收微信服务器的认证请求。
- EncodingAESKey，用于对微信消息内容进行加密解密。
具体配置方法可以参考微信公众号或小程序的官方文档。
在前端项目中，可以在配置文件中存储这些信息。
const config = {
appid: 'your appid',
secret: 'your secret',
token: 'your token',
encodingAESKey: 'your encodingaeskey'
}接入微信服务器
在微信公众号或小程序后台配置完成后，需要将服务器地址与微信服务器进行接入验证。
使用 mdc-weixin 可以很方便地接入微信服务器。
-- -------------------- ---- -------
----- ------- - ------------------
----- ------ - ---------------------
----- ------ - -------------------
----- --- - ---------
-- -----------
------------------ ----- ---- -- -
----- - ---------- ---------- ------ ------- - - ---------
-- --------------------------------- ---------- ------ -------------- -
-----------------
- ---- -
----------------- -----------
-
--
-- ------
------------------- ----- ---- -- -
-------------------------- -------
--------- -- -
-- ------
----- ------- - -------------------------
--------------------
--
---------- -- -
------------------
--
--
---------------- -- -- -
------------------- --------- -- ---- ------
--以上代码实现了微信服务器认证和消息处理的基本功能。当微信用户向公众号或小程序发送消息时，将触发 /wechat 路由的 POST 请求，调用 weixin.parseBody() 方法将微信消息解析成 XML 数据，然后使用 weixin.formatMessage() 方法将 XML 数据格式化成可读的 JavaScript 对象，方便后续的处理。
应用场景
以下是 mdc-weixin 可以应用到的一些场景。
发送文本消息
weixin.sendTextMessage(fromUser, toUser, content).then(res => {
console.log(res)
}).catch(err => {
console.error(err)
})发送图文消息
-- -------------------- ---- ------- -------------------------------- ------- -- ------ -------- ------------ -------------- ------- ----------------------------- ---- -------------------- ------------ -- - ---------------- ------------ -- - ------------------ --
创建自定义菜单
-- -------------------- ---- ------- -------------------- ----- -------- ----- -------- ---- ------- -- - ----- ------- ----- ------- ---- -------------------- --- ---------------- -- - ---------------- ------------ -- - ------------------ --
获取用户信息
weixin.getUserInfo(openid, config).then(res => {
console.log(res)
}).catch(err => {
console.error(err)
})总结
mdc-weixin 这个 npm 包提供了一系列常用的微信公众号或小程序接口，方便前端开发者快速搭建微信相关功能。需要注意的是，在使用前需要在微信公众号或小程序后台进行相关配置，并存储在配置文件中。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055a3581e8991b448d7d73