Posted in Javascript onMarch 13, 2011
当然,在请求时无法统计HTTP头部的长度,所以当请求数据包长度在最大传输单元临界点时,额外的HTTP头可以导致IP分组,因此存在一定的误差.(2009/6/21)
在线演示:http://demo.3water.com/js/2011/ping/
核心代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>HTTP Ping</title> <style> html { height: 100%; overflow: hidden; } body { background: #000; color: #C0C0C0; font-weight: bold; font-size: 14px; font-family: Lucida Console; height: 100%; margin: 0 0 0 5px; } #divContent { height: 90%; overflow: auto; } #txtTimeout { width: 40px; } button { margin-left: 10px; } </style> </head> <body> <div id="divInput"> <span>URL:</span> <input id="txtURL" type="text" /> <span>Timeout:</span> <input id="txtTimeout" type="text" value="2000" /> <input id="btnSwitch" type="button" value="Start" onclick="handleBtnClick()" /> <hr/> </div> <div id="divContent"></div> <script> var intStartTime; var objIMG = new Image(); objIMG.onload = objIMG.onerror = function() { /* * 有回应,取消超时计时 */ clearTimeout(intTimerID); if(!bolIsRunning || bolIsTimeout) return; var delay = new Date() - intStartTime; println("Reply from " + strURL + " time" + ((delay<1)?("<1"):("="+delay)) + "ms"); arrDelays.push(delay); /* * 每次请求间隔限制在1秒以上 */ setTimeout(ping, delay<1000?(1000-delay):1000); } function ping() { /* * 发送请求 */ intStartTime = +new Date(); intSent++; objIMG.src = strURL + "/" + intStartTime; bolIsTimeout = false; /* * 超时计时 */ intTimerID = setTimeout(timeout, intTimeout); } function timeout() { if(!bolIsRunning) return; bolIsTimeout = true; objIMG.src = "X:\\"; println("Request timed out."); ping(); } </script> <script> var $ = function(v){return document.getElementById(v)}; var arrDelays = []; var intSent; var bolIsRunning = false; var bolIsTimeout; var strURL; var intTimeout; var intTimerID; var objBtn = $("btnSwitch"); var objContent = $("divContent"); var objTxtURL = $("txtURL"); objTxtURL.value = window.location.host; function handleBtnClick() { if(bolIsRunning) { /* * 停止 */ var intRecv = arrDelays.length; var intLost = intSent-intRecv; var sum = 0; for(var i=0; i<intRecv; i++) sum += arrDelays[i]; objBtn.value = "Start"; bolIsRunning = false; /* * 统计结果 */ println(" "); println("Ping statistics for " + strURL + ":"); println("Packets: Sent = " + intSent + ", Received = " + intRecv + ", Lost = " + intLost + " (" + Math.floor(intLost / intSent * 100) + "% loss),"); if(intRecv == 0) return; println("Approximate round trip times in milli-seconds:"); println(" Minimum = " + Math.min.apply(this, arrDelays) + "ms, Maximum = " + Math.max.apply(this, arrDelays) + "ms, Average = " + Math.floor(sum/intRecv) + "ms"); } else { /* * 开始 */ strURL = objTxtURL.value; if(strURL.length == 0) return; if(strURL.substring(0,7).toLowerCase() != "http://") strURL = "http://" + strURL; intTimeout = parseInt($("txtTimeout").value, 10); if(isNaN(intTimeout)) intTimeout = 2000; if(intTimeout < 1000) intTimeout = 1000; objBtn.value = "Stop "; bolIsRunning = true; arrDelays = []; intSent = 0; cls(); println("Pinging " + strURL + ":"); println(" "); ping(); } } function println(str) { var objDIV = document.createElement("div"); if(objDIV.innerText != null) objDIV.innerText = str; else objDIV.textContent = str; objContent.appendChild(objDIV); objContent.scrollTop = objContent.scrollHeight; } function cls() { objContent.innerHTML = ""; } </script> </body> </html>
javascript模拟的Ping效果代码 (Web Ping)
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@