最近新版财付通正式上线了,需要将用户切换到新版来,即需要将旧版的首页实现自动跳转的功能;首先,让我们一起来了解下网页自动跳转的常用实现方式有哪些吧!

方法一:使用meta标签
Meta标签是html不可缺少的标签之一,是用来在HTML文档中模拟HTTP协议的响应头报文;当我们定义属性http-equiv为refresh时,打开此WEB页,浏览器将根据content规定的值在指定时间内跳转到相应页面,content=”秒数;url=网址”就是定义停留多长时间后,跳转到指定的网址;
示例:
以下的meta标签告诉浏览器,5秒钟后,页面将自动跳转到新版财付通:

<meta http-equiv="refresh" content="5;url=https://www.tenpay.com/v2/">

注意:
Meta元素只能在head元素使用;
Meta元素不会被渲染;
Meta元素不需要关闭标签;
方法二:使用javascript脚本
使用javascript跳转,有很多种实现方法,这里主要介绍window的location对象
1、location.href
例如:

<script type="text/javascript">
    window.location.href = 'http://www.tenpay.com/v2/';
</script>

2、location.replace
例如:

<script type="text/javascript">
    window.location.replace('http://www.tenpay.com/v2/');
</script>

方法三:301 / 302 重定向
301 / 302是一种http状态代码,当用户向网站服务器发送浏览请求时,由服务器端返回的一种状态代码;表示请求的页面被重定向到另一个地址;

Asp示例:

Response.Status = "301 Moved Permanently"
Response.AddHeader "Location", "网址”

Php示例:

header("HTTP/1.1 301 Moved Permanently");
header("Location: 网址");

Jsp示例:

response.setStatus(301);
response.setHeader("Location","网址");

下面对这三种实现方式做个对比:


从上表中可以看出,meta方式和javascript跳转方式会随浏览器平台不同,影响http请求头中的referer信息,这会给一些数据的统计带来误差;同时,脚本跳转的方式,除了location.replace外,其它的方式会“破坏”回退的功能,影响用户体验;所以对于这种新旧版切换的跳转,301重定向才是王道。