使用 phonegap 检查移动应用程序中的互联网连接
Posted
技术标签:
【中文标题】使用 phonegap 检查移动应用程序中的互联网连接【英文标题】：Check internet connectivity in mobile application using phonegap 【发布时间】：2019-08-30 09:31:15 【问题描述】：在 phonegap 中创建移动应用程序时，我想显示一条关于互联网连接为在线/离线的警报消息。但我没有收到警报消息。我用过
cordova-plugin-network-信息
在我的 js 文件中使用下面的代码插件
<script type="text/javascript">
var networkState = navigator.connection.type;
var states = ;
states[Connection.UNKNOWN] = 'Unknown connection';
states[Connection.ETHERNET] = 'Ethernet connection';
states[Connection.WIFI] = 'WiFi connection';
states[Connection.CELL_2G] = 'Cell 2G connection';
states[Connection.CELL_3G] = 'Cell 3G connection';
states[Connection.CELL_4G] = 'Cell 4G connection';
states[Connection.CELL] = 'Cell generic connection';
states[Connection.NONE] = 'No network connection';
alert('Connection type: ' + states[networkState]); </script>
谁能帮我解决一下？
【问题讨论】：
【参考方案1】：首先添加以下 Cordova 插件：
cordova plugin add cordova-plugin-network-information
cordova plugin add cordova-plugin-dialogs
在脚本文件下方添加：
jquery.mobile-1.4.0.css jquery-1.10.2.min.jscordova.js
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" name="viewport"
content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="css/jquery.mobile-1.4.0.css" />
<script src="cordova.js"></script>
<script type="text/javascript" src="js/jquery-1.10.2.min.js">
</script>
<script>
$(document).ready(function ()
document.addEventListener("deviceready", onDeviceReady, false);
document.addEventListener("online", onOnline, false);
document.addEventListener("offline", onOffline, false);
function onDeviceReady()
console.log(" ready");
function onOnline()
console.log("connected");
function onOffline()
debugger;
console.log("lost connection");
navigator.notification.alert(
'Please Check your internet connection.', // message
null, // callback
'Sample', // title
'OK' // buttonName
);
);
</script>
</head>
<body>
<p style="top:100px;"> Sample</p>
</body>
</html>
输出： 更多详情请点击Here..!
【讨论】：
我尝试了上面的代码，但它也不起作用。它不显示任何警报消息 我添加了上面的代码，但是没有用。用户离线时不显示任何消息【参考方案2】：在添加上述代码之前，您必须确保该文档已加载。在你的 HTML 中做这样的事情：
<body onload="onLoad">
并在您的脚本/JS 文件中执行以下操作：
function onLoad()
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady()
//call your internet connectivity code here...
【讨论】：
我试过上面的代码，但它不起作用。它不显示任何警报消息以上是关于使用 phonegap 检查移动应用程序中的互联网连接的主要内容，如果未能解决你的问题，请参考以下文章
桌面/移动标准网页中的phonegap / cordova社交共享插件
小白学phoneGap《构建跨平台APP：phoneGap移动应用实战》连载一（PhoneGap中的API）