微信小程序 集成腾讯云IM做的聊天室

初次接触集成的东西确实有点费劲,最终通过两天的摸爬滚打把腾讯云的IM集成到了我的微信小程序中了。

让大家看一下效果:

我的毕设项目中只是用了腾讯IM的单人一对一聊天,当然这个IM是支持群的,语音视频,几乎支持QQ,微信的所有功能。

腾讯云IM是免费的,但是你如果要商用,当然也是收费的(可以使用的功能更多哦),而且不仅是小程序很多端都可以使用。

 

不多说,开搞。

(有人会说你不会是拖吧。首先陈述一下,我只是一个使用者,感觉还不错就分享出来,大家需要做聊天室的可以试试)

第一步:打开cmd 把路径切到项目根目录(进入项目文件夹把路径拷出来,直接cd 路径)

再项目根路径下 执行npm init 和vue项目的哪个package.json初始化类似。

(如果你得项目名称是汉语的 执行下面那一步时 就需要再手动起一个名字,如果不是汉语的 就一路回车)

扫描二维码关注公众号,回复: 10744454 查看本文章

 初始化之后,能做小程序根目录看到一个package.json 的文件,就证明初始化成功。

第二步:在根目录下接着执行(如果有cnpm的可以用 会下载的快一下)

  • // IM 小程序 SDK

  • npm install tim-wx-sdk --save

  • // 发送图片、文件等消息需要的 COS SDK

  • npm install cos-wx-sdk-v5 --save

 到这里控制台可以关了。

第三步:去小程序中把使用npm模块给勾了,然后并在左上角工具栏中,点击构建npm,成功了会提示构建成功。

 第四步:拷代码。项目测试代码放在了github上,需要的可以去下载。

测试项目地址:https://github.com/xinggaung1996/-IM

第五步:修改代码,运行测试项目。

首先运行项目你会进入这个导航页面

点击进入聊天室会执行下面这个函数。

你会发现此处的userSig我是请求后端生成的,这个地方,在腾讯云控制台也能手动生成(自动生成会放在最后)。

地址:https://console.cloud.tencent.com/im-detail

如果没有账号的同学可以注册一个。

这里可以手动生成。

当你在云上添加IM应用的时候,他会给你生成一个上图中的SDKAppID 与密钥。这两个参数是关联到你的IM应用上以及生成userSig的必须品。

 假设你的腾讯云IM搞好了,那就可以进入聊天室了。

此处的sdkAppID是我的,如果需要生成userSig 是需要自己的sdkAppID与密钥的。

 这两个填好之后就差最后一步了,现在从导航到进入测试用的是test2给test1发信息。那在你发送信息之前

第一步:需要先把俩用户导入到IM里,见上图的插入用户。

第二步:只有两个用户是好友的情况下才能发送信息,见上图的添加好友,当然如果检验是否插入成功,可以用查询id哦。

目前为止,基本上你就可以完成1V1聊天的操作了。

附上一些需要的IM官方链接,需要什么直接在里面搜索就可以了。

文档的地址:https://cloud.tencent.com/document/product/269/

 对于自动生成userSig这个问题找了很长时间,我用的后端生成userSig。

地址:https://cloud.tencent.com/document/product/269/32688

可以前端生成,可以后端生成。人家给了源码地址,找到相应的readme.md

就ok了 是不是很简单,当然如果这个做出来了想集成聊天室也都是ok的,因为上面的插入用户,可以指定聊天室id的,还需要在平台上以及代码上进行一些配置。

如果使用博主的方法解决了问题,麻烦在评论区扣个1(方便其他人使用),

如果没有解决您的问题麻烦扣个2,并提出自己的问题。

发布了21 篇原创文章 · 获赞 24 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/qq_36940740/article/details/105471556