[Message Notification] How about using the official account template message?

1. 前言

大家好,我是小鑫同学^[1].一位从事过Android开发、混合开发,Now engaged in前端开发的编程爱好者,I think the most important thing on the road of programming is the sharing of knowledge,所谓三人行必有我师.So I started to keep outputting what I learned in the community、学习到、Various programming knowledge encountered at work,欢迎有想法、Like-minded partners add mefe-xiaoxin^[2]微信交流~

I think friends who have been shopping in the Nuggets for a while have seen articles about automatic sign-in, etc.,Of course it's not about automatic sign-in.,Mainly talk about after you sign in sign in the result of how to notify us.In some articles I saw that someone would useServer酱^[3]（A push service that integrates multiple messaging channels）,And their WeChat docking enterprise directly、钉钉群机器人的,For friends who do not use Qiwei or DingTalk, you need to install the corresponding software to achieve this.Of course, there are also some special recipients of message notifications.开源项目^[4],感兴趣的可以了解一下~

Our WeChat attention now do not know how many public number,Therefore, we will pay more attention to a public account.（测试）来接收通知（Better than installing one moreApp好些吧,Dingding and Qiwei get off work, you would like to hear its voice？）,所以我们在【全干】Get WeChat from scratchSDK授权^[5]On the basis of continuing to use the template message provided by the official account to achieve the goal of pushing the results after check-in~

2. Pull the source code and start

1. Pull the provided by the previous article 源代码^[6];
2. 配置natappcorresponding to the tunnelauthtoken;
3. 配置 测试公众号信息到 app\service\WeChat.ts;
4. 双击natapp启动穿透,执行 yarn dev启动后端服务;

3. New message test template

The template content of the test official account is more free,Perfect for developers to use~

1. 模板标题：没有过多限制,We can type like：Automated check-in notifications;
2. 模板内容：Said in front of the content is relatively free,But the placeholder variable of the content has requirements,For example we need to put the source of the platformformas a variable to be passed into the template content,we need to write {{form.DATA}},注意{{变量.DATA}}为固定写法.
3. The following is the content of the template we used this time,你可以直接使用：

平台：{{from.DATA}}
时间：{{date.DATA}}
结果：{{result.DATA}}

4. Template message interface docking

在测试公众号页面的体验接口权限表中找到模板消息（业务通知）;

4.1Understand the use of interfaces

1. 获取 template_id：This parameter displays the corresponding template in the message template list after creating a new test templateID;
2. 接口地址： https://api.weixin.qq.com/cgi-bin/message/template/send?access_token=ACCESS_TOKEN;
3. 请求方式： POST;
4. 参数格式：指通过data传递的参数,需要是json格式,我们需要设置headers信息 { 'content-type': 'application/json' };
5. 查询参数：access_token,At the beginning of the previous article, we obtained,Here we will directly use the written method;
6. 请求参数：Introduce through the form：

参数	类型/二级参数	说明
touser	string	user sent toID,在微信中openidis the unique identifier of the user,After testing the official account platform, we scan the code and follow the test account, and we will get
template_id	string	模板ID,Earlier we also mentioned the location of the acquisition
url	string	这个urlCan fill in the personal home page of our community,like my nuggets：https://juejin.cn/user/3966693685871694
topcolor	string	Color doesn't matter,哈哈~
data	object	data类型为对象,to wrap variables set in the template content,注意Second-level parameters are still objects
-	from: { value: string, color: string}	Which platform the notification came from,As we this platform for the notification from the nuggets
-	date: { value: string, color: string}	the time the notification was sent
-	result: { value: string, color: string}	Result of notification sending

4.2 编写Controller,配置路由

1. 通过body接收客户端（定时任务）Source of platform and sign in the result;
2. by passing information toService提供 sendSignTemplateto initiate a message notification;

public async jueJinSignNotice() {
  const { ctx } = this;
  const { from, result } = ctx.request.body;
  ctx.body = await ctx.service.weChat.sendSignTemplate(from, result);
}

3. 配置路由信息,Note that the interface type isPOST;

router.post('/juejin-sign-notice', controller.home.jueJinSignNotice);

4.3 在Service编写sendTemplate和sendSignTemplate两个函数

sendSignTemplateResponsible for the variables needed to assemble the template content,The data content is called by the clientController来提供,NodeJsPlease pass the time in thetoLocaleString获得本地时间,默认new Date()在NodeJs环境有8小时时差,Pay special attention when making time comparisons~

public async sendSignTemplate(from: string, result: string) {
    return await this.sendTemplate({
      from: {
        value: from,
        color: '#173177',
      },
      date: {
        value: new Date().toLocaleString(),
        color: '#173177',
      },
      result: {
        value: result,
        color: '#173177',
      },
    });
  }

sendTemplateResponsible for the assembled modules sent to the specified user,More templates we can reuse this function~

  public async sendTemplate(_data: any) {
    const { ctx } = this;
    const request = async () => {
      const { access_token } = await this.getToken();
      const { data } = await ctx.curl(
        `${URL_TEMPLATE}?access_token=${access_token}`,
        {
          dataType: 'json',
          method: 'POST',
          headers: {
            'content-type': 'application/json',
          },
          data: {
            touser: '',
            template_id: '',
            url: 'https://juejin.cn/user/3966693685871694',
            topcolor: '#FF0000',
            data: _data,
          },
        },
      );
      console.log('[ data ] >', data);
      return data;
    };
    return await request();
  }

5. Verify that our interface is available

Essential software for my computeruTools,for not strongly dependentpostmanWork is a simple little buddy widgets

1. alt+space call outuToolsAnd type in the input boxhttp（图一）：

image.png

2. 按回车后进入http插件界面（图二）:

image.png

3. After modifying the request method and entering the request address and parameters, click the small plane to initiate the request（图三）:

image.png

4. Tell us on WeChatOK,Indicates that this time the message notification was sent successfully,Did you see the message in the notification bar of your phone?？

5. 总结

Completed the function of testing the public account template message push by using the authorization code written last time,In the subsequent meet their timing task do notice when can direct call,compared to email notification,企微通知,In terms of Dingding notifications, etc., if we hadn’t savedAppinstallation or avoid public-private mashups,Because the code is now local,So it is necessary to take time again函数计算FC（阿里云） ,改天见~

This article has been pushed toGitHub,Welcome to clone the demonstration：git clone https://github.com/OSpoon/wechat4node.git

---

If you feel that you have gained,欢迎点赞、评论、分享支持一下.你的支持和肯定,It's what keeps me writing~

Follow me at [email protected]小鑫同学.欢迎点此扫码加我微信^[7]fe-xiaoxin^[8]交流,共同进步（还可以帮你fix）~

参考资料

[1]

小鑫同学: https://juejin.cn/user/3966693685871694

[2]

fe-xiaoxin: https://juejin.cn/pin/7126196941574111262

[3]

Server酱: https://sct.ftqq.com/

[4]

开源项目: https://github.com/easychen/pushdeer

[5]

【全干】Get WeChat from scratchSDK授权: https://juejin.cn/post/7124455454603739166

[6]

源代码: https://github.com/OSpoon/wechat4node

[7]

点此扫码加我微信: https://juejin.cn/pin/7126196941574111262

[8]

fe-xiaoxin: https://juejin.cn/pin/7126196941574111262