绝对与相对url

我想知道这两种types的URL之间的区别:相对URL(图片,CSS文件,JS文件等)和绝对URL。

另外,哪一个更好用?

一般来说,使用相对URL是最好的做法,这样您的网站就不会绑定到当前部署的基本URL。 例如,它将能够在本地主机上以及在公共领域上工作,而无需修改。

我应该使用绝对还是相对URL?

如果使用绝对URL,则意味着包括scheme(例如http / https)和主机名(例如yourdomain.com)在内的URL永远不会这样做(对于本地资源),因为维护和debugging会很糟糕。

假设您在代码中使用了绝对URL,如<img src="http://yourdomain.comhttp://img.dovov.comexample.png"> 。 现在,当你要:

  • 切换到另一个scheme(例如http – > https)
  • 切换域名(test.yourdomain.com – > yourdomain.com)

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

在第二个例子中,当您的网站从testing环境中启用时,这意味着所有资源仍然指向您的testing域,而不是您的活动域。

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

不同的url有什么区别?

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

  • http://yourdomain.comhttp://img.dovov.comexample.png
  • //yourdomain.comhttp://img.dovov.comexample.png
  • http://img.dovov.comexample.png
  • images/example.png

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

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

http://yourdomain.comhttp://img.dovov.comexample.png

以上(绝对)URL尝试访问资源/var/www/websitehttp://img.dovov.comexample.png 。 由于上述原因,这种types的URL是您总是希望避免从您自己的网站请求资源的。 但它确实有它的地方。 例如,如果你有一个网站http://yourdomain.com ,你想通过http请求一个来自外部域的资源,你应该使用这个。 例如https://externalsite.com/path/to/image.png

//yourdomain.comhttp://img.dovov.comexample.png

这个URL基于当前使用的scheme是相对的,在包含外部资源(图像,javascript等)时应该几乎总是被使用。

这种types的URL所使用的是使用当前页面的scheme。 这意味着你在页面http://yourdomain.com上,并在该页面上是一个图像标记<img src="//yourdomain.comhttp://img.dovov.comexample.png">图像的URL将在http://yourdomain.comhttp://img.dovov.comexample.png
当你在网页http**s**://yourdomain.com上,并在该页面上的图像标签<img src="//yourdomain.comhttp://img.dovov.comexample.png">图像将在https://yourdomain.comhttp://img.dovov.comexample.pngparsing。

这可以防止在不需要时通过https加载资源,并在需要时自动确保通过https请求资源。

上面的URL在服务器端以与上一个URL相同的方式parsing:

以上(绝对)URL尝试访问资源/var/www/websitehttp://img.dovov.comexample.png

http://img.dovov.comexample.png

对于本地资源,这是引用它们的首选方式。 这是基于您的网站的文档根( /var/www/mywebsite )的相对URL。 这意味着当你有<img src="http://img.dovov.comexample.png">总是会parsing到/var/www/mywebsitehttp://img.dovov.comexample.png

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

images/example.png

这也是一个相对的URL,虽然有点不同于前一个。 这个URL是相对于当前path。 这意味着它将根据你在网站的位置决定不同的path。

例如,当你在http://yourdomain.com的页面上,并且使用<img src="images/example.png">它会在服务器上parsing为/var/www/mywebsitehttp://img.dovov.comexample.png as预计,但是当你在http://yourdomain.com/some/path页面,你使用完全相同的图像标签,它突然将解决/var/www/mywebsite/some/pathhttp://img.dovov.comexample.png

何时使用什么?

在请求外部资源时,您最可能要使用与该scheme相关的URL(除非您想强制使用不同的scheme),并且在处理本地资源时,您希望使用基于文档根目录的相对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="http://img.dovov.comsome/localimage.png" alt=""> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script> </body> </html> 

一些(有点)重复

  • 编写跨环境传输的URL的安全方法
  • 在网站中链接图像的正确方法是什么?

