mui技术点01.手机网络连接的判断


# 问题说明

手机未连接网络,app访问后台接口时出现错误。

# 解决方案

每个画面初始时,判断网络是否连接,网络如果处于断网阶段,弹出窗口信息直接退出app,或者画面显示[未联网]消息提示,提示用户刷新网络(比如:点击刷新按钮,或者下拉等操作)。

# 详细代码

## 直接退出app

1. 检测是否连接网络

//mui检测是否连接网络
function getSysInfo() {
	//  var str = "";
	//  str += "名称:" + plus.os.name + "\n";
	//  str += "版本:" + plus.os.version + "\n";
	//  str += "语言:" + plus.os.language + "\n";
	//  str += "厂商:" + plus.os.vendor + "\n";
	//  str += "网络类型:";

	types = {};
	types[plus.networkinfo.CONNECTION_UNKNOW] = "未知";
	types[plus.networkinfo.CONNECTION_NONE] = "未连接网络";
	types[plus.networkinfo.CONNECTION_ETHERNET] = "有线网络";
	types[plus.networkinfo.CONNECTION_WIFI] = "WiFi网络";
	types[plus.networkinfo.CONNECTION_CELL2G] = "2G蜂窝网络";
	types[plus.networkinfo.CONNECTION_CELL3G] = "3G蜂窝网络";
	types[plus.networkinfo.CONNECTION_CELL4G] = "4G蜂窝网络";

	var str = types[plus.networkinfo.getCurrentType()];
	if (str == '未知' || str == '未连接网络') {
		return false;
	} else {
		return true;
	}

}

2. 调用及处理

mui.plusReady(function() {

	//如果未连接网络,退出app(针对mui框架)
	if (!(getSysInfo())) {
		alert('网络连接失败,请退出并重置网络!');
		plus.runtime.quit();//退出app(针对mui框架)
		return;
	}
});

## 画面显示提示按钮,让用户手动刷新

1. 点击按钮,进行画面刷新

 详细代码




	
	
	网络未连接
	
	



	

按钮点击刷新

2. 下划画面刷新

详细代码




	
	
	网络未连接
	
	



	

画面下拉刷新

## 注意

1. 内置浏览器技术实现,但手机上未必实现,调研的结果在手机上验证之后,在进行项目代码合并。

2. 关于下拉刷新详细的参数,请参照官网的文档说明:https://dev.dcloud.net.cn/mui/pulldown/