微信小程序实现Tcp长连接以及断线重连

微信小程序使用TCP通信 最终目的:在微信小程序内实现对局域网发起TCP通信实现步骤:建立TCP服务 + 小程序发起通信。 阅读详情

  针对微信小程序中Tcp的连接,断开,重连以及心跳机制,以下代码做了简单的实现,有需求的可参考。

接收消息时候我做了事件处理,以便每个页面可正常处理消息。

App({
  globalData: {
    isConnected: false,
    socketTask: null,
    serverHostname: 'example.com',
    serverPort: 80,
    heartbeatInterval: 5000, // 心跳包间隔时间,单位为毫秒
    heartbeatTimer: null
  },

  onShow: function () {
    if (!this.globalData.isConnected) {
      this.connectToServer();
    }
  },

  connectToServer: function () {
    let that = this;

    this.globalData.socketTask = wx.createTCPSocket();

    this.globalData.socketTask.onConnect(() => {
      console.log('连接成功');
      that.globalData.isConnected = true;

      // 开始心跳包定时发送
      that.startHeartbeat();
    });

    this.globalData.socketTask.onError((res) => {
      console.log('连接出错', res);
      that.globalData.isConnected = false;
      that.stopHeartbeat(); // 停止发送心跳包
    });

    this.globalData.socketTask.onClose(() => {
      console.log('连接关闭');
      that.globalData.isConnected = false;
      that.stopHeartbeat(); // 停止发送心跳包
    });

    // 连接服务器
    this.globalData.socketTask.connect({
      hostname: this.globalData.serverHostname,
      port: this.globalData.serverPort,
      success: function () {
        console.log('连接成功');
      },
      fail: function (res) {
        console.log('连接失败', res);
        that.globalData.isConnected = false;
        that.stopHeartbeat(); // 停止发送心跳包
      }
    });
  },

  startHeartbeat: function () {
    let that = this;

    this.globalData.heartbeatTimer = setInterval(() => {
      if (that.globalData.isConnected) {
        // 发送心跳包数据
        that.sendHeartbeatData();
      }
    }, this.globalData.heartbeatInterval);
  },

  sendHeartbeatData: function () {
    // 向服务器发送心跳包数据的逻辑
    // 可以是一个简单的数据包,用于告知服务器连接仍然有效
    // 如果长时间没有收到服务器的响应,可以在这里处理重新连接的逻辑
  },

  stopHeartbeat: function () {
    clearInterval(this.globalData.heartbeatTimer);
  }
});

微信小程序TCPSOCKET实例(客户端完整实例) 至于其他页面发送的服务器数据请求使用的代码,很简单,就是一个JSON数据结构,服务器返回的数据也是JSON结构,处理起来比较简单。朋友们如果需要使用TCPSOCKET与服务器交换数据的,可以把下面代码直接拷贝使用。只要你的数据量不是很大,都可以满足。其中的arraybufferTOString和stringTOArrayBuffer,参考了其他朋友的代码。只有小程序客户端的代码,服务器是用JAVA写的,就不上了(以前写的,比较庞大,上百万行代码)最近一直在研究微信小程序。 阅读详情

相关推荐

微信小程序TCP通信实战:从服务端搭建到客户端连接全流程

本文详细介绍了微信小程序实现TCP通信的完整实战流程。重点解析了小程序TCP连接的网络域限制(仅限局域网或已配置域名),并提供了从Node.js服务端搭建、处理二进制数据与协议设计,到小程序客户端连接、数据收发(ArrayBuffer转换)及状态管理(心跳、重连)的全套代码示例与调试技巧,帮助开发者构建稳定、低延迟的设备直连应用。

weixin_29274969的博客 137

微信小程序开发之tcp客户端开发

首先,保证基础库不能低于。

ckg3824278的博客 1454

微信小程序中基于 SSE 实现轻量级实时通讯 —— 原理、实践与对比分析

本文深入探讨了在微信小程序开发中,如何通过 wx.request + enableChunked + onChunkReceived 方式,模拟 Server-Sent Events(SSE)实现轻量级实时通讯机制。文章系统分析了微信小程序常见的通讯方式,详解 SSE 的原理、优势及完整封装实践,结合实际代码模块,演示小程序端如何高效接收服务器推送的数据。并通过对比 WebSocket、TCP、UDP 等方案,总结适用场景与最佳实践,帮助开发者在不同业务需求下选择最优通讯策略,兼顾性能与稳定性。

qq_40791475的博客 3512

微信小程序+服务器 利用Swoole的TCP实现简单的交互功能

1、服务器 <?php //创建Server对象,监听 127.0.0.1:9501 端口 $server = new Swoole\Server('0.0.0.0', 5901); //监听连接进入事件 $server->on('Connect', function ($server, $fd) { echo "有用户链接.\n"; }); //监听数据接收事件 $server-&g

Dragon 3174

ESP32连接微信小程序,除了远程开关灯,还能玩出什么花样?

本文深入探讨了ESP32与微信小程序的创新结合,展示了15种超越远程开关的智能场景应用。从环境感知到安防监控,再到商业解决方案,详细解析了MQTT、TCP直连等通信技术选型,并提供了性能优化和安全加固的实战技巧,帮助开发者充分发挥ESP32与微信小程序的组合潜能。

weixin_30723433的博客 621

告别数据孤岛:实战解析Android App如何通过OneNet与微信小程序联动控制设备

本文实战解析了Android App如何通过OneNet物联网平台与微信小程序联动控制设备,解决智能家居中的数据孤岛问题。详细介绍了OneNet的核心优势、Android端集成技巧、小程序安全交互设计及跨平台数据同步方案,帮助开发者构建高效的物联网系统。

weixin_38167826的博客 425

微信小程序集成DeepSeek智能客服:从零搭建到性能优化实战

