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月前
|
机器学习/深度学习 PyTorch TensorFlow
卷积神经网络深度解析:从基础原理到实战应用的完整指南
蒋星熠Jaxonic,深度学习探索者。深耕TensorFlow与PyTorch,分享框架对比、性能优化与实战经验,助力技术进阶。
|
3月前
|
监控 安全 Shell
管道符在渗透测试与网络安全中的全面应用指南
管道符是渗透测试与网络安全中的关键工具,既可用于高效系统管理,也可能被攻击者利用实施命令注入、权限提升、数据外泄等攻击。本文全面解析管道符的基础原理、实战应用与防御策略,涵盖Windows与Linux系统差异、攻击技术示例及检测手段,帮助安全人员掌握其利用方式与防护措施,提升系统安全性。
160 6
|
2月前
|
移动开发 小程序 Android开发
基于 uni-app 开发的废品回收类多端应用功能与界面说明
本文将对一款基于 uni-app 开发的废品回收类多端应用,从多端支持范围、核心功能模块及部分界面展示进行客观说明,相关资源信息也将一并呈现。
101 0
|
7月前
|
SQL 分布式计算 Serverless
鹰角网络:EMR Serverless Spark 在《明日方舟》游戏业务的应用
鹰角网络为应对游戏业务高频活动带来的数据潮汐、资源弹性及稳定性需求,采用阿里云 EMR Serverless Spark 替代原有架构。迁移后实现研发效率提升,支持业务快速发展、计算效率提升,增强SLA保障,稳定性提升,降低运维成本,并支撑全球化数据架构部署。
685 56
鹰角网络:EMR Serverless Spark 在《明日方舟》游戏业务的应用
|
6月前
|
人工智能 监控 安全
NTP网络子钟的技术架构与行业应用解析
在数字化与智能化时代,时间同步精度至关重要。西安同步电子科技有限公司专注时间频率领域,以“同步天下”品牌提供可靠解决方案。其明星产品SYN6109型NTP网络子钟基于网络时间协议,实现高精度时间同步,广泛应用于考场、医院、智慧场景等领域。公司坚持技术创新,产品通过权威认证,未来将结合5G、物联网等技术推动行业进步,引领精准时间管理新时代。
|
2月前
|
机器学习/深度学习 人工智能 算法
卷积神经网络深度解析:从基础原理到实战应用的完整指南
蒋星熠Jaxonic带你深入卷积神经网络(CNN)核心技术,从生物启发到数学原理,详解ResNet、注意力机制与模型优化,探索视觉智能的演进之路。
328 11
|
7月前
|
存储 SQL 运维
中国联通网络资源湖仓一体应用实践
本文分享了中国联通技术专家李晓昱在Flink Forward Asia 2024上的演讲,介绍如何借助Flink+Paimon湖仓一体架构解决传统数仓处理百亿级数据的瓶颈。内容涵盖网络资源中心概况、现有挑战、新架构设计及实施效果。新方案实现了数据一致性100%,同步延迟从3小时降至3分钟,存储成本降低50%,为通信行业提供了高效的数据管理范例。未来将深化流式数仓与智能运维融合,推动数字化升级。
300 0
中国联通网络资源湖仓一体应用实践
|
3月前
|
机器学习/深度学习 传感器 运维
【电机轴承监测】基于matlab声神经网络电机轴承监测研究(Matlab代码实现)
【电机轴承监测】基于matlab声神经网络电机轴承监测研究(Matlab代码实现)
|
3月前
|
数据采集 存储 数据可视化
Python网络爬虫在环境保护中的应用:污染源监测数据抓取与分析
在环保领域,数据是决策基础,但分散在多个平台,获取困难。Python网络爬虫技术灵活高效,可自动化抓取空气质量、水质、污染源等数据,实现多平台整合、实时更新、结构化存储与异常预警。本文详解爬虫实战应用,涵盖技术选型、代码实现、反爬策略与数据分析,助力环保数据高效利用。
210 0
|
3月前
|
安全 Linux
利用Libevent在CentOS 7上打造异步网络应用
总结以上步骤,您可以在CentOS 7系统上,使用Libevent有效地构建和运行异步网络应用。通过采取正确的架构和代码设计策略,能保证网络应用的高效性和稳定性。
106 0

热门文章

最新文章