小程序开发必备的高级能力之四:mDNS

1、效果图

先瞅一眼效果图。


微信图片_20181217120824.png

2、释义

mDNS:即组播DNS(multicast DNS),使用5353端口,主要实现了在没有传统DNS服务器的情况下使局域网内的主机实现相互发现和通信。(--百度百科)

微信图片_20181217120820.png

这段话什么意思呢?

其实是酱婶的,在客户端和服务端通信过程中(request,socket,websocket,ftp等),我们一般都需要知道对方的域名或者ip/port才能通信。

而在发送请求前,域名最终会经过一个叫DNS服务器的地方解析出相应的ip/port才能通信。

在局域网中,各个设备是没有域名的。此时我们只能通过ip/port来通信,但一般情况下各设备的ip是不固定的,它们是由DHCP分配的,在偶尔的掉线重连之后没准ip就变了,而且你也不知道要连接的设备的ip是多少。

基于此,mDNS登场了,它主要实现了设备间的互相发现。

emmmm,它没有通信功能。通信一般是通过socket来进行。

3、小程序中的mDNS

小程序中的mDNS主要有10个API
其中2个是主动事件,4个监听事件回调和4个取消监听事件回调
他们之间的关系是一一对应的。
而且,除了2个主动事件外,其他8个方法都是传1个回调方法过去

2个主动事件分别是:
1.开始搜寻局域网下的mDNS服务 wx.startLocalServiceDiscovery
2.停止搜索 mDNS 服务 wx.stopLocalSeviceDiscovery

4个监听事件回调分别是:
1.监听mDNS服务发现的事件 wx.onLocalServiceFound
2.监听mDSN服务解析失败的时间 wx.onLocalServiceResolveFail
3.监听mDNS服务离开的事件 wx.onLocalServiceLost
4.监听mDNS 服务停止搜索的事件 wx.onLocalServiceDiscoveryStop

4个取消监听事件回调分别是(目前这4个API无效?不知是否是我调用方式不对。但无所谓,这4个方法就算无效也没什么影响。)
1.取消监听mDNS 服务发现的事件 wx.offLocalServiceFound
2.取消监听mDNS 服务解析失败的事件 wx.offLocalServiceResolveFail
3.取消监听mDNS 服务离开的事件 wx.offLocalServiceLost
4.取消监听mDNS 服务停止搜索的事件 wx.offLocalServiceDiscoveryStop

4、实践

我们实现手动开启和关闭mDNS搜索,并在开启时实现mDNS监听事件的4个方法,在关闭时取消监听mDNS的4个方法。
wxml/wxss就不提,主要js实现如下。

