小程序webscoket 实现

小程序原生webscoket使用

最近项目直播用到webscoket 然后来记录一下使用和简单的封装

//写在 js里面引用
var webscoket = {},socketTask;

//连接 webscoket 
webscoket.connectSocket = (data) => {
	
	//开始连接
	socketTask = wx.connectSocket({
		url: data.url,
		header: {
			'content-type': 'application/json'
		},
		success(res) {
			//连接成功返回状态
			data.success(res);
		}
	});

	socketTask.onOpen(function(res) {
		console.log(res)
	})
	
	//接受消息返回
	socketTask.onMessage(function(res) {
		data.callback(res)
	})
	socketTask.onError(function(res) {
		console.log(res)
	})
	//监听断开 然后进行重连重连，
	socketTask.onClose(function(res) {		
		//可以写个定时器，防止疯狂刷新
		webscoket.connectSocket(data);
	})
	
};

//发送消息
webscoket.sendSocketMessage=(msg,cllback)=>{
	socketTask.send({
			data: msg,
			success(res) {
				cllback(res);
			},
			fail(res) {
				wx.showToast({
					title: res.errMsg,
					icon: 'none',
					duration: 2000
				})
			}
		})
}

//关闭连接
webscoket.close=(cllback)=>{
	socketTask.close({
			success(res) {
				cllback(res)
			}
		})
}



module.exports = webscoket;

//小程序onshow里面开始连接
var webscoket = require('../../js/webscoket.js');
Page({
	onShow: function() {
		let that = this;
		webscoket.connectSocket({
			url:`url`,
			success(res){
				//成功状态
				console.log(res)
			},
			callback(res){
				//消息回调到统一的函数里面进行解析
				that.obtain(res);
			}
		});
	},
	//获取即时通信的数据
	obtain(data) {
		//解析
	},
	//获取数据发送到连接
	send(data) {		
		webscoket.sendSocketMessage(data,(res)=>{
			console.log(res)
		});
	},

	/**
	 * 生命周期函数--监听页面隐藏
	 */
	 
	onHide: function() {
		//关闭页面时断开即时通信
		webscoket.close((res)=>{
			console.log(res)
		});
	},

	/**
	 * 生命周期函数--监听页面卸载
	 */
	onUnload: function() {
		//卸载页面时断开即时通信
		webscoket.close((res)=>{
			console.log(res)
		});

	},
})