情况是:
javascriptboomerang.js 用来测试客户端网速,问题是html内容是由浏览器执行的,没有等待boomerang结果。但是需要回飞镖结果,因为 html 内容有一些变化。
在boomernag.js 产生结果之前如何不执行html 内容?
编辑:经过少量谷歌搜索后,不可能阻止浏览器在 javascript 完成之前不加载 html 内容,因为回旋镖不会阻止此内容,即使我们在 BOOMR.init 中设置 autorun: false 并通过 BOOMR.page_ready() 调用它;在任何地方。它是原生 javascript 异步行为。
所以我们不能使用以下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel='stylesheet' type='text/css' media='all' href='css/style.css' />
<link rel='stylesheet' type='text/css' media='all' href='css/colorbox.css' />
<script type="text/javascript" src="js/speedtest/boomerang.min.js"></script>
<script>
BOOMR.init({ beacon_url: "http://www.zzz.xx", user_ip: '10.0.0.1', site_domain: "http://www.zzz.xx", BW: { nruns: 3, base_url: 'http://www.zzz.xx/test_images/', cookie: 'SPEED-test'}});
</script>
<script type="text/javascript" src="js/preload.js"></script>
preload.js 只是检查cookies,如果存在就不要再做测试,如果没有,通过BOOMR.subscribe 运行speedtest
function getCookie(cname)
{
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
var c = ca[i].trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return "";
}
var version_set=getCookie("speedtest_version_set");
if (version_set == "low"){
$(document).ready(website_init_low);
} else if (version_set == "high"){
$(document).ready(website_init_high);
} else {
BOOMR.subscribe('before_beacon', function(o) {
if(o.bw) {
netspeed = Math.abs(parseInt(o.bw*8/1024));
var netspeed_limit = 5000;
if (netspeed < netspeed_limit) {
document.cookie="speedtest_version_set = low";
$(document).ready(website_init_low);
} else {
document.cookie="speedtest_version_set = high";
$(document).ready(website_init_high);
}
}
});
}
我们唯一能做的就是制作单独的 index.php 文件,然后调用 index_low.html 或 index_high.html,如下所示:
<?php
echo "<script type='text/javascript' src='js/speedtest/boomerang.min.js'></script>";
echo "<script type='text/javascript' src='js/speedtest/bw.js'></script>";
echo "<script type='text/javascript'>BOOMR.init({ beacon_url: 'xxx', user_ip: '10.0.0.1', site_domain: 'xxxxxx', autorun: false, BW: { nruns: 3, base_url: 'js/speedtest/test_images/', cookie: 'xxxxx'}})</script>";
echo "<script type='text/javascript'>
function getCookie(cname) //read cookie by javascript
{
var name = cname + '=';
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
if(typeof String.prototype.trim !== 'function') { //IE bug fix -IE not support trim();
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, '');
}
}
var c = ca[i].trim(); //IE bug fix -IE not support trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return '';
}
var netspeed;
var netspeed_limit = 5000;
var version_set=getCookie('speedtest_version_set');
if (version_set == 'low'){
window.location = 'index_low.html'
} else if (version_set == 'high'){
window.location = 'index_hight.html'
} else{
BOOMR.page_ready(); //fire BOOMR only from this place
BOOMR.subscribe('before_beacon', function(o) {
if(o.bw) {
netspeed = Math.abs(parseInt(o.bw*8/1024));
if (netspeed < netspeed_limit) {
document.cookie='speedtest_version_set = low';
window.location = 'index_low.html'
} else {
document.cookie='speedtest_version_set = high';
window.location = 'index_high.html'
}
}
});
}
</script>";
?>
当然更好的是通过 PHP 中的 $_COOKIE 变量而不是 javascript 来检查 cookie。