【如何高性能建站】- 避免使用重定向(1)

 

重定向：

就是从一个URL到另一个URL，它会使你的页面变慢。重定向有很多种，“301 Moved Permancenty”和“302 Moved Temporarily”是最常用的两种。

301：

用户请求的文档在其他的地方，新的URL在Location中给出，浏览器自动访问新的URL。，并且是永久性转移。

302：

搜索引擎返回302错误表示被请求的资源暂时转移(Moved temporatily)，然后会给出一个转移后的URL，而浏览器在处理服务器返回的302错误时，原则上会重新建立一个TCP连接，然后再取重定向后的URL的页面；但是如果页面存在于缓存中，则不重新获取。（存在滥用情况）

 

扩展：

301重定向是一种非常重要的自动转向技术。在更换域名的时候起着不可替代的作用，他不仅可以实现网页的批量指定转跳，还可促进搜索引擎优化效果。不同于302，从搜索引擎优化角度出发，301重定向是网址重定向最为可行的一种办法。当网站的域名发生变更后，搜索引擎只对新网址进行索引，同时又会把旧地址下原有的外部链接如数转移到新地址下，从而不会让网站的排名因为网址变更而受到丝毫影响。当然各个搜索引擎对301的处理方式是不一样的。

 

302的三大危害：

一：黑帽SEO滥用

　　302重定向代表着暂时性转移，程序员设计一段代码，使点击访问的目标网址出现在黑帽SEO所要优化的网址之内，形成一段由“优化网址+目标网址”组合而成的302网址，藉此接获用户点击，骗取网页权重。目前，302重定向已经被视为垃圾信息，遭到各大搜索引擎的打击。

 

二：消耗优化网址资源

 302重定向的排列组合,有些站长使用302重定向并不是为了欺骗搜索引擎，仅仅是为了防止自己网站的通过外部链接流向其他权重。这种302重定向很容易遭到恶意访问，访问者将“优化网址”与任意网址甚至是一段字符串组合，滥用网站本身的302重定向功能消耗服务器资源，返回大量的302、404代码，影响网站的稳定性。

 

三：跨站脚本攻击

 跨站脚本攻击漏洞,根据网站安全监测工具的报告，这种302重定向实际上是一种跨站脚本攻击漏洞，恶意用户可以使用该漏洞来盗取用户账户信息、模拟其他用户身份登录，更甚至可以修改网页呈现给其他用户的内容。极大的妨害了网络安全和用户体验。

 

除了301到302，还有其他方法实现重定向。HTML文档的头中包含的meta refresh标签可以在content属性所指定的秒数之后重定向到url属性的地址。就是的document.location可以设置。但是如果必须采用重定向，作者推荐使用标准的3**HTTP状态码，这主要是为了确保后退按钮可以正常工作。

 

重定向是如何损伤性能的

如果第一个请求就是重定向，在重定向完毕并且HTML文档下载完毕之前，是没有任何东西显示给用户的，就像js和css引起的白屏一样。在用户和HTML之间插入的重定向延迟了延迟了页面中的所有东西。

 

为什么使用重定向

用处：网站重新设计，跟踪流量，记录广告点击，建立已于记忆的url。

 

 

下面是一些使用重定向的典型解决方案：
1.缺少结尾的斜线：我们在请求http://www.taoche.com/buycar时会引起重定向url变为http://www.taoche.com/buycar/ (多了一个杠)，这是一种最为浪费，发生也最为频繁的重定向。原因是：它允许自动索引（autoindexing，自动转到默认的index.html上）并且能够获得与当前目录相关的URL（如logo.gif）然而，很多流行的web页面并不依赖于自动索引，而是依赖特定的URL和处理器。另外，URL通常也与根目录相关而不是和当前目录相关。

注意当主机名后缺少皆为斜线时是不会发生重定向的，例如http://www.xxx.com不会产生重定向，但是也会加上斜杠http://www.xxx.com/。原因是，浏览区在进行GET请求时必须指定一些路径，如果没有路径，就会简单的使用文档根（/）。

2.连接网站：当我们改变网站后端逻辑的时候，很可能所需的url也变了，这时候就需要将用户从旧的url转移到新的url，这个时候我们往往使用最多的也是重定向。我们应该尽量去避免。如果整合两个后端可以避免，但是需要更多的开发工作。
3.跟踪站内流量：使用Referer日志，referrer网站来路；访问者进入网站任何途径。HTTP Referer是header的一部分，当浏览器向web服务器发出请求的时候，一般会带上Referer,告诉服务器用户从那个页面连接过来的，服务器藉此可以获得一些信息用于处理。

4.跟踪出站流量：跟踪出站流量的时候不能使用使用referrer。我们打开百度，搜索一个关键词，连到其他网站，发现就会有一次重定向。但是重定向是耗费性能的，所以我们看雅虎搜索http://www.yahoo.cn/，相同的操作并没有重定向，雅虎使用的是信标，信标（beacon）：

可以在HTTP请求的URL中包含跟踪信息。跟踪信息可以从信标web服务器的访问日志中提取出来。信标响应通常是一个1px*1px的透明图片。书中还提到一个更为优秀的204响应，因为他更小，从来不会被缓存，而且绝不会改变浏览器的状态。但是我没有查到相关的资料。

在雅虎搜索中，目标是无论任何用户单击搜索结果连接时都要发送一个信标，在通过为这个连接提供的onclick处理器来完成。

注意，发送信标和页面自身卸载之间存在竟态情形，图片信标的onload处理器可以确保在卸载文档之前信标传送完毕。

代码实例：

 

<ahrefahref="http://en.wikipedia.org/wiki/Performance"

   onclick="resultBeacon(this);return false;">Performance - Wikipedia</a>

<ahref="http://en.wikipedia.org/wiki/Performance"

   onclick="resultBeacon(this);return false;">Performance - Wikipedia</a>

 

<script>

var beacon;

function resultBeacon(anchor){

    beacon = new Image();

   beacon.onload = gotoUrl;

   beacon.onerror = gotoUrl;  // in case the image fails, we still want to redirect theuser

     beacon.anchor= anchor;

    beacon.src ="http://rds.yahoo.com/?url=" +escape(anchor.href);

}
function gotoUrl() {

   document.location = beacon.anchor.href;

}

</script>

<script>

var beacon;

function resultBeacon(anchor){

    beacon = new Image();

   beacon.onload = gotoUrl;

   beacon.onerror = gotoUrl;  // in case the image fails, we still want to redirect theuser

     beacon.anchor= anchor;

    beacon.src ="http://rds.yahoo.com/?url=" +escape(anchor.href);

}

 

function gotoUrl() {

   document.location = beacon.anchor.href;

}

</script>

 

这样的写法可能会和使用重定向一样慢，因为两种技巧都必须一个额外的HTTP请求。稳重还提到一种XMLHttpRequest来发送信标，非常的复杂，就不说了。说到这里，可能会觉得信标无用，但是对于有target=”_bank”属性的连接而言，信标能很好的工作，因为这种情下不会出现竟态情形，简单的信标就能很好的工作，弹出新的页面或者弹出式广告不回卸载前文档，图片信标的请求能够顺利完成而不会被中断，雅虎搜索就是这个道理。

5.美化url：

有的时候某个url很复杂，不利用用户去输入，我们就提供一个友好的url来给用户，这个时候也会发生重定向。我们也是用了url的重写,使用的是ISAPI_REWRITE，URL重写组件。