wx.onNetworkStatusChange(function (res) 监听网络状态变化 实践方案
网络状态 · 小程序 https://developers.weixin.qq.com/miniprogram/dev/api/device.html#wxonnetworkstatuschangecallback
import wepy from 'wepy'
import util from './util'
import md5 from './md5'
// import tip from './tip'
const networkStatusChangeLog = () => {
try {
wx.removeStorageSync('onNetworkStatusChange')
} catch (e) {
// Do something when catch error
console.log(e)
}
const log = new Date().toUTCString() + 'BizInfo' + 'uploadWhenOk'
wx.setStorageSync('onNetworkStatusChange', log)
}
const isConnected = async () => {
let container = {}
await wx.getNetworkType({
success: function (res) {
container = res
console.log(res)
},
fail: function (res) {},
complete: function (res) {}
})
await wx.onNetworkStatusChange(function (res) {
console.log('onNetworkStatusChange',res)
})
// console.log(container)
// if (!container.networkStatus.isConnected) {
// wx.showToast({
// title: '无网络',
// icon: 'loading',
// duration: 2000
// })
// networkStatusChangeLog()
// return false
// }
return true
}
const appendInfo = () => {
const API_SECRET_KEY = 'https://github.com/dyq086/wepy-mall/tree/master/src'
const TIMESTAMP = util.getCurrentTime()
const SIGN = md5.hex_md5((TIMESTAMP + API_SECRET_KEY).toLowerCase())
const MORE = 'more......'
return {
'API_SECRET_KEY': API_SECRET_KEY,
'TIMESTAMP': TIMESTAMP,
'SIGN': SIGN,
'MORE': MORE
}
}
const wxRequest = async (params = {}, url) => {
console.log('wxRequest', params)
const c = await isConnected()
if (!c) {
return
}
// tip.loading()
let data = params.query || {}
const header = params.header || {}
const isAppend = params.isAppend || false
if (isAppend) {
const a = appendInfo()
for (let k in a) {
eval('data.' + k + '= a.' + k)
}
}
let res = await wepy.request({
url: url,
method: params.method || 'GET',
data: data,
header: header
})
// tip.loaded()
console.log('wxRequest', res)
return res
}
module.exports = {
wxRequest
}
和声明的位置无关，一次声明，整个小程序 都在使用
所以放到
app.wpy?
1、在回调函数中添加本地存储的代码，每次监听到网络状态变化都会在本地记录，然后给用户弹出提醒框；
2、声明一次；
3、在请求网络的公共方法处添加网络状态钩子，方式为读取1中的本地的网络数据。
D:\GPUGO\MP\wepy\mpBMCwepy\src\app.wpy
<style lang="less">
.container {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
</style>
<script>
import wepy from 'wepy'
import 'wepy-async-function'
import {
setStore
} from 'wepy-redux'
import configStore from './store'
const store = configStore()
setStore(store)
export default class extends wepy.app {
config = {
pages: [
// 'pages/index', 'pages/advertisement', 'pages/companyShow', 'pages/logs', 'pages/materialUpload', 'pages/news', 'pages/questionsAnswers', 'pages/userCenter', 'pages/consumeRecord', 'pages/companyInfo', 'pages/userInfo', 'pages/userLogin', 'pages/videoUpload', 'pages/aboutUs', 'pages/recharge', 'pages/helpCenter', 'pages/commonService', 'pages/cloundAd', 'pages/cloundNews', 'pages/cloundSEM', 'pages/companyQA', 'pages/companyBK', 'pages/shortVideo', 'pages/newsWebView'
'pages/index', 'pages/news', 'pages/userCenter', 'pages/newsWebView', 'pages/userLogin', 'pages/companyInfo', 'pages/personalInfo'
],
window: {
backgroundTextStyle: 'light',
navigationBarBackgroundColor: '#fff',
navigationBarTitleText: 'WeChat',
navigationBarTextStyle: 'black'
},
tabBar: {
list: [{
pagePath: 'pages/index',
text: '首wepy',
iconPath: 'images/bar1a.png',
selectedIconPath: 'images/bar1b.png'
},
{
pagePath: 'pages/news',
text: '资讯',
iconPath: 'images/bar2a.png',
selectedIconPath: 'images/bar2b.png'
},
{
pagePath: 'pages/userCenter',
text: '我的',
iconPath: 'images/bar3a.png',
selectedIconPath: 'images/bar3b.png'
}
]
}
}
customData = {
common: {
apiUrl: 'http://api.dev.com:8000/',
imgUrlMP: 'http://blackhole.dev.com/images/',
imgUrlBiz: 'http://api.dev.com:8000/',
dataEyePath: 'http://blackhole.dev.com:50000',
localImgPath: 'http://blackhole.dev.com/images/'
}
}
globalData = {
userInfo: null
}
constructor() {
super()
this.use('requestfix')
this.use('promisify')
}
networkStatusChangeLog() {
const log = new Date().toUTCString() + 'BizInfo' + 'uploadWhenOk'
wx.setStorageSync('onNetworkStatusChangeLog', log)
}
onLaunch() {
const updateManager = wx.getUpdateManager()
updateManager.onCheckForUpdate(function(res) {
// 请求完新版本信息的回调
console.log(res)
console.log(res.hasUpdate)
})
updateManager.onUpdateReady(function() {
wx.showModal({
title: '更新提示',
content: '新版本已经准备好，是否重启应用？',
success: function(res) {
if (res.confirm) {
// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
updateManager.applyUpdate()
}
}
})
})
updateManager.onUpdateFailed(function() {
// 新的版本下载失败
})
let that = this
wx.onNetworkStatusChange(function(res) {
that.networkStatusChangeLog()
wx.setStorageSync('onNetworkStatusChange', res)
if (!res.isConnected) {
wx.showToast({
title: '无网络',
icon: 'loading',
duration: 2000
})
}
})
}
sleep(s) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve('promise resolved')
}, s * 1000)
})
}
async testAsync() {
const data = await this.sleep(3)
console.log(data)
}
getUserInfo(cb) {
const that = this
if (this.globalData.userInfo) {
return this.globalData.userInfo
}
wepy.getUserInfo({
success(res) {
that.globalData.userInfo = res.userInfo
cb && cb(res.userInfo)
}
})
}
onShareAppMessage(title = 'MBC') {
return {
title: title,
success: function(res) {},
fail: function(res) {}
}
}
}
</script>
D:\GPUGO\MP\wepy\mpBMCwepy\src\utils\wxRequest.js
import wepy from 'wepy'
import util from './util'
import md5 from './md5'
// import tip from './tip'
const appendInfo = () => {
const API_SECRET_KEY = 'https://github.com/dyq086/wepy-mall/tree/master/src'
const TIMESTAMP = util.getCurrentTime()
const SIGN = md5.hex_md5((TIMESTAMP + API_SECRET_KEY).toLowerCase())
const MORE = 'more......'
return {
'API_SECRET_KEY': API_SECRET_KEY,
'TIMESTAMP': TIMESTAMP,
'SIGN': SIGN,
'MORE': MORE
}
}
const wxRequest = async (params = {}, url) => {
console.log('wxRequest', params)
const c = wx.getStorageSync('onNetworkStatusChange')
if (!c.isConnected) {
wx.showToast({
title: '无网络',
icon: 'loading',
duration: 2000
})
return
}
// tip.loading()
let data = params.query || {}
const header = params.header || {}
const isAppend = params.isAppend || false
if (isAppend) {
const a = appendInfo()
for (let k in a) {
eval('data.' + k + '= a.' + k)
}
}
let res = await wepy.request({
url: url,
method: params.method || 'GET',
data: data,
header: header
})
// tip.loaded()
console.log('wxRequest', res)
return res
}
module.exports = {
wxRequest
}
globalData = {
userInfo: null,
onNetworkStatusChangeRes:{}
}
constructor() {
super()
this.use('requestfix')
this.use('promisify')
}
networkStatusChangeLog() {
const log = new Date().toUTCString() + 'BizInfo' + 'uploadWhenOk'
wx.setStorageSync('onNetworkStatusChangeLog', log)
}
onLaunch() {
const updateManager = wx.getUpdateManager()
updateManager.onCheckForUpdate(function(res) {
// 请求完新版本信息的回调
console.log(res)
console.log(res.hasUpdate)
})
updateManager.onUpdateReady(function() {
wx.showModal({
title: '更新提示',
content: '新版本已经准备好，是否重启应用？',
success: function(res) {
if (res.confirm) {
// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
updateManager.applyUpdate()
}
}
})
})
updateManager.onUpdateFailed(function() {
// 新的版本下载失败
})
let that = this
wx.onNetworkStatusChange(function(res) {
that.networkStatusChangeLog()
that.globalData.onNetworkStatusChangeRes=res
if (!res.isConnected) {
wx.showToast({
title: '无网络',
icon: 'loading',
duration: 2000
})
}
})
}
