javascript判断机器是否联网的2种方法

在很多场景下，只有机器已经联网以后，web应用才能启动。如果没有联网，就会提示错误。、
但是机器有时候要重启。 如果机器重启后，立刻启动web应用的话，可能，机器上的网络服务还没有准备好。

特别是windows7，启动网络服务需要好几秒，这个时候怎么办呢？
之前尝试过几种方法：
比如 通过ping来判断， 但是ping需要有一个非本机的ip地址。 这个不是很通用
比如监控某个端口是否已经被占用，但是光端口占用，也不能说明网络已经启动了。
另一个方面，如果是web应用的话，最好是在前端判断，比如用javascript。
网上也有人写 javascript 的ping的模拟效果。但确实有些麻烦。
怎么办呢，关键的时候，还是html5能给出好的解决方法：

方法一：
navigator.onLine


代码如下:

if (navigator.onLine)
{ //正常工作}
else { //执行离线状态时的任务}

这个html5的 navigator的新特性可以很简单帮我们搞定
HTML5为此定义了一个navigator.onLine属性，这个属性值为true表示设备能上网，值为false表示设备离线。
当然不同的浏览器，对这个的支持还不太一样
IE6+和Safari 5+支持的比较好
Firefox 3+和支持navigator.onLine属性，但你必须手工选中菜单项“文件-Web开发人员（设置）-脱机工作”才能让浏览器正常的工作。
Chrome需要12以上。

方法二：
当然，如果想支持的更兼容，可以使用如下2个事件：online和offline。当网络从离线变为在线或者从在线变为离线时，分别触发这两个事件。这两个事件在window对象上触发。
为了检测应用是否离线，在页面加载后，最好先通过navigator.onLine取得初始的状态。然后，就是通过上述两个事件来确定网络连接状态是否变化。当上述事件触发式，navigator.onLine属性的值也会改变，不过必须要手工轮询这个属性才能检测到网络状态的变化。


代码如下:

var EventUtil = {
addHandler: function (element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent("on" + type, handler);
} else {
element["on" + type] = handler;
}
}
};
EventUtil.addHandler(window, "online", function () {
alert("Online");
});
EventUtil.addHandler(window, "offline", function () {
alert("Offline");
});

赞 (0)

相关推荐

  • javascript检测是否联网的实现代码

    最简单粗暴的方式就是加载网络资源,JS文件或者图片文件. 复制代码 代码如下: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> typeof window.jQuery === "undefined" // return false or ture 用jQuery变量来检测是否联网 function doConnectFun

  • Android sdcard实现图片存储 、联网下载

    本文实例介绍了sdcard存储图片下载简单操作,分享给大家供大家参考,具体内容如下 步骤 -- 在配置清单添加完联网权限后 1.res/layout界面布局 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_

  • 如何判断软件程序是否联网 联网状态提示信息Android实现

    如何判断软件程序是否联网 联网状态提示信息Android实现

    在项目中,经常需要判断是否有网络连接.最近学习了如何判断软件是否联网,如果没有联网,弹出提示信息,连接网络. 效果: (1)联网情况下: (2)不联网情况下: (3)点击"检测设置": 源码下载:http://xiazai.jb51.net/201605/yuanma/MyApplication(jb51.net).rar 判断我们的软件是否联网,看代码吧: /** * 检测网络连接 * * @param con * @return */ public boolean isNetwor

  • js实现双向链表互联网机顶盒实战应用实现

    上实战代码: linkedlistnode.js 节点类 复制代码 代码如下: /* * 链表节点 */ Dare.LinkedListNode = function () { this.data = null;//数据域 this.prev = null;//前驱 this.next = null;//后驱 }; Dare.extend(Dare.LinkedListNode, Dare); Dare.LinkedListNode.prototype.getValue = function (

  • android判断phonegap是否联网且加载super.loadUrl网址

    复制代码 代码如下: public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.setIntegerProperty("splashscreen", R.drawable.splash); ConnectivityManager cwjManager=(ConnectivityManager)getSystemService(Context.CONNECTIVI

  • 通过JS判断联网类型和连接状态的实现代码

    中国的移动网络环境复杂,为了给用户带去更好访问体验,开发者希望能了解用户当前的联网方式,然后给用户一个符合当前网络环境的请求结果. W3C的规范中给出了一个方法来获得现在的网络状态navigator.connection:根据Working Draft 29 November 2012协议规范我们可以从接口中获得bandwidth(带宽,M/s)和metered两个参数的值:还提供了一个监听方法,来时刻监听接入环境的变化情况.现实中我们发现很多浏览器并没有返回bandwidth值,而且遵守了Wo

  • Android互联网访问图片并在客户端显示的方法

    Android互联网访问图片并在客户端显示的方法

    本文实例讲述了Android互联网访问图片并在客户端显示的方法.分享给大家供大家参考,具体如下: 1.布局界面 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:

  • php银联网页支付实现方法

    本文实例讲述了php银联网页支付实现方法.分享给大家供大家参考.具体分析如下: 这里介绍的银联WAP支付功能,仅限消费功能. 1. PHP代码如下: 复制代码 代码如下: <?php namespace common\services; class UnionPay {     /**      * 支付配置      * @var array      */     public $config = [];     /**      * 支付参数,提交到银联对应接口的所有参数      * @

  • Android中判断手机是否联网实例

    本文实例讲述了Android中判断手机是否联网的方法,分享给大家供大家参考.具体步骤如下: 首先在AndroidManifest.xml中添加与连接网络相关的权限: 复制代码 代码如下: <uses-permission android:name="android.permission.INTERNET"></uses-permission>  <uses-permission android:name="android.permission.A

  • Android中判断是否联网实现代码

    下面的方法返回false表示网络不通 // 检测网络 public static boolean checkNetworkAvailable(Context context) { ConnectivityManager connectivity = (ConnectivityManager) context .getSystemService(Context.CONNECTIVITY_SERVICE); if (connectivity == null) { return false; } el

随机推荐