微信小程序使用Socket的实例


Posted in Javascript onSeptember 19, 2017

微信小程序使用Socket的实例

首先,一个小程序同时只能有一个WebSocket连接,如果当前已经存在一个WebSocket连接,会关闭当前连接,并重新建立一个连接。

其次,如果使用了appID,协议必须是 wss://...

最近团队用小程序做行情,在连接socket的时候,发现在还没有进行subscribe的情况下,就直接进行了广播,并且自动关闭了socket连接,

时间紧迫,抓耳挠腮,遂引用了socket-io(基于小程序的websocket仿写的socket-io,并非官方的socket-io,传送门),使用方法:

1、先在utils文件夹粘贴一个io的js

2、然后 npm install wxapp-socket-io

3、config文件夹下新建一个socket.js,对socket连接进行封装,如下:

const io = require('../utils/io.js')
let url = 'wss://......'
let wsStatus = false
let onSocket = null
export const connect = function(cb){
  if(!onSocket){
    onSocket = io(url)
    onSocket.on('connect', function (res) {
      cb(true,onSocket)
      wsStatus = true
    })
    setTimeout(function(){
      if(!wsStatus){
        cb(false,onSocket)
      }
    },10000)
  }else{
    cb(true,onSocket)
  }
}

4、在要引用的页面调用,全局封装订阅方法

let openSocket = require('../../config/socket')
let app = getApp()
let socket = null
Page({
data: {
  zl: [[422, 400, 468, 834, 785, 446, 845, 517, 630, 797, 890, 529, 553, 425, 469, 470, 837, 841, 521, 525], [422, 400, 468, 834, 785, 446, 845, 517, 630, 797, 890, 529, 553, 425, 469, 470, 837, 841, 521, 525]]
},
onLoad: function () {
  let that = this;
  //socket调用
  openSocket.connect(function (status, ws) {
    if (status) {
      socket = ws
      this.subscribe('zl')//对封装好对订阅方法进行调用
      socket.on('broadcast', function (msg) {//广播
        console.log("broadcast");
        console.log(msg);
      })
    } else {
      alert("socket 连接失败")
    }
  });
},
subscribe: function (type) {
  if (socket) {
    let eis = this.data[type]
    if (eis && eis.length > 0) {
      let param = {//仅供参考,根据接口自行更改
        eis: eis.join(',')
      }
      socket.emit('subscribe', JSON.stringify(param));
    }
  }
}
});

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
javascript的对话框详解与参数
Mar 08 Javascript
使用prototype.js 的时候应该特别注意的几个问题.
Apr 12 Javascript
ImageZoom 图片放大镜效果(多功能扩展篇)
Apr 14 Javascript
kmock javascript 单元测试代码
Feb 06 Javascript
详解JavaScript中undefined与null的区别
Mar 29 Javascript
ext前台接收action传过来的json数据示例
Jun 17 Javascript
JavaScript中获取纯正的undefined的方法
Mar 06 Javascript
JS中sort函数排序用法实例分析
Jun 16 Javascript
fullpage.js全屏滚动插件使用实例
Sep 06 Javascript
浅析javaScript中的浅拷贝和深拷贝
Feb 15 Javascript
MUI 上拉刷新/下拉加载功能实例代码
Apr 13 Javascript
使用 Javascript 实现浏览器推送提醒功能的示例
Nov 03 Javascript
vue基于Element构建自定义树的示例代码
Sep 19 #Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
Sep 19 #Javascript
详解ES6之async+await 同步/异步方案
Sep 19 #Javascript
jQuery实现倒计时功能 jQuery实现计时器功能
Sep 19 #jQuery
jquery实现倒计时小应用
Sep 19 #jQuery
Angular客户端请求Rest服务跨域问题的解决方法
Sep 19 #Javascript
jQuery实现可兼容IE6的遮罩功能详解
Sep 19 #jQuery
You might like
php 仿Comsenz安装效果代码打包提供下载
2010/05/09 PHP
php读取csv文件并输出的方法
2015/03/14 PHP
WordPress中"无法将上传的文件移动至"错误的解决方法
2015/07/01 PHP
php自动识别文字编码并转换为目标编码的方法
2015/08/08 PHP
如何使用PHP对网站验证码进行破解
2015/09/17 PHP
PHP读MYSQL中文乱码的快速解决方法
2016/10/01 PHP
JavaScript中对象属性的添加和删除示例
2014/05/12 Javascript
JavaScript弹出窗口方法汇总
2014/08/12 Javascript
Javascript实现可旋转的圆圈实例代码
2015/08/04 Javascript
仿百度换肤功能的简单实例代码
2016/07/11 Javascript
vue数据双向绑定原理解析(get & set)
2017/03/08 Javascript
详解vue-router基本使用
2017/04/18 Javascript
基于react框架使用的一些细节要点的思考
2017/05/31 Javascript
JS实现元素上下左右移动效果
2017/10/18 Javascript
webpack 样式加载的实现原理
2018/06/12 Javascript
vue最简单的前后端交互示例详解
2018/10/11 Javascript
python版微信跳一跳游戏辅助
2018/01/11 Python
python kmeans聚类简单介绍和实现代码
2018/02/23 Python
pyhton列表转换为数组的实例
2018/04/04 Python
Python实现针对json中某个关键字段进行排序操作示例
2018/12/25 Python
numpy数组之存取文件的实现示例
2019/05/24 Python
Python使用循环神经网络解决文本分类问题的方法详解
2020/01/16 Python
谈一谈数组拼接tf.concat()和np.concatenate()的区别
2020/02/07 Python
基于django2.2连oracle11g解决版本冲突的问题
2020/07/02 Python
python操作ini类型配置文件的实例教程
2020/10/30 Python
解决Pyinstaller打包软件失败的一个坑
2021/03/04 Python
定义css设备类型-Media Queries图表简介及使用方法
2013/01/21 HTML / CSS
BudgetAir印度:预订航班、酒店和汽车租赁
2019/07/07 全球购物
Java如何调用外部Exe程序
2015/07/04 面试题
电子商务专业毕业生工作推荐信
2013/11/17 职场文书
社区健康教育实施方案
2014/03/18 职场文书
工会优秀工作者事迹
2014/08/17 职场文书
2014城乡环境综合治理工作总结
2014/12/19 职场文书
用Java实现简单计算器功能
2021/07/21 Java/Android
Python NumPy灰度图像的压缩原理讲解
2021/08/04 Python
JavaScript 对象创建的3种方法
2021/11/17 Javascript