微信小程序 网络API Websocket详解

微信小程序 网络API：

微信小程序 网络API发起请求

微信小程序 网络API 上传、下载

微信小程序 网络API Websocket

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 已关闭！")
})

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

赞 (0)

相关推荐

  • 微信小程序 WebSocket详解及应用

    微信小程序 WebSocket详解及应用

    微信小程序 WebSocket 实例效果: 今天主要说一下微信的WebSocket接口以及在小程序中的使用. WebSocket是什么(简述) 微信的WebSocket接口和HTML5的WebSocket基本一样,是HTTP协议升级来的,做为一个新的Socket在B/S上使用,它实现了浏览器与服务器全双工通信. 因为这里是做小程序,所以就不对WebSocket的底层和协议做过多的说明了,只是稍微介绍一下.想了解详细的WebSocket可以参考如下:WebSocket 协议 WebSocket与A

  • 微信小程序 SocketIO 实例讲解

    微信小程序 ScoketIO 简单实例: 现在好的人在搞微信小程序,ScoketIO 是微信的网络通信,它的重要性不言而喻,这里给大家讲讲如何使用以及注意事项! 微信小程序 的SocketIO 实现,基于CFETram 的实现基础上完善 const emitter = require('./emitter.js'); /** socket.io 协议常量 */ var packets = { open: 0 // non-ws , close: 1 // non-ws , ping: 2 , p

  • 微信小程序 websocket 实现SpringMVC+Spring+Mybatis

    微信小程序 websocket 实现SpringMVC+Spring+Mybatis

    微信小程序实现websocket步骤: 后台: 1. 添加maven依赖 2. 创建握手 3. 创建处理器 4. spring配置(xml配置或javabean方式配置任选一种) 微信小程序: 1. 书写连接 java后台 1.添加maven依赖 <!-- websocket --> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-websocket&l

  • android Socket实现简单聊天小程序

    android Socket实现简单聊天小程序,供大家参考,具体内容如下 服务器端: package org.hwq.echo; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.io.PrintWriter; import java.net.ServerSocket; import java.net.Socket; public cla

  • 微信小程序使用Socket的实例

    微信小程序使用Socket的实例 首先,一个小程序同时只能有一个WebSocket连接,如果当前已经存在一个WebSocket连接,会关闭当前连接,并重新建立一个连接. 其次,如果使用了appID,协议必须是 wss://... 最近团队用小程序做行情,在连接socket的时候,发现在还没有进行subscribe的情况下,就直接进行了广播,并且自动关闭了socket连接, 时间紧迫,抓耳挠腮,遂引用了socket-io(基于小程序的websocket仿写的socket-io,并非官方的socke

  • 微信小程序 网络API Websocket详解

    微信小程序 网络API: 微信小程序 网络API发起请求 微信小程序 网络API 上传.下载 微信小程序 网络API Websocket wx.connectSocket(OBJECT) ​ 创建一个 WebSocket 连接:一个微信小程序同时只能有一个WebSocket连接,如果当前已存在一个WebSocket连接,会自动关闭该连接,并重新创建一个WebSocket连接. OBJECT参数说明: 参数 类型 必填 说明 url String 是 开发者服务器接口地址,必须是HTTPS协议,且

  • 微信小程序 location API接口详解及实例代码

    微信小程序 location API接口详解及实例代码

    微信小程序 location API 接口: 现在微信小程序火了 ,利用假期时间学习了下,微信小程序的基础知识,嘿嘿! 以下是记录学习微信小程序 location API接口,并且写了一个小实例来记录,如有错误之处还请指正. 微信小程序的位置接口共有两个: 1.wx.getLocation(OBJECT)获取当前的地理位置.速度. 2.wx.openLocation(OBJECT) 使用微信内置地图查看位置 然后,根据object参数说明,结合module模块化重写了下两个接口在暴露出来引用,让

  • 微信小程序 location API实例详解

    微信小程序 location API实例详解

    location API也就分这里分两种wx.getLocation(object)获取当前位置和wx.openLocation(object)通过经纬度打开内置地图.其中定位获取位置信息返回参数是有问题的speed,accuracy这两个是没有的.还有一个就是打开内置地图之后再返回会报一个错误(Page route错误-WAService.js:2 navigateBack 一个不存在的webviewId0)如果有知道的可告知,我找到解决方式也会补充下! 主要属性: wx.getLocatio

  • 微信小程序 navigation API实例详解

    微信小程序 navigation API实例详解

    演示效果也看到了小程序也就提供这几个处理导航控制.值得注意的是只能同时导航五个页面 主要属性: 导航条一些方法 wx.setNavigationBarTitle(object) 设置导航条的Title 导航标题可以通过三种方式设置,第一种是通过全局配置名字统一,第二种就是在page中新建个json文件配置它会覆盖全局配置的title,第三种就是通过API设置. wx.showNavigationBarLoading()设置在导航条上显示Loading加载状态 wx.hideNavigationB

  • 微信小程序 Image API实例详解

    微信小程序 Image API实例详解

    选择图片时可设置图片是否是原图,图片来源.这用的也挺常见的,比如个人中心中设置头像,可以与wx.upLoadFile()API使用 主要方法: wx.chooseImage(object) wxml <!--监听按钮--> <button type="primary" bindtap="listenerButtonChooseImage">点击我选择相册</button> <!--通过数据绑定的方式动态获取js数据-->

  • 微信小程序 Storage API实例详解

    微信小程序 Storage API实例详解

    其实这个存储在新建Demo的时候就已经用到了就是存储就是那个logs日志,数据存储主要分为同步和异步 异步存储方法: 存数据 wx.setStorage(object) 相同key会覆盖,可写回调方法 获取方法: wx.getStorage(object) 清除方法: wx.clearStorage()里面可以写回调函数 成功,失败,完成 同步存储方法: 存数据 相同key会覆盖 wx.setStorageSync(key,data) 读数据 wx.getStorageSync(key) 存储是

  • 微信小程序 Video API实例详解

    微信小程序 Video API实例详解

    电脑端不能测试拍摄功能只能测试选择视频功能,好像只支持mp4格式,值得注意的是成功之后返回的临时文件路径是个列表tempFilePaths而不是tempFilePath文档写的有点问题. 主要属性: wx.chooseVideo(object) 成功之后返回参数 wxml <button type="primary" bindtap="listenerBtnOpenVideo">打开视频</button> <!--默认视频组件是隐藏的-

  • 微信小程序 网络API 上传、下载详解

    微信小程序 网络API: 微信小程序 网络API发起请求 微信小程序 网络API 上传.下载 微信小程序 网络API Websocket wx.uploadFile(OBJECT) 将本地资源上传到开发者服务器.如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口将本地资源上传到指定服务器.客户端发起一个HTTPS POST请求,其中 Content-Type 为 multipart/form-data . OBJECT参数说明: 参数 类型 必填 说

  • 微信小程序 网络API发起请求详解

    微信小程序 网络API: 微信小程序 网络API发起请求 微信小程序 网络API 上传.下载 微信小程序 网络API Websocket 微信小程序 wx.request(OBJECT) ​ wx.request发起的是https请求.一个微信小程序,同时只能有5个网络请求连接. OBJECT参数说明: 参数名 类型 必填 说明 url String 是 开发者服务器接口地址 data Object.String 否 请求的参数 header Object 否 设置请求的header , hea

  • 微信小程序实现分页查询详解

    微信小程序实现分页查询详解

    目录 创建自定义连接器 云开发介绍 分页实现思路 使用连接器 为什么要自定义分页功能 日常小程序经常需要分页查询的功能,本篇我们讲解一下低代码中如何实现分页查询的功能.要自己开发分页功能,可以先参考官方的方法 分页查询我们一般是需要有入参和出参,入参分别需要页码.每页大小.排序字段名称.排序方式.查询条件. 出参分别需要记录总条数.页码.每页大小.记录列表. 入参和出参知道之后,那在哪写代码呢?像分页这种功能一般属于后端的能力,低码工具中是在自定义连接器里写后端代码的. 创建自定义连接器 登录低

随机推荐