• uniapp中websocket的使用单个长连接


    1、新建js文件封装websocket.js

    1. const WEBSOCKET = {
    2. //是否打开连接
    3. socketOpen: false,
    4. //连接socket
    5. /*
    6. url:链接地址 wss://xxxxxxxx.com
    7. socketMessageFunc:收到服务器内容回调
    8. */
    9. connectSocket(url, socketMessageFunc = null) {
    10. try {
    11. //连接socket
    12. uni.connectSocket({
    13. url,
    14. success() {
    15. console.log('websocket连接成功!')
    16. }
    17. })
    18. //监听socket连接
    19. uni.onSocketOpen((res) => {
    20. this.socketOpen = true
    21. console.log('WebSocket连接已打开!',res)
    22. })
    23. //监听socket连接失败
    24. uni.onSocketError((res) => {
    25. this.socketOpen = false
    26. console.log('WebSocket连接打开失败,请检查!',res)
    27. })
    28. //监听收到消息
    29. uni.onSocketMessage((res) => {
    30. console.log('收到服务器内容:' + res.data)
    31. if(socketMessageFunc){
    32. socketMessageFunc(res.data)
    33. }
    34. })
    35. //监听socket关闭
    36. uni.onSocketClose(() => {
    37. console.log('WebSocket 已关闭!')
    38. this.socketOpen = false
    39. })
    40. } catch (error) {
    41. console.log('err:' + error)
    42. }
    43. },
    44. //发送消息
    45. /*
    46. msg:字符串 JSON.stringify({
    47. "userId": this.uid,
    48. "targetIds": targetId,
    49. "data":'哈哈哈'
    50. })
    51. successFunc:成功回调函数
    52. errorFunc:失败回调函数
    53. */
    54. sendMessage(msg = '', successFunc = null, errorFunc = null) {
    55. if (!this.socketOpen || !msg) {
    56. if (errorFunc) {
    57. errorFunc('未传消息内容或连接未打开!')
    58. }
    59. return
    60. }
    61. uni.sendSocketMessage({
    62. data: msg,
    63. success(res) {
    64. console.log('消息发送成功!')
    65. if (successFunc) {
    66. successFunc(res)
    67. }
    68. },
    69. fail(err) {
    70. console.log('消息发送失败!')
    71. if (errorFunc) {
    72. errorFunc(err)
    73. }
    74. }
    75. })
    76. },
    77. //关闭连接
    78. closeSocket() {
    79. if (!this.socketOpen) {
    80. return
    81. }
    82. //关闭socket连接
    83. uni.closeSocket()
    84. }
    85. }
    86. export default WEBSOCKET

    2、单页面使用

    1. <script>
    2. //导入websocket对象
    3. import websocket from '@/utils/websocket'
    4. //定义定时器
    5. let globalTimer = null
    6. export default {
    7. onLoad() {
    8. try {
    9. //建立socket连接
    10. websocket.connectSocket('wss://xxxxxxxx.com', (res) => {
    11. console.log('收到内容:', res);
    12. //做一些处理、方法调用
    13. })
    14. } catch (error) {
    15. console.log('error:' + error)
    16. }
    17. },
    18. onUnload() {
    19. //关闭socket
    20. websocket.closeSocket()
    21. },
    22. methods: {
    23. heartBeatTest() {
    24. //清除定时器
    25. if(globalTimer){
    26. clearInterval(globalTimer)
    27. globalTimer = null
    28. }
    29. globalTimer = setInterval(() => {
    30. //发送消息给服务端
    31. websocket.sendMessage(
    32. JSON.stringify({
    33. "userId": '001',
    34. "targetIds": '1234',
    35. "data": '哈哈哈'
    36. }), //与服务端约定好消息格式
    37. (res ) => {
    38. console.log('消息发送成功!',res)
    39. },
    40. (err) => {
    41. console.log('消息发送失败!',err)
    42. //如果失败则清除定时器
    43. clearInterval(globalTimer)
    44. }
    45. )
    46. }, 10000)
    47. }
    48. }
    49. }
    50. script>
    51. <style lang="scss">
    52. style>

  • 相关阅读:
    学习太极创客 — MQTT(五)发布、订阅和取消订阅
    number
    IEEE PDF eXpress系统报错:TimesNewRoman PS-BoldMT, ItalicMT, PSM
    如何理解分布式架构和微服务架构呢
    数据结构与算法之美代码:排序算法3
    国务院:电子印章跨地区跨部门互信互认,契约锁助力企业办事提效
    大学生网页作业成品——基于HTML网上书城项目的设计与实现
    华为OD机试 - 最长连续子序列 - 双指针(Java 2023 B卷 100分)
    第十四届蓝桥杯python第二期模拟赛
    GoLang读写数据---上
  • 原文地址:https://blog.csdn.net/2201_75870706/article/details/133128227