微信小程序 如何獲取網(wǎng)絡(luò)狀態(tài)
前言
手機(jī)連接到互聯(lián)網(wǎng)有幾種方式:Wifi、2G、3G、4G,包括很快到來(lái)的5G,每種方式的上傳速度和下載速度差異很大,它們的計(jì)費(fèi)方式的差異也導(dǎo)致用戶在使用互聯(lián)網(wǎng)服務(wù)的時(shí)候有不同的使用習(xí)慣。
Wifi相對(duì)于其他幾種網(wǎng)絡(luò)連接方式,其速度會(huì)更快。Wifi一般都是免費(fèi)供用戶使用,通過(guò)移動(dòng)數(shù)據(jù)網(wǎng)絡(luò)是需要根據(jù)使用流量進(jìn)行計(jì)費(fèi)的。我們考慮這樣一個(gè)場(chǎng)景,小程序需要下載一些文檔,然后通過(guò)小程序的能力去預(yù)覽這個(gè)文檔,這些文檔可能文件體積比較大,對(duì)于某些用戶來(lái)說(shuō),他們并不想耗費(fèi)太多的數(shù)據(jù)流量去預(yù)覽文檔??紤]到這樣的情況,我們可以通過(guò)小程序提供的獲取網(wǎng)絡(luò)狀態(tài)的能力,做一些更友好的體驗(yàn)提示。
代碼利用wx.getNetworkType獲取網(wǎng)絡(luò)狀態(tài)
代碼:
// 預(yù)覽文檔 lookFile(){ wx.getNetworkType({ success: function (res) { // networkType字段的有效值: // wifi/2g/3g/4g/unknown(Android下不常見的網(wǎng)絡(luò)類型)/none(無(wú)網(wǎng)絡(luò)) if (res.networkType == 'wifi') { // 從網(wǎng)絡(luò)上下載pdf文檔 wx.downloadFile({ url: 'https://pic25.nipic.com/20121205/10197997_003647426000_2.jpg', success: function (res) { // 下載成功之后進(jìn)行預(yù)覽文檔 wx.openDocument({ filePath: res.tempFilePath }) } }) } else { wx.showModal({ title: '提示', content: '當(dāng)前為非Wifi環(huán)境,確定下載嗎?', confirmText: '確定', cancelText: '取消', success: function (res) { if (res.confirm) { console.log('確定操作') wx.downloadFile({ url: 'https://pic25.nipic.com/20121205/10197997_003647426000_2.jpg', success: function (res) { // 下載成功之后進(jìn)行預(yù)覽文檔 wx.openDocument({ filePath: res.tempFilePath }) } }) } else if (res.cancel) { console.log('取消操作') wx.showToast({ title:'取消成功' }) } } }) } } }) }
某些情況下,我們的手機(jī)連接到網(wǎng)絡(luò)的方式會(huì)動(dòng)態(tài)變化,例如手機(jī)設(shè)備連接到一個(gè)信號(hào)不穩(wěn)定的Wifi熱點(diǎn),導(dǎo)致手機(jī)會(huì)經(jīng)常從Wifi切換到移動(dòng)數(shù)據(jù)網(wǎng)絡(luò)。小程序宿主環(huán)境也提供了一個(gè)可以動(dòng)態(tài)監(jiān)聽網(wǎng)絡(luò)狀態(tài)變化的接口wx.onNetworkStatusChange,讓開發(fā)者可以及時(shí)根據(jù)網(wǎng)絡(luò)狀況去調(diào)整小程序的體驗(yàn),wx.onNetworkStatusChange這個(gè)接口的使用場(chǎng)景留給讀者來(lái)思考。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
uni-app實(shí)現(xiàn)頁(yè)面通信EventChannel的操作方法
使用了EventBus的方法實(shí)現(xiàn)不同頁(yè)面組件之間的一個(gè)通信,在uni-app中,我們也可以使用uni-app API,uni.navigateTo來(lái)實(shí)現(xiàn)頁(yè)面間的通信,這篇文章主要介紹了uni-app實(shí)現(xiàn)頁(yè)面通信EventChannel的操作方法,需要的朋友可以參考下2024-05-05javascript替換已有元素replaceChild()使用介紹
這篇文章主要介紹了javascript替換已有元素replaceChild()使用,需要的朋友可以參考下2014-04-04原生js實(shí)現(xiàn)表格循環(huán)滾動(dòng)
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)表格循環(huán)滾動(dòng),每次滾動(dòng)一行停頓,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-11-11javascript與css3動(dòng)畫結(jié)合使用小結(jié)
本文給大家講述的是如何使用javascript結(jié)合CSS動(dòng)畫來(lái)實(shí)現(xiàn)一些占用資源更少,更優(yōu)化的動(dòng)畫效果,思路十分巧妙,這里推薦給小伙伴們參考下。2015-03-03IE與FireFox的JavaScript兼容問(wèn)題解決辦法
本篇文章主要是對(duì)IE與FireFox的JavaScript兼容問(wèn)題解決辦法進(jìn)行了詳細(xì)的分析介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-12-12如何判斷Javascript對(duì)象是否存在的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇如何判斷Javascript對(duì)象是否存在的簡(jiǎn)單實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05js將URL網(wǎng)址轉(zhuǎn)為16進(jìn)制加密與解密函數(shù)
這篇文章主要介紹了js將URL網(wǎng)址轉(zhuǎn)為16進(jìn)制加密與解密函數(shù),很多朋友喜歡將網(wǎng)址轉(zhuǎn)換為16進(jìn)制,網(wǎng)上實(shí)在找不到轉(zhuǎn)換為\x這樣的工具,于是手工改一下2020-03-03