绝对vs相对URL

Question

绝对vs相对URL

Hai*_*vgi 195 html url

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

另外,哪一个更好用？

Answer 1

Pee*_*Haa 212

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

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

假设您在代码中的所有位置都使用了绝对URL <img src="http://yourdomain.com/images/example.png">.现在,当你要去的时候会发生什么:

切换到另一个方案(例如http - > https)
切换域名(test.yourdomain.com - > yourdomain.com)

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

在第二个示例中,当您的网站从测试环境中直播时,这意味着所有资源仍然指向您的测试域而不是您的实时域.

因此,要回答有关是使用绝对URL还是相对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.

/images/example.png

对于本地资源,这是引用它们的首选方式.这是基于/var/www/mywebsite您网站的文档root()的相对URL .这意味着当你拥有<img src="/images/example.png">它将始终解决/var/www/mywebsite/images/example.png.

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

images/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>

归档时间：	15 年，10 月前
查看次数：	258386 次
最近记录：	7 年，9 月前

绝对vs相对URL

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

不同的URL有什么区别？

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

什么时候用？

一些(有点)重复

1.绝对URL

2.相对URL

中级案件

3.协议相对URL

4.根相对URL

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

结论

绝对

根相对

相对的

路线的演变

我的看法