绝对URL与相对URL

12 回复 | 直到 6 年前

1

166

Daniel Vassallo 15 年前

一般来说,使用相对URL被认为是最佳实践,这样您的网站就不会绑定到当前部署它的基本URL。例如,它可以在本地主机以及您的公共域上工作,而无需修改。

2

189

Community chadoh 7 年前

我应该使用绝对或相对URL吗?

如果绝对URL是指包含方案(例如http/https)和主机名(例如yourdomain.com)的URL,则永远不会这样做(对于本地资源),因为维护和调试会很糟糕。

假设您在代码中的任何地方都使用了绝对URL,比如 <img src="http://yourdomain.com/images/example.png"> . 现在,当你打算:

切换到其他方案(例如http->https)
切换域名(test.yourdomain.com->yourdomain.com)

在第一个示例中,将发生的情况是,您将收到有关页上请求的不安全内容的警告。因为所有的URL都是硬编码以使用http(://yourdomain.com/images/example.png)。当通过HTTP运行页面时,浏览器希望通过HTTPS加载所有资源,以防止信息泄漏。

在第二个示例中,当将站点从测试环境中激活时,意味着所有资源仍指向测试域而不是活动域。

因此,要回答您关于是否使用绝对或相对URL的问题:始终使用相对URL(对于本地资源)。

不同的URL有什么区别?

首先,让我们看看我们可以使用哪些不同的URL:

http://yourdomain.com/images/example.png
//yourdomain.com/images/example.png
/images/example.png
images/example.png

这些URL尝试在服务器上访问哪些资源?

在下面的示例中,我假设网站是从服务器上的以下位置运行的 /var/www/mywebsite .

http://yourdomain.com/images/example.png

上述(绝对)URL尝试访问资源 /var/www/website/images/example.png .这种类型的URL是您需要的总是希望避免由于上述原因从您自己的网站请求资源。但它确实有自己的位置。例如,如果你有一个网站 http://yourdomain.com 并且您希望通过HTTP从外部域请求资源,您应该使用它。例如。 https://externalsite.com/path/to/image.png .

//yourdomain.com/images/example.png

此URL是基于当前使用的方案的相对URL,在包含外部资源(图像、javascripts等)时几乎应始终使用。

这种类型的URL所做的是使用其所在页面的当前方案。这意味着你在页面上 http://yourdomain.com网站 在那一页上有一个图像标签 <img src="//yourdomain.com/images/example.png"> 图像的URL将解析为 http://yourdomain.com/images/example.png .
你什么时候会出现在页面上? http**s**://yourdomain.com 在那一页上有一个图像标签 <img src=“//yourdomain.com/images/example.png”> 图像的URL将解析为 https://yourdomain.com/images/example.png .

这将防止在不需要时通过HTTPS加载资源,并在不需要时自动确保通过HTTPS请求资源是需要。

上述URL在服务器端的解析方式与前一个URL相同:

上述(绝对)URL尝试访问资源 /var/www/website/images/example.png .

/图片/example.png

对于本地资源,这是引用它们的首选方式。这是基于文档根目录的相对URL( /var/www/mywebsite/我的网站 )你的网站。这意味着当你 <img src="/images/example.png"> 会的。总是决心 /var/www/mywebsite/images/example.png .

如果在某个时候您决定切换域,它仍然可以工作,因为它是相对的。

图片/example.png

这也是一个相对的URL,尽管与前一个稍有不同。此URL相对于当前路径。这意味着它将根据您在站点中的位置解析为不同的路径。

例如,当您在页面上时 http://yourdomain.com网站 你用 <img src="images/example.png"> 它将在服务器上解析为 /var/www/mywebsite/images/example.png版本 但是,如果您在页面上 http://yourdomain.com/some/path 你使用的图像标签完全相同 /var/www/mywebsite/some/path/images/example.png .

什么时候用什么?

在请求外部资源时,您很可能希望使用与方案相关的URL(除非您希望强制使用其他方案),在处理本地资源时,您希望使用基于文档根的相对URL。

示例文档:

<!DOCTYPE html>
<html>
    <head>
        <title>Example</title>
        <link href='//fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700' rel='stylesheet' type='text/css'>
        <link href="/style/style.css" rel="stylesheet" type="text/css" media="screen"></style>
    </head>
    <body>
        <img src="/images/some/localimage.png" alt="">
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
    </body>
</html>

一些(有点)复制品

3

57

Erenor Paz 9 年前

看到这个: http://en.wikipedia.org/wiki/URI_scheme#Generic_syntax

foo://username:password@example.com:8042/over/there/index.dtb;type=animal?name=ferret#nose
\ /   \________________/\_________/ \__/            \___/ \_/ \_________/ \_________/ \__/
 |           |               |       |                |    |       |           |       |
 |       userinfo         hostname  port              |    |       parameter query  fragment
 |    \_______________________________/ \_____________|____|____________/
scheme                  |                               | |  |
 |                authority                           |path|
 |                                                    |    |
 |            path                       interpretable as filename
 |   ___________|____________                              |
/ \ /                        \                             |
urn:example:animal:ferret:nose               interpretable as extension

绝对URL包括“路径”部分之前的部分——换句话说,它包括方案(即 http 在里面 http://foo/bar/baz )和主机名 foo 在里面 网址:http://foo/bar/baz )(可选端口、用户信息和端口)。

相对URL以路径开头。

绝对URL是绝对的:资源的位置只能通过查看URL本身来解析。相对URL在某种意义上是不完整的:要解决它,您需要方案和主机名,这些通常是从当前上下文中获取的。例如,在网页中

http://myhost/mypath/myresource1.html

你可以放一个这样的链接

<a href="pages/page1">click me</a>

在 href 链接的属性,使用的相对URL,如果单击它,则必须对其进行解析,以便跟踪它。在这种情况下,当前上下文是

http://myhost/mypath/myresource1.html

因此,这些的模式、主机名和前导路径被采用并预先准备到 pages/page1 ,屈服

http://myhost/mypath/pages/page1

如果链接是:

<a href="/pages/page1">click me</a>

(注意 / 出现在URL的开头),那么它将被解析为

http://myhost/pages/page1

因为领导 / 指示主机的根目录。

在Web应用程序中,我建议对属于您的应用程序的所有资源使用相对URL。这样,如果您更改页面的位置,一切都将继续工作。任何外部资源(可能是完全在应用程序外部的页面,也可能是通过内容交付网络交付的静态内容)都应该始终指向使用绝对URL的位置:如果不使用绝对URL,则根本无法找到它们,因为它们驻留在不同的服务器上。

4

34

Vlad Alivanov 8 年前

假设我们正在创建其文件在文件夹中的子网站 http://site.ru/shop .

1。绝对网址

Link to home page
href="http://sites.ru/shop/"

Link to the product page
href="http://sites.ru/shop/t-shirts/t-shirt-life-is-good/"

2。相对URL

Link from home page to product page
href="t-shirts/t-shirt-life-is-good/"

Link from product page to home page
href="../../"

虽然相对URL看起来比绝对URL短,但绝对URL更可取,因为链接可以在网站的任何页面上不变地使用。

中间案件

我们考虑了两种极端情况:“绝对”绝对和“绝对”相对URL。但在这个世界上一切都是相对的。这也适用于URL。每次提到绝对URL时,都应该指定相对于什么。

三。协议相关URL

Link to home page
href="//sites.ru/shop/"

Link to product page
href="//sites.ru/shop/t-shirts/t-shirt-life-is-good/"

谷歌推荐这样的网址。然而,现在人们普遍认为http://和https://是不同的站点。

4。根相对URL

即相对于域的根文件夹。

Link to home page
href="/shop/"

Link to product page
href="/shop/t-shirts/t-shirt-life-is-good/"

如果所有页面都在同一个域中,这是一个不错的选择。当您将站点移动到另一个域时,不必在URL中大量替换域名。

5。基本相对URL(主页相对)

标记<base>指定基本URL,该URL将自动添加到所有相关链接和锚定。基标记不影响绝对链接。作为基本URL,我们将指定主页:<base href=“http://sites.ru/shop/”>。

Link to home page
href=""

Link to product page
href="t-shirts/t-shirt-life-is-good/"

现在,您不仅可以将站点移动到任何域,还可以移动到任何子文件夹中。请记住,虽然URL看起来像相对的,但实际上它们是绝对的。尤其要注意锚。要在当前页面中导航,我们必须编写href=“t-shirts/t-shirt-life-is-good/comments”而不是href=“comments”。后者将出现在主页上。

结论

对于内部链接,我使用基本相对URL(5)。对于外部链接和新闻稿,我使用绝对URL(1)。

5

23

None 10 年前

实际上有三种类型应该明确讨论。在实践中,虽然URL被抽象为在较低的级别上处理,但我想说的是,开发人员可以在整个生命周期中不需要手工编写一个URL。

绝对的

绝对URL将您的代码绑定到协议和域。这可以通过动态URL来解决。

<a href=âhttps://dev.example.com/a.html?q=â>https://dev.example.com/a.html?q=</a>

绝对优点:

控制 -子域和协议可以控制。通过一个模糊的子域进入的人将被引入适当的子域。您可以根据需要在安全和非安全之间来回跳跃。
可配置 -开发人员喜欢绝对的东西。使用绝对URL时,您可以设计简洁的算法。可以对URL进行配置,以便在单个配置文件中进行一次更改即可在站点范围内更新URL。
千里眼 -你可以搜索那些搜刮你的网站的人,或者选择一些额外的外部链接。

根相关

根相对URL将代码绑定到基URL。这可以通过动态URL和/或 base tags .

<a href=â/index.php?q=â>.example.com/index.php?q=</a>

根相对优势:

可配置 -基标记使它们与您选择的任何根相对,从而使交换域和实现模板变得容易。

相对

相对URL将代码绑定到目录结构。没有办法克服这一点。相对URL只在文件系统中用于遍历目录或作为半月板任务的快捷方式。

<a href=âindex.php?q=â>index.php?q=</a>
<link src=â../.././../css/default.cssâ />

相对缺点:

令人困惑 -那是多少点?那是多少个文件夹?文件在哪里?为什么不起作用?
维护 -如果文件意外移动,资源将退出加载,链接将用户发送到错误的页面,表单数据可能会发送到错误的页面。如果一个文件需要移动,那么所有要退出加载的资源和所有不正确的链接都需要更新。
不刻度 -当网页变得更复杂,并且视图开始在多个页面间重用时,相对链接将与包含它们的文件相关。如果每个页面上都有一个HTML导航片段,那么relative将与许多不同的位置相对。当人们开始创建模板时,首先意识到他们需要一种方法来管理URL。
计算的 -它们是由您的浏览器实现的(希望根据RFC)。见第5章 RFC3986 .
哎呀! -错误或打字错误会导致蜘蛛陷阱。

路线的演变

在这里讨论的意义上,开发人员已经停止编写URL。所有请求都是一个网站的索引文件,包含一个查询字符串,也就是路由。路由可以被认为是一个迷你URL,它告诉应用程序要生成的内容。

<a href="<?=Route::url('named_url', array('first' => 'my', 'last' => 'whacky'))?>">
    http://dev.example.com/index.php/my:whacky:url
</a>

路线优势:

绝对URL的所有优点。
在URL中使用任何字符。
更多控制(有利于SEO)。
算法生成URL的能力。这样就可以配置URL。更改URL是单个文件中的单个更改。
不需要404,没有找到。回退路由可以显示站点地图或错误页。
方便安全地间接访问应用程序文件。警卫声明可以确保每个人都通过适当的渠道到达。
MVC方法的实用性。

我的拿来

大多数人都会在他们的项目中以某种方式使用这三种形式。关键是要理解它们,并选择最适合任务的一个。

6

marcgg 15 年前

如果它是在您的网站中使用的,最好使用相对URL,例如,如果您需要将网站移动到另一个域名或只在本地调试,您可以这样做。

看看stackoverflow在做什么(在firefox中是ctrl+u):

<a href="/users/recent/90691"> // Link to an internal element

在某些情况下,它们使用绝对URL:

<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=5934">

……但这只是提高速度的最佳做法。在你的情况下,这看起来不像你在做那样的事情,所以我不会担心。

7

6

Community chadoh 7 年前

我将不得不反对这里的大多数人。

我认为相对的URL方案是“很好的”,当你想要快速的启动和运行一些东西,而不是在框外思考,特别是如果你的项目很小,开发人员很少(或者只是你自己)。

然而,一旦你开始研究大的、胖的系统,在那里你一直在交换域和协议,我相信一个更优雅的方法是正确的。

当您在本质上比较绝对和相对URL时,绝对会获胜。为什么?因为它永远不会破碎。曾经。绝对URL就是它所说的。关键是你必须维护你的绝对网址。

绝对URL链接的弱方法实际上是对整个URL进行硬编码。这不是一个好主意,也可能是人们为什么认为他们危险/邪恶/烦人的罪魁祸首。更好的方法是编写一个易于使用的URL生成器。这些很容易写,可以 难以置信地 功能强大-自动检测您的协议,易于配置(字面上为整个应用程序设置一次URL),等等,它注入您的域全部自己。这方面的好处是:您继续使用相对的URL进行编码,并且在运行时,应用程序将您的URL作为完全绝对值即时插入。令人惊叹的。

考虑到几乎所有现代站点都使用某种动态后端,这样做对所述站点最有利。绝对URL不仅仅能让你确定它们指向哪里——它们还能提高SEO性能。

我可能会补充说,绝对URL会以某种方式改变页面的加载时间的说法是一个神话。如果你的域名超过几个字节,而你在20世纪80年代使用的是拨号调制解调器,那当然。但情况已经不是这样了。 https://stackoverflow.com/ 是25字节,而他们用于站点导航区域的“topbar sprite.png”文件的重量为9+kb。这意味着与sprite文件相比,附加的url数据是加载数据的.2%,而且该文件甚至不被认为是一个大的性能冲击。

那个大的,未优化的,全页的背景图像更可能减慢你的加载时间。

下面是一篇关于为什么不应该使用相对URL的有趣文章: http://yoast.com/relative-urls-issues/

例如,一个可能出现在亲属身上的问题是,有时服务器映射(请注意大型的、混乱的项目)与文件名不一致,开发人员可能会假设一个相对的URL不是真的。我今天在一个项目上看到了这一点,它把整个页面都放下了。

或者可能是开发人员忘记了切换指针,突然谷歌为您的整个测试环境建立了索引。whoops-重复内容(对seo不好!).

绝对的可能是危险的,但如果使用得当,并且 不能破坏你的身材 它们被证明更可靠。请看上面的文章,它给出了WordPressURL生成器超级棒的原因。

:)

8

5

Ben Everard 15 年前

在大多数情况下,相对的URL是可行的,它们本质上是可移植的,这意味着如果你想提升你的站点,并把它放在其他人可以立即工作的地方,可能会减少调试时间。

有一个相当体面的 article on absolute vs relative URLs 检查一下。

9

4

Gumbo 15 年前

以URL方案和方案特定部分开头的URL( http:// , https:// , ftp:// 等)是绝对URL。

任何其他URL都是相对URL,需要一个基本URL,相对URL是从该URL解析出来的(因此取决于该URL),如果未另行声明,则该URL是引用所使用的资源的URL。

看一看 RFC 2396 â Appendix C 有关解析相对URL的示例。

10

3

Paolo 15 年前

假设你有一个网站www.yourserver.com。在Web文档的根目录中,您有一个images子目录,在该目录中,您有myimage.jpg。

绝对URL定义文档的确切位置,例如:

http://www.yourserver.com/images/myimage.jpg

相对URL定义位置 相对于当前目录 例如,如果您位于根Web目录中,则图像位于:

images/myimage.jpg

(相对于根目录)

在可能的情况下,应该始终使用相对URL。如果您将站点移动到www.anotherserver.com,您必须更新所有指向www.yourserver.com的绝对URL,相对URL将继续工作。

11

0

Amal Murali rogal111 10 年前

对于每个支持相对URI解析的系统,相对和绝对URI都有相同的目标:引用。它们可以互换使用。所以你可以决定每个情况不同。从技术上讲,他们提供了 相同的 引用。

准确地说,每个相对的URI都已经有了一个绝对的URI。这就是解析相对URI所依据的基URI。所以相对URI实际上是绝对URI之上的一个特性。

这也是为什么相对URI可以做到的原因。更多与绝对URI一样,这对于静态网站尤其重要,否则,与绝对URI相比,静态网站无法灵活地进行维护。

这些相对URI解析的积极作用也可以用于动态Web应用程序开发。在动态环境中,绝对uri s引入的不灵活也更容易处理,因此对于一些不确定uri解析以及如何正确地实现和管理它的开发人员(并非总是那么容易)来说,经常选择在网站的动态部分使用绝对uri s,因为它们可以引入其他动态特性。(例如,包含URI前缀的配置变量)以解决不灵活的问题。

那么使用绝对URI有什么好处呢?技术上没有,但我想说的是:相对URI更复杂,因为它们需要根据所谓的绝对基URI进行解析。即使解析是多年来严格定义的,您也可能在URI解析中遇到错误的客户机上运行。由于绝对URI不需要任何解析,因此使用绝对URI不会有遇到具有相对URI解析的错误客户端行为的风险。那么,实际风险有多高?嗯,这很罕见。我只知道一个互联网浏览器的相对URI解析有问题。这不是一般情况,只是在一个非常(模糊)的情况下。

除了HTTP客户机(浏览器)之外,对于超文本文档或代码的作者来说,它可能更复杂。在这里,绝对URI的好处是更容易测试,因为您可以在浏览器地址栏中按原样输入它。但是,如果不仅仅是一个小时的工作,那么实际理解绝对和相对的URI处理通常对您更有好处,这样您就可以真正地利用相对链接的好处。

12

-5

Dougal 14 年前

我衷心推荐将同一站点的位指向同一站点的其他位的相对URL。

别忘了,对https的更改——即使在同一个站点——也需要绝对的URL。