1. 首页
  2. css

CSS如何重定向网页

重定向是指当某个网页在某个URL上被访问时,它会更改为另一个URL。例如,一个人网址:www.com/page-在他们的浏览器中,他们被重定向到网址:www.com/page-b\”代替。如果我们想将某个页面重定向到一个新位置,更改网站的URL结构,删除URL中的\”www.\”部分,甚至将用户完全重定向到另一个网站(仅举几个例子)。
假设我们刚刚移动了网站,我们想关闭旧网站。但是,我们不希望所有这些旧网站的页面都出现可怕的404 Not Found。我们需要的是将那些旧链接重定向到新网站上的相同内容。
下面是我们的示例:我们希望old-website.com/blog/post重定向到new-website.com/blog/post,以及使用相同URL格式的所有其他帖子。另外,如果我们的重定向会向搜索引擎报告此更改是永久性的,那么他们应该相应地进行更新,那就太好了。
那么我们该怎么做呢?嗯,在开始之前,我们需要先了解一下HTTP。HTTP响应代码
每次输入URL或从浏览器发出请求时,我们都使用超文本传输协议(HTTP)。虽然这听起来像科幻警察电影的一个很酷的名字,但实际上是我们从服务器请求资产(如CSS、HTML和图像)的过程。在我们发出请求后,这些资产会给出一个类似\”嘿,我在这里,我们走吧!\”(响应代码HTTP 200 OK)。有许多不同类型的HTTP响应代码,最常见的可能是404 Not Found;网页可以响应404状态,但我们请求的任何其他资产(无论是图像还是任何其他类型的资产)也可以响应404状态。
每个HTTP响应都分类在特定的三位数下,因此404 Not Found是一个4XX状态码说明这是一个客户端错误,200在2XX类别中表示这是某种成功消息。我们对3XX类的HTTP响应感兴趣,比如永久移动的301或找到的302,因为这些是专门为重定向设置的状态码。根据我们选择的方法,我们不一定需要了解这些代码,但对于其他代码来说,这是必不可少的。
在我们的例子中,我们将使用301重定向,因为某些web浏览器或代理服务器将缓存此类型,使旧页无法访问,在这种情况下,这正是我们想要的。
那么,我们实际上如何重定向网页呢?HTML重定向
也许重定向到另一个URL的最简单方法是使用Meta Refresh标记。我们可以把这个meta标记放在任何HTML页面顶部的中,如下所示:

The content属性是浏览器重定向到新页面之前的延迟,因此这里我们将它设置为0秒。请注意,我们不需要设置HTTP状态码,但仔细检查上面引号的奇怪开头和结尾很重要(引号中有引号,因此它们需要不同的类型和匹配)。
虽然这种方法是重定向到网页的最简单方法,但也有一些缺点。根据W3C的说法,有些浏览器会使用Meta-refresh标签。用户可能会看到一个flash,因为页面a在被重定向到页面B之前被加载。它还禁用了旧浏览器上的back按钮。这不是一个理想的解决方案,而且根本不鼓励使用它。
一个更安全的选择可能是用JavaScript重定向网站。JavaScript重定向
用JavaScript重定向到另一个URL非常简单,我们只需更改window对象的location属性:
JavaScript is weird though, there are LOTS of ways to do this.

CSS如何重定向网页 为WP2原创文章,链接:https://www.wp2.cn/css/css%e5%a6%82%e4%bd%95%e9%87%8d%e5%ae%9a%e5%90%91%e7%bd%91%e9%a1%b5/