uni-app:网络状态监测之onNetworkStatusChange与getNetworkType的区别与应用

简介: 1、在实际项目开发中,难免涉及到监测网络,下面来具体了解下小程序两种监测网络的方法。2、这里配置的是 uniapp,微信小程序把 uni. 换成 wx. 即可。

前言


1、在实际项目开发中,难免涉及到监测网络,下面来具体了解下小程序两种监测网络的方法。

2、这里配置的是 uniapp,微信小程序把 uni. 换成 wx. 即可。


二、应用说明


2.1、uni. onNetworkStatusChange

触发时机:在网络切换的时候执行,切换2G,3G,WiFi的时候会执行。

应用时机:一般都会放在 onShow里面,实时监听网络的切换。当小程序关闭后台的时候在 onHide 生命周期函数中 执行 【uni.offNetworkStatusChange()】关闭监听网络。


小程序模拟器怎么进行切换网络呢?如下图:

7b9ad311c32644d3b3254ca30b81bea6.png


2.2、uni.getNetworkType

触发时机:在页面初始化的时候,或者是在方法执行的时候执行。

应用时机:可以再onShow 、onLoad这样的生命周期里面来执行,也可以在点击事件中添加执行,属于即用即取的。


三、场景应用


可根据自己的项目需求,进行自行配置调整即可。uni.getNetworkType && uni.onNetworkStatusChange 使用区别见上方。


1、监听网络状态:


onShow: function() {
  /// 获取基本配置信息
  this.iConfigDataOnShow();
},
onHide: function() {
  this.iConfigDataOnHide(e);
},
methods: {
  /// 获取基本配置信息
  iConfigDataOnShow() {
    let that = this;
    /// 获取网络类型
    uni.getNetworkType(function(res) {
    that.iNetworkStatus(res)
    });
    /// 监听网络状态变化
    uni.onNetworkStatusChange(function(res) {
    that.iNetworkStatus(res)
    });
    /// 获取当前的地理位置、速度。
    uni.getLocation({
    type: 'gcj02',
    success: function(res) {
      that.iLocation(res)
    },
    });
  },
  /// 关闭基本配置信息监听
  iConfigDataOnHide() {
    let that = this;
    /// 取消监听网络状态变化。
    uni.offNetworkStatusChange(function(res) {
    that.iNetworkStatus(res)
    });
  },
  /// 获取网络状态
  iNetworkStatus(res) {
    /* {
    "errMsg":"getNetworkType:ok",
    "networkType":"wifi"
     } */
    var __netType = '';
    //网络状态  1=wifi 2=蜂窝网络(2g) 3=3g 4=4g 5=5g 6=有线网络 7=unknown 0=无网络
    switch (res.networkType) {
      case 'wifi':
      __netType = 1;
      break;
      case '2g':
      __netType = 2;
      break;
      case '3g':
      __netType = 3;
      break;
      case '4g':
      __netType = 4;
      break;
      case '5g':
      __netType = 5;
      break;
      case 'ethernet':
      __netType = 6;
      break;
      case 'unknown':
      __netType = 7;
      break;
      case 'none':
      __netType = 0;
      break;
      default:
      break;
    }
    this.$scope.globalData.logNet = __netType;
    console.log(res.networkType);
    },
  /// 获取定位信息
  iLocation(res) {
    /* {
    "latitude":24.44579,
    "longitude":118.08243,
    "speed":-1,
    "accuracy":65,
    "verticalAccuracy":65,
    "horizontalAccuracy":65,
    "errMsg":"getLocation:ok"
    } */
    this.$scope.globalData.logLocate = res;
  },
  }


2、获取网络状态


uni.getNetworkType({
    success: function (res) {
      console.log("---res",res.networkType);
      if(res.networkType != 'wifi' && res.networkType != 'none') {
      uni.showToast({
        title: '正在使用流量播放',
        icon:'none',
        duration:3000
      })
      }else if(res.networkType == 'none') {
      console.log("无网络");
      uni.showToast({
        title: '网络异常,请稍后再试',
        icon:'none',
        duration:3000
      })
      }
    }
    })
