微信小程序搜索局域网设备

最终目的:在微信小程序内搜索到同局域网内的其他设备

实现步骤:小程序开启 mDNS(多播 DNS) 搜索 + 其他设备配置对应的 mDNS 模块

小程序开启 mDNS 搜索

使用 wx.startLocalServiceDiscovery 来开启 mDNS 搜索

vue 复制代码
<template>
  <view>
    <button @click="getLocalDevice">获取局域网设备</button>
    <!-- 打印信息 -->
    <view v-for="(item, index) in infoList" :key="index">
      {{ item }}
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        infoList: [],
      }
    },
    methods: {
      //获取局域网设备
      getLocalDevice() {
        // 开始搜索
        wx.startLocalServiceDiscovery({
          // 当前手机所连的局域网下有一个 _http._tcp. 类型的服务,除此之外还可以设置为 '_ssh._tcp'等,具体自己百度
          serviceType: '_http._tcp',
          success: data => {
            console.log('开启成功', data)
          },
          fail: error => {
            console.log('开启失败', error)
          },
        })

        // 设置定时器停止搜索(如果不设置的话,微信默认搜索30s后停止搜索)
        setTimeout(() => {
          wx.stopLocalServiceDiscovery({
            success: data => {
              console.log('关闭成功', data)
            },
            fail: error => {
              console.log('关闭失败', error)
            },
          })
        }, 20000)
        // 监听搜索到的数据,每搜索到一个设备,就会执行一次该函数
        wx.onLocalServiceFound(rs => {
          console.log('搜索到设备', rs)
        })
      },
    },
  }
</script>

其他设备配置对应的 mDNS 模块

根据设备自己的系统去设置 mDNS,在此不做演示

相关推荐
2501_915918411 小时前
Web 前端可视化开发工具对比 低代码平台、可视化搭建工具、前端可视化编辑器与在线可视化开发环境的实战分析
前端·低代码·ios·小程序·uni-app·编辑器·iphone
2501_915106322 小时前
iOS 使用记录和能耗监控实战,如何查看电池电量消耗、App 使用时长与性能数据(uni-app 开发调试必备指南)
android·ios·小程序·uni-app·cocoa·iphone·webview
じòぴé南冸じょうげん10 小时前
小程序的project.private.config.json是无依赖文件,那可以删除吗?
前端·小程序·json
2501_9160137410 小时前
HTTPS 抓包难点分析,从端口到工具的实战应对
网络协议·http·ios·小程序·https·uni-app·iphone
2501_9159184113 小时前
uni-app 项目 iOS 上架效率优化 从工具选择到流程改进的实战经验
android·ios·小程序·uni-app·cocoa·iphone·webview
00后程序员张13 小时前
如何在不同 iOS 设备上测试和上架 uni-app 应用 实战全流程解析
android·ios·小程序·https·uni-app·iphone·webview
微三云-轩14 小时前
区块链:重构企业数字化的信任核心与创新动力
人工智能·小程序·区块链·生活·我店
阿隆_趣编程16 小时前
为了方便相亲,我用AI写了一款小程序
前端·javascript·微信小程序
2501_915918411 天前
iOS 开发全流程实战 基于 uni-app 的 iOS 应用开发、打包、测试与上架流程详解
android·ios·小程序·https·uni-app·iphone·webview
黑马源码库miui520861 天前
JAVA同城打车小程序APP打车顺风车滴滴车跑腿源码微信小程序打车源码
java·微信·微信小程序·小程序·uni-app