TypeScript2024第一周拓展实战训练——QQ聊天机器人

百万前端向前冲
3,335 阅读5分钟

啊！2024才学TypeScript还有价值吗？!学的话，就用最新的上。

目标

  • 学习使用Node.js第三方oicq模块
  • 学习掌握QQ聊天机器人的个性化开发
  • 学会查看oicq模块的TypeScript源代码，梳理核心代码组织结构和作用

1、效果演示

839150a804c34ad68826f1b349a3aaeb~tplv-k3u1fbpfcp-jj-mark 3024 0 0 0 q75.webp

2、文件规范

在VScode中创建文件夹目录结构：

  1. 创建 大文件夹TS2024《TypeScript》课程整个学期的
  2. 创建子文件夹w1表示第一周 形成如下文件夹结构:
  3. 创建文件w1\1扫码.js,复制以下代码，VScode中结构如下:

图片.png

//1扫码.js  复制以下代码
const { createClient } = require("oicq")
const QQ号 = '2919386060'  //填写你的QQ号码

const client = createClient(QQ号)

client.on("system.online", () => console.log("登录成功!"))
client.on("message", e => {
  console.log(e)
  console.log('\n')
  e.reply("你好，世界", true) //true表示引用对方的消息
})

client.on("system.login.qrcode", function (e) {
  //扫码后按回车登录
  process.stdin.once("data", () => {
    this.login()
  })
}).login()

实验一、使用安装好oicq模块，尝试执行QQ扫码登录😉

c97aaf44004a8e21d985e5d89dfa8aca.png

我们将模拟一个虚拟手表设备，在VScode或win命令行运行以下命令：

步骤1 运行pnpm -v查看版本号

只要能显示pnpm 版本号,确定模块安装工具 pnpm无问题 图片.png


步骤2 通过pnpm config set配置新的pnpm代码仓库

因为我们通过Node.js下载代码模块，通过淘宝源作中转，近期 淘宝源地址到期，切换新的npm代码仓库源https://registry.npmmirror.com(新)
registry.npm.taobao.org (已到期，废弃)，实际执行以下代码
图片.png 通过pnpm config list 查看 registry 值 改变

pnpm config set registry https://registry.npmmirror.com

pnpm config list

步骤3 通过pnpm install oicq命令安装模块

install- 安装 。此处可以简写为 pnpm i oicq。以下两种语法都可:

pnpm install oicq  //工具 安装 模块名

pnpm i oicq  //以上install简写 i

图片.png


步骤4 运行 node 1扫码.js 执行代码

使用手机QQ扫码，代码会创建一个虚拟 手表设备，由于安全中心的限制，仅作体验。 图片.png

特别说明

图片.png

  • 测试前IP变化，会被安全中心风控。如在固定位置长期登录，更容易一次成功。
  • 由于QQ的接口策略可能会随时间变化，需要定期关注官方动态及第三方库的更新情况。
  • 对此我们使用更稳定的 密码+人工滑块验证 登录方式。

实验二、使用安装好oicq模块，执行QQ滑块验证登录🤪

步骤1 新建代码文件2滑块.js

//滑块验证登录
const { createClient } = require("oicq")

let QQ号 = '2919386060' //填入你的QQ号
let 密码 = '2024webA.'   //填入你的密码

const client = createClient(QQ号)

client.on("system.login.slider", function (e) {
  
  console.log("复制ticket输入：\n")
  process.stdin.once("data", ticket => this.submitSlider(String(ticket).trim()))
}).login(密码)

步骤2 运行 node 2滑块.js 执行代码

node 2滑块

图片.png


步骤3 进行人工验证获得ticket值

获取程序显示URL到浏览器，如上图红框 https://ssl.captcha.qq.com/template... 完整地址
注：该地址为[官方]腾讯多端通用滑块验证码页面，当你使用手机QQ修改密码后验证也是这个页面。

图片.png

需要人工辅助验证！！！别急点确定，提前打开浏览器控制台
需要人工辅助验证！！！别急点确定，提前打开浏览器控制台
需要人工辅助验证！！！别急点确定，提前打开浏览器控制台

3.1 [GIF演示]按F12在浏览器控制台获取属性ticket的值, 操作如下动图演示:

获取ticket.gif

3.2 在60秒内将复制ticket的值粘贴在程序下方 按回车。

正常情况下会如下图所示获得好友列表，并且自动捕捉私聊和群消息。
ba92c5d4997644b5bf6aeff36e4ac949~tplv-k3u1fbpfcp-jj-mark 3024 0 0 0 q75.webp

大多数情况下手机QQ会收到安全中心拦截，因为新设备和IP地址的变化，我们需要打个虚拟设备补丁代码。 device.js


步骤4 修复 oicq模块 设备缺陷

将最新的device.js 覆盖到\TS2024\w1\node_modules\oicq\lib\core目录下

f0a3814949ce4fc59b043de4eae9e9db~tplv-k3u1fbpfcp-jj-mark 3024 0 0 0 q75.webp


步骤5 运行 pnpm i模块 加载识别device.js 文件

图片.png


步骤6 两次[步骤2 node 2滑块→步骤3]，重复多次。

可能出现以下三种情形：

✅ 情形结果1. 登录成功，可以获得好友列表。
图片.png

❌ 情形结果2. 出现新的提示手机验证提示，复制URL地址到网址
图片.png 复制图中安全验证https://accounts.qq.com/safe/qrcode... 开头完整链接到 浏览器，
使用手机扫码 授权设备。

图片.png 手机验证后再次执行[步骤2 node 2滑块→步骤3]，✅登录率50%！ 图片.png

❌情形结果3 确定已经覆盖加载了device.js设备文件。仍然提示种问题，主要是由于QQ安全中心保护拦截，可选以下三种解决办法:

  1. 在当前IP地址注册新QQ号，重新尝试。
    2.下次在当前教室等待安全中心72小时后放行IP。
    3.回到寝室长期固定场所，重新执行[步骤2 node 2滑块→步骤3]

课后拓展

待更新。 # oicq.API文档

错误收集&反馈💢

加演示图片QQ好友，发送错误截图或视频描述错误：

例如问题1. pnpm 无权限加载脚本
61D44C008AA05CC30D84E890D79BC9C1.png 错误原因：上学期没有认真完成工具pnpm的配置安装。
解决办法：在电脑中 使用管理员身份运行 Windows PowerShell 图片.png

执行以下命令，回复Y回车即可

 set-ExecutionPolicy RemoteSigned

图片.png

avatar
文章
阅读
粉丝