继续创造,加快成长!这是我参加「日新方案 10 月更文挑战」的7天,点击检查活动概况

我这儿运用微信小程序来测验webscoket的链接。这儿还是有挺多坑的。

一:wss与ws的区别

如果是一般的web网站运用标题的这两种协议哪一个都是能够的,可是微信小程序必须运用wss链接,如下图所示:

workman(五)打通微信小程序webscoket通信

Wss和ws的区别其实就是https与http的区别,前者是后者的加密版别。

因为wss有加密证书,所以在运用的时分,链接不能写的太随意,不然或许找不到证书。

比方:ws的链接你能够这样写

ws://api.xxxxx.net:8102/webscoket

可是wss只能这样写

wss://api.xxxxx.net/webscoket

像ws那样域名拼端口号写的话,找不到ssl证书,会报错。

至于再详细的wss与ws的区别,这儿就不翻开说了,有兴趣,请自行百度~

二:微信小程序webscoket通讯

微信小程序对webscoket的支持封装了一堆的函数,我这儿也是照着官方文档写的。

请移步《微信小程序官方文档》

下边大约放一下我测验运用的代码,我将webscoket封装成了一个函数,在小程序生命周期函数中直接调用的:

//pages/livechat/livechat.js
constapp=getApp();
constutils=require('../../utils/util');
Page({
/**
*生命周期函数--监听页面显现
*/
onShow:function(){
varself=this;
self.onWorker();
},

//创建WebSocket衔接
onWorker:function(){
//初始化
wx.connectSocket({
url:'wss://xxxx.xxxx/xxxx,//你的域名
success(res){
console.log('success',res)
},
fail(res){
console.log('fail',res)
}
})
//衔接成功
wx.onSocketOpen(function(res){
wx.sendSocketMessage({
//data:JSON.stringify({type:'message',data:'这是一条测验消息'}),
data:'这是一条测验消息'
})
})
//接收数据
wx.onSocketMessage(function(data){
console.log(data);
//varobjData=JSON.parse(data.data);//留意这儿有时会报错
//console.log(objData);
})
//衔接失利
wx.onSocketError(function(){
console.log('websocket衔接失利!');
})
//断开衔接
wx.onSocketClose(function(res){
console.log('WebSocket已关闭!')
})
},
})

最终效果如下图所示:

workman(五)打通微信小程序webscoket通信

至此,webscoket通讯就已经打通了,当然,这只是测验,具体的事务逻辑,还需要再想想。

有好的建议,请在下方输入你的评论。

欢迎拜访个人博客guanchao.site

欢迎拜访我的小程序:翻开微信->发现->小程序->查找“时间里的”