html - 为什么网站对于内嵌的资源如script、style、images等有时候省略了协议头？

问题描述

问 题

看到一篇google HTML/CSS Style Guide的文章，里面讲到这样一个规则：

Omit the protocol portion (http:, https:) from URLs pointing to images and other media files, style sheets, and scripts unless the respective files are not available over both protocols.

<!-- Not recommended -->
<script src="https://www.google.com/js/gweb/analytics/autotrack.js"></script>
<!-- Recommended -->
<script src="//www.google.com/js/gweb/analytics/autotrack.js"></script>
/* Not recommended */
.example {
  background: url(https://www.google.com/images/example);
}
/* Recommended */
.example {
  background: url(//www.google.com/images/example);
}

它的解释如下：

Omitting the protocol—which makes the URL relative—prevents mixed content issues and results in minor file size savings.

问题：

1、我的理解是使得资源标识路径变成相对路径，从而防止了多个协议下但是同一文件的镜像缓存，不知道这样的理解对不对？

2、陆续查看了谷歌、某宝、某品会，发现确实有部分资源省略了协议头，之所以只有部分资源省略了协议头，是不是因为某些资源只在某个协议下才有使用到，例如支付页面一般都是https，所以如果这个页面的资源文件只在这个页面使用，那么就不省略协议头了。不知道这样的理解对不对？

3、是否可以所有资源都省略协议头，这样是不是会造成什么问题？

解决方案

忽略协议可以让浏览器根据页面时http或者https自动选择使用的协议，从而避免了网站改为https的情况下仍然访问http资源而无法访问的问题。

这篇关于html - 为什么网站对于内嵌的资源如script、style、images等有时候省略了协议头？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！