微信小程序 网络API Websocket详解


Posted in Javascript onNovember 09, 2016

微信小程序 网络API:

wx.connectSocket(OBJECT)

​ 创建一个 WebSocket 连接;一个微信小程序同时只能有一个WebSocket连接,如果当前已存在一个WebSocket连接,会自动关闭该连接,并重新创建一个WebSocket连接。

OBJECT参数说明:

参数 类型 必填 说明
url String 开发者服务器接口地址,必须是HTTPS协议,且域名必须是后台配置的合法域名
data Object 请求的数据
header Object HTTP Header
method String 默认是GET,有效值为: OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

示例代码:

wx.connectSocket({
 url:"test.php",
 data:{
 x:"",
 y:""
 },
 header:{ 
 'content-type': 'application/json'
 },
 method:"GET"
})

wx.onSocketOpen(CALLBACK)

​ 监听WebSocket连接打开事件

示例代码:

wx.connectSocket({
 url:"test.php"
});
wx.onSocketOpen(function(res){
 console.log("WebSocket连接已打开!")
})

wx.onSocketError(CALLBACK)

​ 监听WebSocket错误

示例代码:

wx.connectSocket({
 url:"test.php"
});
wx.onSocketOpen(function(res){
 console.log("WebSocket连接已打开!")
})
wx.onSocketError(function(res){
 console.log("WebSocket连接打开失败,请检查!")
})

wx.sendSocketMessage(OBJECT)

​ 通过WebSocket连接发送数据,需要先wx.connectSocket,并在wx.onSocketOpen回调之后才能发送。
OBJECT参数说明:

参数 类型 必填 说明
data String 需要发送的内容

示例代码:

var socketOpen = false;
var socketMsgQueue = []
wx.connectSocket({
 url:"test.php"
});

wx.onSocketOpen(function(res){
 socketOpen = true;
 for(var i = 0 ; i < socketMsgQueue.length; i++){
  sendSocketMessage(socketMsgQueue[i])
 }
 socketMsgQueue = [];
})

function sendSocketMessage(msg){
 if(socketOpen){
 wx.sendSocketMessage({
  data:msg
 });
 }else{
  socketMsgQueue.push(msg)
 }
}

wx.onSocketMessage(CALLBACK)

​ 监听WebSocket接受到服务器的消息事件

CALLBACK返回参数:

参数 类型 说明
data String 服务器返回的消息

示例代码:

wx.connectSocket({
 url:"test.php"
});

wx.onSocketMessage(function(res){
 console.log("收到服务器内容:" + res.data)
})

wx.closeSocket()

​ 关闭WebSocket连接

wx.onSocketClose(CALLBACK)

​ 监听WebSocket关闭

wx.connectSocket({
 url:"test.php"
});

//注意这里有时序问题,
//如果wx.connectSocket还没回调wx.onSocketOpen,而先调用wx.closeSocket,那么就做不到关闭WebSocket的目的
//必须在WebSocket打开期间调用wx.closeSocket才能关闭
wx.onSocketOpen(function(){
 wx.closeSocket()
})

wx.onSocketClose(function(res){
 console.log("WebSocket 已关闭!")
})

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
查找iframe里元素的方法可传参
Sep 11 Javascript
js获取url参数代码实例分享(JS操作URL)
Dec 13 Javascript
JavaScript常用基础知识强化学习
Dec 09 Javascript
JavaScript中rem布局在react中的应用
Dec 09 Javascript
Jquery AJAX POST与GET之间的区别详细介绍
Oct 17 Javascript
js实现砖头在页面拖拉效果
Nov 20 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
May 10 Javascript
详解vue项目优化之按需加载组件-使用webpack require.ensure
Jun 13 Javascript
JavaScript字符串检索字符的方法
Jun 23 Javascript
详解Puppeteer前端自动化测试实践
Feb 21 Javascript
vue两组件间值传递 $router.push实现方法
May 15 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
Apr 28 Javascript
微信小程序 网络API 上传、下载详解
Nov 09 #Javascript
微信小程序 网络API发起请求详解
Nov 09 #Javascript
etmvc+jQuery EasyUI+combobox多值操作实现角色授权实例
Nov 09 #Javascript
jQuery模拟实现的select点击选择效果【附demo源码下载】
Nov 09 #Javascript
微信小程序 loading 详解及实例代码
Nov 09 #Javascript
微信小程序 toast 详解及实例代码
Nov 09 #Javascript
jQuery模拟完美实现经典FLASH导航动画效果【附demo源码下载】
Nov 09 #Javascript
You might like
php GD绘制24小时柱状图
2008/06/28 PHP
[原创]效率较高的php下读取文本文件的代码
2008/07/02 PHP
解析php中curl_multi的应用
2013/07/17 PHP
php读取csc文件并输出
2015/05/21 PHP
Prototype使用指南之string.js
2007/01/10 Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
2009/07/18 Javascript
JQuery扩展插件Validate—4设置错误提示的样式
2011/09/05 Javascript
javascript中方便增删改cookie的一个类
2012/10/11 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
2016/09/05 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
2017/03/02 Javascript
微信小程序实现的贪吃蛇游戏【附源码下载】
2018/01/03 Javascript
实例解析ES6 Proxy使用场景介绍
2018/01/08 Javascript
Angular HMR(热模块替换)功能实现方法
2018/04/04 Javascript
详解Vue 如何监听Array的变化
2019/06/06 Javascript
详解vue-video-player使用心得(兼容m3u8)
2019/08/23 Javascript
JS实现网站吸顶条
2020/01/08 Javascript
python使用Flask框架获取用户IP地址的方法
2015/03/21 Python
用Python的Django框架完成视频处理任务的教程
2015/04/02 Python
windows下Virtualenvwrapper安装教程
2017/12/13 Python
python监控文件并且发送告警邮件
2018/06/21 Python
Python切片操作去除字符串首尾的空格
2019/04/22 Python
利用 Flask 动态展示 Pyecharts 图表数据方法小结
2019/09/04 Python
Pytorch实现的手写数字mnist识别功能完整示例
2019/12/13 Python
python爬虫把url链接编码成gbk2312格式过程解析
2020/06/08 Python
selenium+python自动化78-autoit参数化与批量上传功能的实现
2021/03/04 Python
HTML5 Canvas绘制圆点虚线实例
2015/01/01 HTML / CSS
西班牙英格列斯百货官网:El Corte Inglés
2016/09/25 全球购物
美国高档百货Nordstrom的折扣店:Nordstrom Rack
2017/11/13 全球购物
优质有机椰子产品:Dr. Goerg
2019/09/24 全球购物
迎接领导欢迎词
2014/01/11 职场文书
结婚周年感言
2014/02/24 职场文书
幼儿教师演讲稿
2014/05/06 职场文书
个人综合鉴定材料
2014/05/23 职场文书
母亲去世追悼词
2015/06/23 职场文书
python 制作一个gui界面的翻译工具
2021/05/14 Python
python 使用tkinter与messagebox写界面和弹窗
2022/03/20 Python