我们直接使用npm下载
// IM Web SDK
// 从v2.11.0起,SDK 支持了 WebSocket,推荐接入
npm install tim-js-sdk-ws --save
// v2.10.2及以下版本,使用 HTTP
// npm install tim-js-sdk --save
// 发送图片、文件等消息需要腾讯云即时通信 IM 上传插件
npm install tim-upload-plugin --save
在入口文件main.js中将im的两个实例对象进行应用
import TIM from 'tim-js-sdk';//这个就是im的实例
import COS from "cos-js-sdk-v5"//这个择情况而定使用
//let 出一个参数
let options= {
SDKAppID: 这里填入你们在控制台申请的sdkappid,
}
创建一个实例对象
Vue.prototype.T=TIM.create(options)
Vue.prototype.TIM=TIM
Vue.prototype.COS=COS
//写到这咱们的配置项算是基本完成,接下来就是sdk的调用,和监听事件的使用
登录之前我们需要获取到用户的usersig这个一般由后端去im进行获取
let userinfo={
userID:''
userSig:''
}
localStorage.setItem('userinfo',userinfo)//存到本地缓存中,等需要的时候我们进行提取
登录im
//登录时我们提取用户信息
localStorage.getitem('userinfo')
//此处我们调用im实例中封装好的方法
this.T.login(userinfo).then(res=>{
console.log(res)
})
//此时我们登录成功了,但是如果在web页面用户刷新以后会更改登录状态,我使用的方法是重新登录一边,不知道大家有什么好方法,谢谢指教。
//此时登录成功会调用im的监听事件,我们将监听事件放进methods的方法中,在进入页面中调用
this.T.on(TIM.EVENT.SDK_READY, function(event) {
console.log('登录成功了')
// 收到离线消息和会话列表同步完毕通知,接入侧可以调用 sendMessage 等需要鉴权的接口
// event.name - TIM.EVENT.SDK_READY
}
//登录成功就会被打印
//实时更新也是调用监听事件同上