巧妙利用图片IMG的onerror事件,对付网通电信的南北分家

  背景:
我国电信网通南北分家已经成为了一种不可改变的现状,做网站的朋友都知道,如果想让南北方地朋友们都能够顺利地访问我们的网站,需要买双线服务器,就是既通网通用户又通电信用户的线路,尽管如此有的机房在提供双线服务器的时候会提供两个 IP 地址(网通和电信分别有一个 IP );这时候我们就需要在域名映射的时候映射一个电信地址,一个网通地址,例如: dianxin.xxx.com;wangtong.xxx.com; 可是用户访问的时候总是希望访问 www.xxx.com ,就是说我们需要在用户访问 www.xxx.com  的时候智能的判断出用户在北方还是在南方,然后进行跳转。

思路:
我们在www.xxx.com 中让客户端同时向地址 dianxin.xxx.com 和 wangtong.xxx.com 发出一个错误的请求,哪一个地址返回错误的响应速度快就说明用户应该访问那个地址。

关键代码:
<img src="http://dianxin.xxx.com/NotExistsUrl" width="1" height="1"
   οnerrοr="location.top.url='http://dianxin.xxx.com/'"/>
<img src="http://wangtong.xxx.com/NotExistsUrl"  width="1" height="1"
   οnerrοr="location.top.url='http://wangtong.xxx.com/'"/>

为了在用户下次访问的时候可以直接跳转到比较快的线路上我们可以将这一次判断的结果保存到 cookie 中。

IMG onerror 事件的另一个用武之地:
我们都不希望用户看到我们网站上面出现无效的图片,即便是出现了无效的图片我们也希望以一种友好的方式告诉用户图片无效,而不是直接给用户看默认的红叉;怎么办,我们可以在图片的 onerror 事件中将图片的 src 属性设置为我们网站上已存在的表示图片不存在的图片。
代码示例:
<img src="http://www.xxx.com/someImage.gif
   οnerrοr="this.src='http://www.xxx.com/invlid.gif'"/>

说明:
关于南北分家的解决方案有很多种,本文只是为大家提供一种思路。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值