当前位置: 首页 > news >正文

node开发微信群聊机器人第⑤章

PART 序

看本文时,请确保前4章都已经看过,不然本章你看着看着思维容易跳脱!再一个机器人教程只在公众号:“程序员野区”首发。csdn会跟着发一份,未经博主同意,请勿转载!欢迎分享到自己的微信群或分享给自己的好友。

 一个35岁老前端,要个点赞、再看不过分吧

  1. 重构下咱的代码架构。方便后续业务逻辑扩展。

  2. 请求免费第三方案例(放后面章讲讲,不然感觉修改代码架构这章内容太多了,一天写不完)

  3. node对接科大讯飞-火星ai的教程=>>node的服务端对接科大讯飞-火星ai解决方案_雪狼之夜的博客-CSDN博客,感兴趣的小伙伴可以自行前往查阅。(为了教程的连续性,怕有小伙伴对接ai的时候卡壳,所以感兴趣的小伙伴自行前往原文链接阅读,当成扩展来学吧,)

PART 正文

我可能回讲的非常细!因为我发现在公众号私信的小伙伴里也有其他语言(比如python和java/php)的小伙伴在看本教程!为了照顾其他语言的小伙伴读懂本教程,我尽量不漏掉细节,还有很多咱前端以为很基础的代码,所以望小伙伴理解。(我尽量写的很细,所以贴代码的时候我会附上示例图)

一、整体代码调整(方便你后续扩展功能)

    工欲善其事,必先利其器” 咱总不能一会加一个function,这就像牛皮癣一样,选还是先优化下js的结构吧,所以这里,博主开头先优化成趋近大家熟悉的vue3选项式api结构。

    其实简单的改造成:单独的data、初始化生命周期、方法,来,你新建一个index.js(最好是把原来的index.js改成index2.js。),我们重新整下结构,也方便你们后续扩展。

index.js 基本框架如下(博主怕上来就用Ts,非前端从业小伙伴直接劝退了,所以有好点还是先用js写把。)

const page={  data:{  },  mounted(){      },  methods:{      }}page.mounted();

嗯,前端的小伙伴不陌生吧,来,我们接下去这个基础上开始写代码。

import { FileBox }  from 'file-box'import QRcode from "qrcode"; //二维码import axios from "axios"import {WechatyBuilder} from 'wechaty'

先把依赖放进来,位置如下,放page头上

图片

来,这个变量是用来给你机器人过滤要监听和发送消息的微信群聊,我们放data里

qunArr:[      "北京web前后端、ui交流群",      "厦门web前端、后端、ui交流群",      "深圳web前端、后端、ui交流群",      "武汉web前端、后端、ui交流群",      "上海web前端、后端、ui交流群",    ],

然后我们调用,就用

console.log(this.data.qunArr)

来,代码位置如下图

图片

跟着博主思路来,接下去博主说的  放data里就是放data:{}里,放方法里就是放methods。

我们还需要抽出来几个公共的参数,wechaty 要放data里。因为你后续很多方法会用到

wechaty:null,

然后要初始化wechaty  ,所以我们在methods里放上初始化wechaty的函数,然后在初始化的mounted()里调用他

