邻近的小程序功用晋级_微信小程序实时谈天Web

微信小程序实时聊天WebSocket       这篇文章主要为大家详细介绍了微信小程序实时聊天WebSocket的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了微信小程序实时聊天WebSocket的具体代码,供大家参考,具体内容如下

1.所有监听事件先在onload监听。

// pages/index/to_news/to_news.js 
var app = getApp();
var socketOpen = false;
var SocketTask = false;
var url = 'ws://192.168.0.120:7011';
Page({
 data: {
 inputValue: '',
 returnValue: '',
 onLoad: function (options) {
 onReady: function () {
 // 创建Socket
 SocketTask = wx.connectSocket({
 url: url,
 data: 'data',
 header: {
 'content-type': 'application/json'
 method: 'post',
 success: function (res) {
 console.log('WebSocket连接创建', res)
 fail: function (err) {
 wx.showToast({
 title: '网络异常!',
 console.log(err)
 if (SocketTask) {
 SocketTask.onOpen(res = {
 console.log('监听 WebSocket 连接打开事件。', res)
 SocketTask.onClose(onClose = {
 console.log('监听 WebSocket 连接关闭事件。', onClose)
 SocketTask.onError(onError = {
 console.log('监听 WebSocket 错误。错误信息', onError)
 SocketTask.onMessage(onMessage = {
 console.log('监听WebSocket接受到服务器的消息事件。服务器返回的消息', onMessage)
 // 提交文字
 submitTo: function (e) {
 let that = this;
 that.data.allContentList.push({that.data.inputValue });
 that.setData({
 allContentList: that.data.allContentList
 var data = {
 text: that.data.inputValue
 if (socketOpen) {
 // 如果打开了socket就发送数据给服务器
 sendSocketMessage(data)
 bindKeyInput: function (e) {
 this.setData({
 inputValue: e.detail.value
 onHide: function () {
 SocketTask.close(function (close) {
 console.log('关闭 WebSocket 连接。', close)
//通过 WebSocket 连接发送数据,需要先 wx.connectSocket,并在 wx.onSocketOpen 回调之后才能发送。
function sendSocketMessage(data) {
 console.log('通过 WebSocket 连接发送数据')
 if (socketOpen) {
 SocketTask.send({data: JSON.stringify(data)
 }, function (res) {
 console.log('已发送', res)
 } else {
 socketMsgQueue.push(msg)
} 

html

 input type="text" bindinput="bindKeyInput" value='{{inputValue}}' placeholder="" / 
 button bindtap="submitTo" 发送 /button 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。