微信小程序使用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));
}
}
}
});
微信小程序使用Socket的更多相关文章
- 微信小程序常见问题集合(长期更新)
最新更新: 新手跳坑系列:推荐阅读:<二十四>request:fail错误(含https解决方案)(真机预览问题 跳坑指南<七十>如何让微信小程序服务类目审核通过 跳坑六十九: ...
- 两百条微信小程序跳坑指南(不定时更新)
微信小程序联盟出品 跳坑textarea<二百二十三>不显示文本及textarea相关问题集合跳坑<二百一十三> background-image无法获取本地资源图片....跳 ...
- 微信小程序开发——websocket测试
服务端 在windows下执行 node server.js 也可参照我的前一篇部署https var httpServ = require('http') var WebSocketServer ...
- 前端笔记之微信小程序(四)WebSocket&Socket.io&摇一摇案例&地图|地理位置
一.WebSocket概述 http://www.ruanyifeng.com/blog/2017/05/websocket.html Workerman一款开源高性能异步PHP socket即时通讯 ...
- 微信小程序开发调试工具
为了帮助开发者简单和高效地开发微信小程序,我们推出了全新的 开发者工具 ,集成了开发调试.代码编辑及程序发布等功能. 扫码登录 启动工具时,开发者需要使用已在后台绑定成功的微信号扫描二维码登录,后续所 ...
- 微信小程序之后台https域名绑定以及免费的https证书申请
微信小程序在11月3号发布了,这是一个全新的生态,没有赶上微信公众号红利的开发者,运营者可别错过这趟车了. 但是微信的后台需要全https,之前我还不相信,后台注册了后进后台才发现,服务器配置如下图 ...
- 最近火到不行的微信小程序的常识
满网都是微信小程序,技术dog们不关注都不行了.先别忙着去学怎么开发小程序,先纠正一下你对微信小程序的三观吧~~~~ 小程序目前被炒得沸沸扬扬,无数媒体和企业借机获取阅读流量. 这再次证明一点,微信想 ...
- 微信小程序:开发之前要知道的三件事
前言 微信之父张小龙在年初的那次演讲中曾表示:"我自己是很多年的程序员,我觉得我们应该为开发的团队做一些事情".几个月后,微信正式推出微信应用号(即微信小程序),在互联网中掀起了又 ...
- 如何开发一个微信小程序
一.概述 特点:对商家来说,小程序的开发成本低(有丰富的组件.api等).运营成本低(有数据日志等).稳定.互动流畅,便于分享.传播(基本微信平台的大量用户).对用户来说,扫码即可获取服务,随 ...
随机推荐
- 《史上最简单的MySQL教程》系列分享专栏
<史上最简单的MySQL教程>系列分享专栏 <史上最简单的MySQL教程>已整理成PDF文档,点击可直接下载至本地查阅https://www.webfalse.com/read ...
- mybatis报表,动态列与查询参数+行列转换
这是报表原型,在这张报表中,使用了动态的列与动态查询参数,动态列与动态查询参数全部使用map将参数传入 map参数: //拼接查询时间 for (String month : monthList) { ...
- Educational Codeforces Round 47 (Rated for Div. 2) :B. Minimum Ternary String
题目链接:http://codeforces.com/contest/1009/problem/B 解题心得: 题意就是给你一个只包含012三个字符的字符串,位置并且逻辑相邻的字符可以相互交换位置,就 ...
- ABAP CDS ON HANA-(1)CDSビュー作成
Basic CDS View Creation Open HANA Studio. Goto ABAP perspective. Open the project, Navigate to the p ...
- 关于PHP性能提升踩过的一些坑
性能这个东西,在网站规模到达一定程度后,会是一个永恒的主题.关于这方面,本人有一些拙见,现在拿出来,大家一起探讨下. 1.编码过程中,传递参数时,尽量少使用‘引用传参’.这是一个巨坑啊 ...
- $.ajax()各方法详解(转)
jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...
- 在WPF中自定义控件(3) CustomControl (上)
原文:在WPF中自定义控件(3) CustomControl (上) 在WPF中自定义控件(3) CustomControl (上) 周银辉 ...
- EAS_Table
SHR人力 员工表 T_BD_PERSON fbirthday 出生日期 femployeetypeid 员工状态 员工状态 T_HR_BDEMPLOYEETYPE T ...
- stm32--FatFs调试过程(SPIFlash)
移植方法参见我的另一篇博客:<stm32--FatFs移植(SPIFlash)>. 本文仅记录在初次移植完成后,遇到的问题,和解决的过程. 调试记录: 问题1:f_open返回3,即磁盘没 ...
- HMM相关文章索引
HMM相关文章索引 1条回复 HMM系列文章是52nlp上访问量较高的一批文章,这里做个索引,方便大家参考. HMM学习 HMM学习最佳范例一:介绍 HMM学习最佳范例二:生成模式 HMM学习最佳范例 ...