看到这个: 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包含了“path”部分之前的部分 – 换句话说,它包含了scheme( http://foo/bar/baz中的http://foo/bar/baz )和主机名( http://foo/bar/baz )(和可选的端口,用户信息和端口)。

相对URL以一个path开始。

绝对的URL是绝对的:资源的位置只能在url本身parsing。 相对URL在某种意义上是不完整的:为了解决它,你需要scheme和主机名,这些通常是从当前上下文中获取的。 例如,在一个网页上

 http://myhost/mypath/myresource1.html 

你可以把这样的链接

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

在链接的href属性中,使用了一个相对的url,如果被点击的话,它必须被parsing才能遵循它。 在这种情况下,当前的上下文是

 http://myhost/mypath/myresource1.html 

所以这些模式,主机名和前导path被采用并预置到pages/page1 ,产生

 http://myhost/mypath/pages/page1 

如果链接是:

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

(注意/出现在url的开头),那么它将被parsing为

 http://myhost/pages/page1 

因为前导/表示主机的根。

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

实际上应该明确讨论三种types。 实际上,尽pipeURL被抽象为较低层次的处理,我甚至可以说开发人员可以一辈子都不用手写一个URL。

绝对

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

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

绝对优点:

  1. 控制 – 可以控制子域和协议。 通过一个晦涩的子域进入的人将被集中到适当的子域。 您可以根据需要在安全和不安全之间跳来跳去。

  2. 可configuration – 开发人员爱的东西是绝对的。 使用绝对URL时,您可以devise整洁的algorithm。 可以对URL进行configuration,以便可以通过单个configuration文件中的单个更改在整个站点范围内更新URL。

  3. 千里眼 – 你可以search人们刮你的网站或者可能拿起一些额外的外部链接。


根相对

根相对URL将您的代码绑定到基本URL。 这可以通过dynamicURL和/或基本标签来解决 。

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

根相对优点:

  1. 可configuration – 基本标记使它们相对于您select的任何根,使交换域和实现模板变得容易。

相对的

相对URL将您的代码绑定到目录结构。 没有办法克服这一点。 相对URL仅在遍历目录的文件系统中很有用,或者作为一项简单任务的快捷方式。

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

相对缺点:

  1. 混乱 – 有多less点? 那有多less个文件夹? 档案在哪里? 为什么它不工作?

  2. 维护 – 如果文件意外移动资源退出加载,链接发送用户到错误的页面,表单数据可能被发送到不正确的页面。 如果一个文件需要移动所有要退出的资源,并且所有不正确的链接都需要更新。

  3. 不缩放 – 当网页变得越来越复杂,并且视图开始在多个页面上重复使用时,相对链接将与它们所包含的文件有关。 如果你有一个导航片段的HTML将在每一页上,那么相对将是相对于很多不同的地方。 人们在开始创build模板时意识到的第一件事是他们需要一种pipe理URL的方法。

  4. 计算 – 他们是由您的浏览器(希望根据RFC)实现。 请参阅RFC3986中的第5章。

  5. OOPS! – 错误或错别字可能会导致蜘蛛陷阱。


路线的演变

开发人员已经停止写这里讨论的意义上的URL。 所有请求都是针对某个网站的索引文件,并包含一个查询string,也就是一个路由。 该路线可以被认为是一个迷你URL,告诉您的应用程序的内容生成。

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

路线优点:

  1. 绝对url的所有优点。
  2. 使用URL中的任何字符。
  3. 更多控制(对SEO有好处)。
  4. 能够通过algorithm生成URL。 这允许URL是可configuration的。 更改URL是单个文件中的单个更改。
  5. 没有需要404没有find。 回退路线可以显示站点地图或错误页面。
  6. 间接访问应用程序文件方便安全。 警卫声明可以确保每个人都通过适当的渠道到达。
  7. MVC方法的实用性。

我拿

大多数人会以这种或那种方式在他们的项目中使用这三种forms。 关键是要了解他们,并select最适合的任务。

假设我们正在创build一个子文件,其文件位于文件夹http://site.ru/shop

1.绝对URL

 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="../../" 

尽pipe相对URL看起来比绝对URL短,但绝对URL更可取,因为链接可以在网站的任何页面上保持不变。

中间情况

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

3.协议相对的URL

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

Googlebuild议使用此url。 但是,现在通常认为http://和https://是不同的站点。

4.根相对URL

即相对于域的根文件夹。

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

如果所有页面都在同一个域中,这是一个不错的select。 当您将网站移至其他网域时,您无需在url中大量更换网域名称。

5.基地相对URL(主页相对)

标签<base>指定了自动添加到所有相关链接和锚点的基本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/" 

现在,您可以将您的网站不仅移到任何域,但在任何子文件夹。 请记住,尽pipeURL看起来像是相对的,但实际上它们是绝对的。 特别要注意锚点。 为了在当前页面内导航,我们必须写href =“T恤/ t恤 – 生活 – 好/#评论”而不是href =“#comments”。 后者将抛出主页。

结论

对于内部链接,我使用基地相对的URL(5)。 对于外部链接和通讯,我使用绝对URL(1)。

如果要在您的网站中使用,最好使用相对URL,如果您需要将网站移动到另一个域名或仅在本地进行debugging,则可以。

看看什么是stackoverflow正在做(Ctrl + U在Firefox中):

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

在某些情况下,他们使用绝对的url:

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

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

我将不得不不同意这里的大多数人。

我认为当你想快速启动并运行,而不是在框外思考的时候,相对的URLscheme是“好的”,特别是如果你的项目很小,开发人员很less(或者只是你自己)。

然而,一旦你开始研究大型的脂肪系统,你总是在切换域和协议,我相信一个更优雅的方法是为了。

当你比较绝对和相对的url,Absolute胜利。 为什么? 因为它永远不会中断。 永远。 绝对URL正是它所说的。 当你必须维护你的绝对URL的时候,

绝对URL链接的弱方法实际上是对整个URL进行硬编码。 这不是一个好主意,也许是人们为什么把他们视为危险/邪恶/讨厌维护的罪魁祸首。 一个更好的方法是编写一个易于使用的URL生成器。 这些都很容易编写,并且可以非常强大 – 自动检测您的协议,易于configuration(从字面上为整个应用程序设置一次url)等,它自己注入您的域。 好的一点是:你使用相对URL进行编码,在运行时,应用程序会以dynamic方式插入你的URL作为完整的绝对地址。 真棒。

看到所有的现代网站实际上是如何使用某种dynamic的后端,这样做是为了网站的最大利益。 绝对的URL不仅仅是让你确定他们指向的地方 – 他们也可以提高SEO的性能。

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

那个大的,未经优化的整页背景图片更有可能减慢你的加载时间。

关于为什么不应该使用相对URL的一个有趣的职位在这里:http: //yoast.com/relative-urls-issues/

例如,亲戚可能会遇到的一个问题是,有时服务器映射(关于大型的,搞砸的项目)不与文件名相对应,开发人员可能会假设一个相对的URL真正。 今天刚刚看到一个我正在开发的项目,整个页面都被打乱了。

或者,也许开发者忘了切换一个指针,突然谷歌索引你的整个testing环境。 哎呀,重复的内容(对SEO不好)!

绝对可能是危险的,但是如果使用得当,而且不能破坏你的构build,它们就会被certificate是更可靠的。 看看上面的文章,给出了一堆为什么WordPress的url生成器是超棒的原因。

🙂

在大多数情况下,相对URL是要走的路,它们本质上是可移植的,这意味着如果你想提升你的网站,并把它放在其他地方立即工作,减less可能的debugging时间。

有一个相当不错的文章绝对与相对URL ,检查出来。

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

任何其他的URL都是一个相对的URL,并且需要一个基本的URL,这个相对的URL将被parsing(并且依赖于),这就是引用被使用的资源的URL,如果没有声明的话。

请参阅RFC 2396 – 附录C中有关parsing相对URL的示例。

假设你有一个网站www.yourserver.com。 在web文档的根目录中,您有一个图像sub-directoy,并且您有myimage.jpg。

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

 http://www.yourserver.comhttp://img.dovov.commyimage.jpg 

相对URL定义了相对于当前目录的位置,例如,假设您位于图像所在的根目录web目录中:

 images/myimage.jpg 

(相对于那个根目录)

您应该尽可能使用相对URL。 如果您将网站移动到www.anotherserver.com,您将不得不更新所有指向www.yourserver.com的绝对url,相对url将保持原样。

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

确切地说,每个相对URI都有一个绝对的URI。 这就是相对URI解决的基础URI。 所以相对URI实际上是绝对URI上的一个特征。

这也是为什么使用相对URI,您可以单独使用绝对URI来做更多的事情 – 这对静态网站尤其重要,否则,与绝对URI相比,静态网站无法像维护那样灵活。

相对URIparsing的这些积极效果也可以用于dynamicWeb应用程序开发。 在一个dynamic的环境中,绝对的URI所引入的不灵活性也更容易处理,因此对于那些不确定URIparsing以及如何正确地实现和pipe理它的开发者来说(通常不是那么容易),经常select使用绝对的网站dynamic部分的URI,因为它们可以引入其他dynamic特性(例如,包含URI前缀的configurationvariables),以便解决僵化问题。

那么使用绝对URI有什么好处呢? 从技术上讲,没有,但我会说:相对URI更复杂,因为它们需要解决所谓的绝对基地的URI。 即使这个决议是严格定义自几年以来,您可能会运行在URIparsing错误的客户端。 由于绝对URI不需要任何parsing,所以使用绝对URI不会有相对URIparsing的错误客户端行为的风险。 那么这个风险有多高呢? 那么,这是非常罕见的。 我只知道一个互联网浏览器,相对URIparsing有问题。 这一般不是,而只是在一个非常模糊的情况下。

在HTTP客户端(浏览器)旁边,对于超文本文档或代码的作者来说也许更为复杂。 这里的绝对URI有一个好处,那就是testing起来比较简单,因为你可以直接将它input到你的浏览器地址栏中。 但是,如果这不仅仅是一个小时的工作,那么实际理解绝对和相对URI处理方式通常对您更有利,这样您就可以真正利用相对链接的好处。

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

不要忘记,对HTTPS的改变 – 即使在同一个网站 – 将需要一个绝对的URL。