微信小程序使用Socket的实例

 更新时间:2017年09月19日 16:40:27   投稿:lqh  
这篇文章主要介绍了微信小程序使用Socket的实例的相关资料,希望通过本文能帮助到大家,需要的朋友可以参考下

微信小程序使用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));
    }
  }
}
});

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

相关文章

  • js实现简单掷骰子效果

    js实现简单掷骰子效果

    这篇文章主要为大家详细介绍了js实现简单掷骰子效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-10-10
  • JS数组去重常用方法实例小结【4种方法】

    JS数组去重常用方法实例小结【4种方法】

    这篇文章主要介绍了JS数组去重常用方法,结合实例形式总结分析了4种常用的数据去重实现方法,涉及javascript数组的遍历、判断、追加等相关操作技巧,需要的朋友可以参考下
    2018-05-05
  • JavaScript 计算误差的解决

    JavaScript 计算误差的解决

    本文主要介绍了JavaScript 计算误差的解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-02-02
  • JavaScript 高仿真可控弹簧振子实现代码

    JavaScript 高仿真可控弹簧振子实现代码

    我刚学JavaScript ,看见一些牛人写了许多特效,我也花了一天写了一个弹簧振子,完全独创,没有借鉴任何人的代码.
    2009-10-10
  • JS实现手风琴特效

    JS实现手风琴特效

    这篇文章主要为大家详细介绍了JS实现手风琴特效,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • JavaScript中三个等号和两个等号的区别(== 和 ===)浅析

    JavaScript中三个等号和两个等号的区别(== 和 ===)浅析

    javascript中比较运算符'=='与'==='可能大家用的比较多,但是大家对他的区别不是很清楚,接下来小编给大家介绍下js中三个等号和两个等号的区别(== 和 ===),感兴趣的朋友可以参考下
    2016-09-09
  • js实现可折叠展开的手风琴菜单效果

    js实现可折叠展开的手风琴菜单效果

    这篇文章主要介绍了js实现可折叠展开的手风琴菜单效果,通过简单的样式变换控制菜单项的展开与折叠功能,非常简单实用,需要的朋友可以参考下
    2015-09-09
  • Javascript别踩白块儿(钢琴块儿)小游戏实现代码

    Javascript别踩白块儿(钢琴块儿)小游戏实现代码

    游戏唯一的一个规则,我们只需要不断踩着黑色方块前进即可,这里根据方向键来踩白块,在规定的时间内,每走一次分数加100.下面通过本文给大家分享Javascript别踩白块儿(钢琴块儿)小游戏实现代码,一起看看吧
    2017-07-07
  • JS 页面计时器示例代码

    JS 页面计时器示例代码

    计时器效果想必大家都见到过吧,其实使用js可以很轻松的实现,下面有个不错的示例,感兴趣的朋友可以参考下
    2013-10-10
  • JavaScript中window.open用法实例详解

    JavaScript中window.open用法实例详解

    这篇文章主要介绍了JavaScript中window.open用法,实例分析了window.open方法的功能、参数及使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-04-04

最新评论