微信小程序集成DeepSeek智能客服:从零搭建到性能优化实战摘要:本文针对微信小程序开发者面临的多轮对话响应慢、上下文管理复杂等痛点,详细解析如何高效集成Deepseek智能客服API。通过对比WebSocket与HTTP轮询方案,提供带断线重连机制的完整实现代码,并给出对话缓存、并发请求限流等生产环境优化策略,帮助开发者将客服响应速度提升300%以上。

2600_94960044的博客 526

微信小程序TCP长连接通信完整实现(含Node服务端+小程序源码+调试工具)

一套开箱即用的微信小程序TCP实时通信方案,包含小程序端完整代码(wx目录)、Node.js服务端(server目录,基于net模块+Express)、HTML网页版测试页面(html目录)和独立TCP客户端调试工具(client目录)。服务端支持Linux/Windows部署,已集成连接建立、消息收发、心跳保活、断线自动重连、连接状态回调等核心功能;小程序端使用wx.connectSocket封装,兼容微信基础库2.0及以上版本,适配真机与开发者工具。所有模块均通过实际环境验证,附带详细README.md

grape的博客 264

webSocket

是一套实时通信框架,不只是 WebSocket,它封装了连接、事件、重连等能力;它有自己的客户端和服务端协议,所以前后端通常要一起使用 Socket.IO,而不是纯原生 WebSocket。适合场景:聊天系统、在线客服、多人协作、实时通知、需要自动重连、前后端都能控制协议。适合场景:普通后台管理系统、简单实时通知、扫码登录状态轮询替代、设备状态实时推送。对象,可以直接创建连接、发送消息、接收消息,不一定需要第三方库。没有自动重连、心跳、消息队列、断线补偿,需要自己封装。不引第三方库,而是自己封装一个。

m0_57841843的博客 193

微信小程序聊天源码解析:从ZIP解压到WebSocket长连接部署

即时通讯已成为微信小程序高频功能需求,而实现实时消息推送的核心技术便是WebSocket长连接。相比HTTP轮询,WebSocket支持服务端主动下发消息,大幅降低延迟与资源消耗。在工程实践中,开发者还需要处理心跳保活、断线重连、消息幂等与长列表渲染等关键问题。这些基础能力在聊天类小程序源码中均有体现。本文以一份典型的微信聊天小程序源码为例,从ZIP解压、项目结构、服务端联调,到核心代码原理与部署排坑,系统拆解一套可运行的IM客户端实现方案,帮助开发者快速理解并改造自己的实时通信模块。

weixin_30431445的博客 322

ESP32+微信小程序实战包:DHT11温湿度监测与LED远程开关(含完整前后端代码)

直接可用的ESP32智能家居控制方案,微信小程序端能实时查看DHT11采集的温度和湿度数值,并一键开关LED灯。前端小程序代码结构清晰,包含app.js、app.、pages页面逻辑、utils工具函数,以及Wechat_esp32_DHT11_LED硬件通信模块;后端基于ESP32实现Wi-Fi联网,支持HTTP或WebSocket协议与小程序交互,已预置Wi-Fi配置和传感器初始化逻辑。dist.zip是编译好的小程序包,可直接在微信开发者工具中导入运行;配套接线说明和基础调试指引已整合进代码注释与Gr

r2s3t4的博客 189

微信小程序AI智能客服机器人实战:WebSocket高并发通信架构与避坑指南

最近在做一个微信小程序的AI智能客服项目,核心需求是实现用户与AI机器人的实时、流畅对话。技术栈上,实时通信是绕不开的一环。经过一番调研和实战,最终选择了WebSocket作为通信基石,并针对微信小程序这个特殊环境,搭建了一套相对健壮的高并发通信架构。过程中踩了不少坑,也积累了一些经验,这里做个记录和分享。

2600_94959983的博客 166

基于TCP,socket通信,简单小程序

基于TCP,socket通信,简单小程序,很适合初学者

告别串口调试助手:教你用微信小程序直接调试STC89C51程序状态

本文介绍如何利用微信小程序和STC89C51单片机实现云端可视化调试终端,通过巴法云物联网平台的MQTT协议,实现单片机运行状态的实时监控与移动端交互。文章详细讲解了硬件选型、数据采集、云端推送及微信小程序的动态可视化实现,为嵌入式系统调试提供了高效便捷的新方案。

weixin_30814329的博客 463

微信小程序 TCP,IP长连接 (源码)

微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)微信小程序 TCP,IP长连接 (源码)

微信小程序使用Socket的实例

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

你还在使用WebSocket实现实时消息推送吗?

而且SSE使用的是http协议(websocket使用的是ws协议),也就是现有的服务端都支持SSE,无需像websocket一样需要服务端提供额外的支持。在日常的开发中,我们经常能碰见服务端需要主动推送给客户端数据的业务场景,比如数据大屏的实时数据,比如消息中心的未读消息,比如聊天功能等等。SSE的优点是,它是一个轻量级的协议,相对于websockte来说,他的复杂度就没有那么高,相对于客户端的消耗也比较少。websocket是一个双向通讯的协议,他的优点是,可以同时支持客户端和服务端彼此相互进行通讯。

Java精选 94

微信小游戏服务器,房间及卡牌类游戏服务器 支持websocket,wss及tcp协议,lua编写游戏逻辑

微信小游戏服务器,facebook instant game server,房间及卡牌类游戏服务器。支持websocket,wss及tcp协议,lua编写游戏逻辑。C++底层已支持四十余款线上产品,跨平台。lua函数支持不停机热更新。包含一个斗地主游戏逻辑。.zip

上一篇: 手机陀螺仪实现同步3D模型旋转
INT_web
博客等级 码龄9年 8粉丝 5原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

INT_web

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值