/**
   * 开始搜索
   */
  startDiscovery:function(){
    let that = this
    serviceList = []
    resolveFailList = []
    wx.startLocalServiceDiscovery({
      serviceType:'_http._tcp.',
      success:function(res){
        that.onLocalService()
        
      },
      fail:function(err){
        console.log(err)
      },
      complete:function(){
        console.log('complete')
      }
    })

  },

  /**
   * stopDiscovery
   */
  stopDiscovery:function(){
    let that = this
    wx.stopLocalServiceDiscovery({
      success: function () {
        that.showTips('停止搜索成功','success')
        serviceList = []
        resolveFailList = []
        that.setData({
          lists:[],
          resolveFailList:[]
        })
        that.offLocalService()
        
      },
      fail: function () {
        that.showTips('停止搜索失败,请重试!')
      },
      complete: function () {
        console.log('stopDiscovery complete')
      }
    })
  },

  /**
   * 提示方法
   */
  showTips:function(title='出错啦',icon='none'){
    wx.showToast({
      title: title,
      icon: icon,
      duration:2000
    })
  },

  /**
   * 监听方法合集
   */
  onLocalService:function(){
    let that = this
    // 监听服务发现事件
    wx.onLocalServiceFound(function (obj) {
      console.log(obj)
      serviceList.push(obj)
      that.setData({
        lists: serviceList
      })
    })

    // 监听服务解析失败事件
    wx.onLocalServiceResolveFail(function (obj){
      resolveFailList.push(obj)
      that.setData({
        resolveFailList: resolveFailList
      })
    })

    // 监听服务离开
    wx.onLocalServiceLost(function (obj){
      that.showTips('有服务离开啦');
      console.log(obj)
    })

    // 监听搜索停止
    wx.onLocalServiceDiscoveryStop(function (obj){
      console.log('监听到搜索停止事件')
    })

  },

  /**
   * offLocalService
   */
  offLocalService: function () {

    console.log('是否执行此部分数据')
    // 取消监听服务发现事件
    wx.offLocalServiceFound(function () {
      console.log('取消监听服务发现事件 成功')
    })

    // 取消监听服务解析失败事件
    wx.offLocalServiceResolveFail(function () {
      console.log('取消监听 mDNS 服务解析失败的事件 成功')
    })

    // 取消监听服务离开
    wx.offLocalServiceLost(function () {
      console.log('取消监听服务离开事件 成功')
    })

    // 取消监听搜索停止
    wx.offLocalServiceDiscoveryStop(function () {
      console.log('取消监听 mDNS 服务停止搜索的事件 成功')
    })
  },

开始搜索 时正确,如下图。


微信图片_20181217120824.png

但是随后,每次停止搜索后再次开始搜索时,每个设备会被发现了2次。再停止搜索再开启搜索,会被发现3次。经定位,是取消监听的4个方法无效。(现在是2018-12-17 11:36),如下图。


微信图片_20181217120828.png

5、 最佳实践

其实,那4个取消监听的方法就算无效,对我们来说也不是很重要。
上面碰到的问题,无非是多次实现了监听事件而已。基于此,我们至少有2种解决方式。
1、使用statu来判断,不是第一次开启,就不再执行监听事件代码
2、在搜索之前就调用监听事件,开启搜索成功之后不再调用,这样子开启和关闭搜索功能,不和其他方法耦合。

于是,我们改进代码,使用第二种方法来解决这个问题。在onShow()中执行this.onLocalService(),并注释掉开启搜索成功回调里的代码即可。

最后把mdns这部分代码放到了github上。这里

6、其他注意事项

1、mdns只能真机调试
2、主动调用wx.stopLocalSeviceDiscovery()并不会触发wx.onLocalServiceDiscoveryStop事件,该事件在意外停止了搜索时才触发,例如手机屏幕关闭一段时间等。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 151,511评论 1 330
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 64,495评论 1 273
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 101,595评论 0 225
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 42,558评论 0 190
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 50,715评论 3 270
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 39,672评论 1 192
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,112评论 2 291
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 29,837评论 0 181
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 33,417评论 0 228
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 29,928评论 2 232
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,316评论 1 242
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 27,773评论 2 234
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,253评论 3 220
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 25,827评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,440评论 0 180
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 34,523评论 2 249
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 34,583评论 2 249

推荐阅读更多精彩内容

  • 给提问的开发者的建议:提问之前先查询 文档、通过社区右上角搜索搜索已经存在的问题。 写一个简明扼要的标题,并且...
    极乐叔阅读 13,033评论 0 3
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,028评论 1 32
  • 点击查看原文 Web SDK 开发手册 SDK 概述 网易云信 SDK 为 Web 应用提供一个完善的 IM 系统...
    layjoy阅读 13,232评论 0 15
  • iOS面试题目100道 1.线程和进程的区别。 进程是系统进行资源分配和调度的一个独立单位,线程是进程的一个实体,...
    有度YouDo阅读 29,725评论 8 137
  • 一年的时间跟妈妈从温暖的南方到北京看雪,在寒冷的冬天到海南体验夏日炎炎,我们手牵手一起走南闯北,记忆最深的还是在天...
    吴清云阅读 332评论 0 1