初次接觸集成的東西確實有點費勁,最終通過兩天的摸爬滾打把騰訊雲的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的,還需要在平臺上以及代碼上進行一些配置。