• 重定向


    重定向原理

    HTTP 协议的重定向响应的状态码为 3xx 。浏览器在接收到重定向响应的时候,会采用该响应提供的新的 URL ,并立即进行加载;大多数情况下,除了会有一小部分性能损失之外,重定向操作对于用户来说是不可见的。
    不同类型的重定向映射可以划分为三个类别:永久重定向临时重定向特殊重定向

    重定向的目的

    1、相似域名

    浏览者可能输入错误的域名,如:gooogle.com或googel.com。机构或团体不时会注册这些拼字不正确的网域名,重定向到正确地方:google.com。例如:example.com和example.net两者均会重定向至像是example.org的单一网域或网页。

    2、移动网站至新网域

    • 网站需要改变它的域名。
    • 作者移动他/她的网页至新域名。
    • 2个网站结合。

    3、重定向方式

    1、设定重定向映射
    • 300=Multiple Choices
    • 301=Moved Permanently
    • 302=Found
    • 303=See Other
    • 304=Not Modified
    • 305=Use Proxy
    • 306=(Unused)
    • 307=Temporary Redirect

    其中以301、302、307最为常见,301代表永久转址,对于搜索引擎判定页面改变有直接影响,302代表暂时转址,通常用于页面暂时修改,之后会在恢复网址时使用。在搜索引擎优化上,将错误的302转址改成301转址对网站排名有相当作用。

    2、借助 HTML 的 meta 元素的 HTML 重定向机制

    栗子:

    <head> 
      <meta http-equiv="refresh" content="0;URL=http://www.example.com/" />
    </head>
    
    • 1
    • 2
    • 3

    content 属性的值开头是一个数字,指示浏览器在等待该数字表示的秒数之后再进行跳转。建议始终将其设置为 0 来获取更好的可访问性

    显然,该方法仅适用于 HTML 页面(或类似的页面),然而并不能应用于图片或者其他类型的内容。

    注意这种机制会使浏览器的回退按钮失效:可以返回含有这个头部的页面,但是又会立即跳转。

    3、借助 DOM 的 JavaScript 重定向机制
    window.location = "http://www.example.com/";
    
    • 1

    与 HTML 重定向机制类似,这种方式并不适用于所有类型的资源,并且显然只有在支持 JavaScript的客户端上才能使用。另外一方面,它也提供了更多的可能性,比如在只有满足了特定的条件的情况下才可以触发重定向机制的场景。

    三种重定向方法的优先级

    由于存在上述三种 URL 重定向机制,那么在多种方法同时设定的情况下,哪种方法会首先起作用呢?优先级顺序如下:

    1、HTTP 协议的重定向机制永远最先触发,即便是在没有传送任何页面——也就没有页面被(客户端)读取——的情况下。

    2、HTML 的重定向机制 () 会在 HTTP 协议重定向机制未设置的情况下触发。
    3、JavaScript 的重定向机制总是作为最后诉诸的手段,并且只有在客户端开启了 JavaScript 的情况下才起作用。

    任何情况下,只要有可能,就应该采用 HTTP 协议的重定向机制,而不要使用 meta 标签。假如开发人员修改了 HTTP 重定向映射而忘记修改 HTML 页面的重定向映射,那么二者就会不一致,最终结果或者出现无限循环,或者导致其他噩梦的发生。

    重定向的应用场景

    有以下几种应用场景可以使用重定向机制,但是需要注意应该尽可能地限制其使用数量,因为每一次重定向都会带来性能上的开销。

    在以下几种情况下可以使用域名别称:

    1、扩大站点的用户覆盖面。一个常见的场景是,假如站点位于 www.example.com 域名下,那么通过 example.com 也应该可以访问到。这种情况下,可以建立从 example.com 的页面到 www.example.com 的重定向映射。此外还可以提供常见的同义词,或者该域名容易导致的拼写错误的域名别称。

    2、迁移到另外一个域名。例如,公司改名后,你希望用户在搜索旧名称的时候,依然可以访问到应用了新名称的站点。

    3、强制使用 HTTPS 协议。对于 HTTP 版本站点的请求会被重定向至采用了 HTTPS 协议的版本。

    4、对于耗时请求的临时响应:一些请求的处理会需要比较长的时间,比如有时候 DELETE 请求会被安排为稍后处理。在这种情况下,会返回一个 303 (See Other) 重定向响应,该响应链接到一个页面,表示请求的操作已经被列入计划,并且最终会通知用户操作的进展情况,或者允许用户将其取消。

    5、对于不安全请求的临时请求:不安全(Unsafe)请求会修改服务器端的状态,应该避免用户无意的重复操作。一般地,你并不想要你的用户重复发送 PUT、POST 或 DELETE 请求。假如你仅仅为该类请求返回响应的话,简单地点击刷新按钮就会(可能会有一个确认信息)导致请求的重复发送。

    在这种情况下,服务器可以返回一个 303 (See Other) 响应,其中含有合适的响应信息。如果刷新按钮被点击的话,只会导致该页面被刷新,而不会重复提交不安全的请求。

    在通用服务器中配置重定向

    apache
    重定向映射可以在服务器的配置文件中设置,也可以在每一个文件目录的 .htaccess 文件中设置。

    mod_alias 模块提供了 Redirect 和 Redirect_Match 两种指令来设置 302 响应(默认值):

    <VirtualHost *:80>
    	ServerName example.com
    	Redirect / http://www.example.com
    </VirtualHost>
    
    • 1
    • 2
    • 3
    • 4

    URL http://example.com/ 会被重定向至 http://www.example.com/ (而不是http://example.com/other.html )。

    Redirect_Match 指令的功能与之类似,不同之处在于它可以通过正则表达式来指定一批受影响的 URL :

    RedirectMatch ^/images/(.*)$ http://images.example.com/$1
    
    • 1

    位于 images/ 文件夹下的所有文档都会被重定向至新的域名。

    如果你不想要设置临时跳转,那么可是使用额外的参数(使用 HTTP 状态码或者 permanent 关键字)来进行设置:

    Redirect permanent / http://www.example.com
    Redirect 301 / http://www.example.com
    
    • 1
    • 2

    mod_rewrite 模块也可以用来设置重定向映射。它应用起来更灵活,但也更加复杂。

    nginx
    在 Nginx 中,你可以创建一个服务器模块来进行重定向设置:

    server {

    	listen 80;
    	server_name example.com;
    	return 301 $scheme://www.example.com$request_uri;
    }
    
    • 1
    • 2
    • 3
    • 4

    可以使用 rewrite 指令来针对一个文件目录或者一部分页面应用重定向设置:

    rewrite ^/images/(.*)$ http://images.example.com/$1 redirect;
    rewrite ^/images/(.*)$ http://images.example.com/$1 permanent;
    
    • 1
    • 2

    IIS
    在 IIS 中,你可以使用 元素来配置重定向映射

    重定向循环

    当后续的重定向路径重复之前的路径的时候,重定向循环就产生了。换句话说,就是陷入了无限循环当中,不会有一个最终的页面返回。

    大多数情况下,这属于服务器端错误。如果服务器检测不到,就会返回 500 Internal Server Error 。假如你在修改了服务器配置不久就出现了这个问题,八成是遇到了重定向循环。

    有时候,服务器端无法对其进行检测:重定向循环发生于多台服务器之间,对于每一台服务器来说,都无法获得一个全景图。在这种情况下,浏览器会负责进行检测,然后返回错误信息。

  • 相关阅读:
    jQuerychicun
    css3动画
    app开发,H5+CSS3页面布局小tips
    函数基础
    函数
    冒泡排序
    关于Vue+iview的前端简单的导入数据(excel)
    关于Vue+iview的简单下拉框滚动加载
    ES6中set的用法回顾
    百度地图api设置点的自定义图标不显示
  • 原文地址:https://www.cnblogs.com/weihanhan/p/10978499.html
Copyright © 2020-2023  润新知