this.methods.wechatyInit();
wechatyInit(){      page.data.wechaty=WechatyBuilder.build()      page.data.wechaty.on('scan', (qrcode, status) => {        QRcode.toFile('./1.jpg', qrcode, err => {          console.log("生成完成")        })      })      .on('login', user => console.log('登录成功:' + user))      .on('message', async msg => {        console.log(msg.text())        // page.methods.message(msg)      })      .start()    },

图片

这样我们就完成了初始化wechaty的登录啊、发消息啊、初始化啊

到这里我们运行下,看看会不会打印出来msg的内容,注意,如果你新起了个目录然后建的文件记得先运行  cnpm install      

图片

上图是博主的目录结构

这个时候你在群里发信息,就会打印出来下面这个,这第一步我们就成功了

图片

非前端的小伙伴,到这停下,理解下博主这个写法架构,完了再往下看,不然你会一头雾水。不明白可以分享给懂前端的小伙伴帮你理。

你得明白this.methods.wechatyInit(); 为啥要加个this.methods,为什么不直接this.wechatyInit() 因为这样的写法后面会很普遍,涉及到this的指向问题

继续!我们要把msg返回信息的处理封装出来一个function,把下面的代码放wechatyInit方法后面

message(msg){      let text = msg.text()//获取聊天内容      let room= msg.room()//获取房间信息      if (room && text.length > 0) {              }    }

图片

用下面代码替换掉console.log(msg.text())

page.methods.message(msg)

图片

这样一来,我们后续就能在message(msg)这个方法里做自己的逻辑处理了,这里一个细节,page.methods.message(meg),前端小伙伴别直接就是this.message(msg),咱跟vue还是有区别的,后续调用方法,记得都是page.methods.代替了this.别混乱了

好,我们开始对message(msg)也就是用发来的信息做分类,比如,我们给我们的机器人弄一个触发条件,如下

const topic = await room.topic()//房间名if (page.data.qunArr.indexOf(topic)!=-1 &&text.indexOf("@倾城雪姬")!=-1) {    console.log(11111)}

图片

逻辑我们理一下,room && text.length > 0 前面章节已经讲过了

page.data.qunArr.indexOf(topic)!=-1 是,qunArr包含topic(当前发消息的房间名)

图片

text.indexOf("@倾城雪姬")!=-1 是内容触发条件,也就是当有人发送“@倾城雪姬”的时候,这里的@倾城雪姬 是你设置的触发你自己机器人回复信息的关键字,也就是你自己的机器人昵称(你个人微信小号的昵称)。

这样,触发逻辑就完成了,你收到了群聊消息开始检测,如果群聊消息来至你的房间,并且消息包含关键字“@倾城雪姬”的时候,你才对此处对话进行处理,也就是触发后续动作。

因为是异步,所以你记得message前面要加 async 

图片

记得保存代码!!!在运行

图片

图片

你会发现你打1的时候没打印,发“@倾城雪姬 你好”的时候就有反应了。好,下一步。我们要根据用户不同问题,进行不同的回复。也就是为后面请求不同的接口做准备。

第一步,我们得先对触发的关键字进行替换

console.log(text)text=text.replace(/\s*/g,'').replace(/@倾城雪姬/g,'');console.log(text)

图片

运行,你会发现,replace处理过之后我们就得到了用户准确的回答

图片

别嫌弃讲的慢,博主也是为了方便非前端的小伙伴好理解。

来,接下去分开回复数据了

新建一个集中处理用户的方法

//用户事件处理const userEvent={  init(msg){    let arr=["aa","bb"]//索引从0开始 0 1 ,o(╥﹏╥)o博主已经保姆级教程了    let arrIndex=-1    arr.some((v,i)=>{       let isTrue=msg.indexOf(v)!=-1      if(isTrue){        arrIndex=i      }      return isTrue    })    if(arrIndex!=-1){//命中关键字      userEvent["a_"+arrIndex]()    }else{      console.log("未命中关键字")    }  },  a_0(){    console.log("执行了a_0方法")  },  a_1(){    console.log("执行了a_1方法")  },}

然后放下面这个调用到我们的message(msg)里

userEvent.init(text)

图片

保存代码后重新调试。效果如下

图片

好的,到这里,框架就差不多了,下章,博主将会列出来几个对接第三方的demo集成进咱的代码里。因为有些小伙伴还是不熟悉正常的对接第三方接口流程。

====》node开发微信群聊机器人第⑥章

PART 公众号合集

#程序员干货 #人间清醒 #前端回忆录  #争议话题  #程序员圈子热点

PART 其他文章

  1. 当你因为颜值被录取

  2. 当事实对你有利,就强调事实

  3. web前端已死?真相了。

  4. 程序员35岁后咋办

  5. 程序员找工作先看啥?老板?项目?

  6. 程序员技术入股躲避坑

http://www.lryc.cn/news/207856.html

相关文章:

  • 如何助力企业出海?未来发展趋势是什么?尽在「云通信」Tech专场
  • 安装虚拟机(VMware)保姆级教程及配置虚拟网络编辑器和安装WindowsServer以及本地访问虚拟机和配置服务器环境
  • 使用Typecho搭建个人博客网站,并内网穿透实现公网访问
  • RabbitMQ (4)
  • 导入Embassy库进行爬虫
  • GoLong的学习之路(十三)语法之标准库 log(日志包)的使用
  • 别处拿来的VUE项目 npm run serve报错
  • Istio 运行错误 failed to update resource with server-side apply for obj 问题解决
  • 分布式事务(Seata)——Seata分布式事务XA模式、AT模式、TCC模式的介绍和对比 结合案例分析AT模式和XA模式【源码】
  • GMT 格式 转 标准日期格式
  • 【蓝桥杯选拔赛真题01】C++参赛建议 青少年组蓝桥杯C++选拔赛真题 STEMA比赛真题解析
  • 小红书为什么流量不好,小红书笔记质量评判标准有哪些?
  • 优化改进 | YOLOv2算法超详细解析(包括诞生背景+论文解析+技术原理等)
  • 作为前端开发,你应该知道的这十几个在线免费工具
  • 【广州华锐互动】关于物理力学的3D实验实操平台
  • LVS负载均衡(LVS简介、三种工作模式、十种调度算法)
  • Vue响应式数据的实现原理(手写副作用函数的存储和执行过程)
  • 内核进程的调度与进程切换
  • docker-rabbitmq 安装依赖
  • (1)(1.9) HC-SR04声纳
  • 06 MIT线性代数-列空间和零空间 Column space Nullspace
  • 【每日一题Day360】LC1465切割后面积最大的蛋糕 | 贪心
  • 中国地名信息库
  • 网络时代下的声音之路:如何在中央新闻媒体发布网评稿
  • Selenium中WebDriver最新Chrome驱动安装教程
  • 云原生Docker数据管理
  • endnote设置
  • 计算机网络整理-简称缩写【期末复习|考研复习】
  • Flink Hive Catalog操作案例
  • NSSCTF做题第9页(3)