微信小程序 集成騰訊雲IM做的聊天室

初次接觸集成的東西確實有點費勁,最終通過兩天的摸爬滾打把騰訊雲的IM集成到了我的微信小程序中了。

讓大家看一下效果:

我的畢設項目中只是用了騰訊IM的單人一對一聊天,當然這個IM是支持羣的,語音視頻,幾乎支持QQ,微信的所有功能。

騰訊雲IM是免費的,但是你如果要商用,當然也是收費的(可以使用的功能更多哦),而且不僅是小程序很多端都可以使用。

 

不多說,開搞。

(有人會說你不會是拖吧。首先陳述一下,我只是一個使用者,感覺還不錯就分享出來,大家需要做聊天室的可以試試)

第一步:打開cmd 把路徑切到項目根目錄(進入項目文件夾把路徑拷出來,直接cd 路徑)

再項目根路徑下 執行npm init 和vue項目的哪個package.json初始化類似。

(如果你得項目名稱是漢語的 執行下面那一步時 就需要再手動起一個名字,如果不是漢語的 就一路回車)

 初始化之後,能做小程序根目錄看到一個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,並提出自己的問題。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章