相关文章
|
1月前
|
人工智能 运维 物联网
AI在蜂窝网络中的应用前景
AI在蜂窝网络中的应用前景
51 3
|
15天前
|
Kubernetes 安全 Devops
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
39 10
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
|
6天前
|
供应链 搜索推荐 API
1688APP原数据API接口的开发、应用与收益(一篇文章全明白)
1688作为全球知名的B2B电商平台,通过开放的原数据API接口,为开发者提供了丰富的数据资源,涵盖商品信息、交易数据、店铺信息、物流信息和用户信息等。本文将深入探讨1688 APP原数据API接口的开发、应用及其带来的商业收益,包括提升流量、优化库存管理、增强用户体验等方面。
38 6
|
29天前
|
存储 监控 物联网
计算机网络的应用
计算机网络已深入现代生活的多个方面,包括通信与交流(电子邮件、即时通讯、社交媒体)、媒体与娱乐(在线媒体、在线游戏)、商务与经济(电子商务、远程办公)、教育与学习(在线教育平台)、物联网与智能家居、远程服务(远程医疗、智能交通系统)及数据存储与处理(云计算、数据共享与分析)。这些应用极大地方便了人们的生活,促进了社会的发展。
49 2
计算机网络的应用
|
1月前
|
机器学习/深度学习 运维 安全
图神经网络在欺诈检测与蛋白质功能预测中的应用概述
金融交易网络与蛋白质结构的共同特点是它们无法通过简单的欧几里得空间模型来准确描述,而是需要复杂的图结构来捕捉实体间的交互模式。传统深度学习方法在处理这类数据时效果不佳,图神经网络(GNNs)因此成为解决此类问题的关键技术。GNNs通过消息传递机制,能有效提取图结构中的深层特征,适用于欺诈检测和蛋白质功能预测等复杂网络建模任务。
69 2
图神经网络在欺诈检测与蛋白质功能预测中的应用概述
|
22天前
|
存储 安全 网络安全
网络安全的盾与剑:漏洞防御与加密技术的实战应用
在数字化浪潮中,网络安全成为保护信息资产的重中之重。本文将深入探讨网络安全的两个关键领域——安全漏洞的防御策略和加密技术的应用,通过具体案例分析常见的安全威胁,并提供实用的防护措施。同时,我们将展示如何利用Python编程语言实现简单的加密算法,增强读者的安全意识和技术能力。文章旨在为非专业读者提供一扇了解网络安全复杂世界的窗口,以及为专业人士提供可立即投入使用的技术参考。
|
29天前
|
机器学习/深度学习 自然语言处理 语音技术
Python在深度学习领域的应用,重点讲解了神经网络的基础概念、基本结构、训练过程及优化技巧
本文介绍了Python在深度学习领域的应用,重点讲解了神经网络的基础概念、基本结构、训练过程及优化技巧,并通过TensorFlow和PyTorch等库展示了实现神经网络的具体示例,涵盖图像识别、语音识别等多个应用场景。
52 8
|
27天前
|
网络协议 物联网 数据处理
C语言在网络通信程序实现中的应用,介绍了网络通信的基本概念、C语言的特点及其在网络通信中的优势
本文探讨了C语言在网络通信程序实现中的应用,介绍了网络通信的基本概念、C语言的特点及其在网络通信中的优势。文章详细讲解了使用C语言实现网络通信程序的基本步骤,包括TCP和UDP通信程序的实现,并讨论了关键技术、优化方法及未来发展趋势,旨在帮助读者掌握C语言在网络通信中的应用技巧。
38 2
|
29天前
|
机器学习/深度学习 人工智能 自然语言处理
探索深度学习中的卷积神经网络(CNN)及其在现代应用中的革新
探索深度学习中的卷积神经网络(CNN)及其在现代应用中的革新
|
1月前
|
安全 网络安全 数据安全/隐私保护
利用Docker的网络安全功能来保护容器化应用
通过综合运用这些 Docker 网络安全功能和策略,可以有效地保护容器化应用,降低安全风险,确保应用在安全的环境中运行。同时,随着安全威胁的不断变化,还需要持续关注和研究新的网络安全技术和方法,不断完善和强化网络安全保护措施,以适应日益复杂的安全挑战。
44 5