我可以将所有的 http://链接改为 just//吗?

戴夫 · 沃德说,

这并不完全是轻松的阅读,但是 RFC 3986第4.2节提供了完全限定的 URL,完全省略了协议(HTTP 或 HTTPS)。当忽略 URL 的协议时,浏览器将使用基础文档的协议。

简而言之,这些“无协议”的 URL 允许这样的引用在你将要尝试的每个浏览器中工作:

//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js

一开始看起来很奇怪,但是这个“无协议”的 URL 是引用通过 HTTP 和 HTTPS 提供的第三方内容的最佳方式。

这当然可以解决我们在 HTTP 页面上看到的一系列混合内容的错误——假设我们的资产可以通过 HTTP 和 HTTPS 获得。

这是完全跨浏览器兼容的吗? 还有其他的注意事项吗?

67939 次浏览

是的,网络路径引用已经在RFC 1808中指定,并且应该适用于所有浏览器。

在发布前我进行了彻底的测试。在所有可用于测试Browsershots的浏览器中,我只能找到一个不能正确处理协议相对URL的浏览器:一个名为Dillo的*nix浏览器。

我收到的反馈有两个缺点:

  1. 当你在浏览器中“打开”一个本地文件时,无协议url可能无法正常工作,因为页面的基本协议将是file:///。特别是当您为cdn托管资产等外部资源使用无协议URL时。不过,使用本地web服务器(如Apache或IIS)来测试http://localhost地址也可以。
  2. 显然,至少有一个iPhone提要阅读器应用程序不能正确处理无协议的url。我不知道哪个有问题,也不知道它有多受欢迎。对于托管JavaScript文件来说,这不是一个大问题,因为RSS阅读器通常会忽略JavaScript内容。然而,如果你将这些url用于需要通过RSS聚合的内容中的图像等媒体,这可能是一个问题(尽管,单个平台上的单个阅读器应用程序可能只占非常少量的读者)。

如果你使用非协议url加载样式表,IE 7 &8会下载两次: http://www.stevesouders.com/blog/2010/02/10/5a-missing-schema-double-download/ < / p >

所以,如果你喜欢良好的性能,这是要避免的CSS。

考虑到应该是否这样做,一个可以是否将其所有链接更改为协议相关的问题可能是没有意义的。根据保罗爱尔兰:

2014.12.17:既然SSL是鼓励每个人使用的,并且没有性能问题,那么这个技术现在是一个反模式。如果 你所需要的资产在SSL上可用,那么总是使用https:// . properties 资产。< / p >

这是完全跨浏览器兼容的吗?还有其他注意事项吗?

如果您是在本地服务器上开发,那么它可能无法工作。你需要指定一个方案,否则浏览器可能会假设src="//cdn.example.com/js_file.js"src="file://cdn.example.com/js_file.js",这将破坏,因为你没有在本地托管这个资源。

微软的Internet Explorer似乎对此特别敏感,请看这个问题:无法在本地主机的Internet Explorer中加载jQuery (WAMP)

您可能总是试图找到一种解决方案,该解决方案适用于所有环境,所需的修改最少。

HTML5Boilerplate使用的解决方案是在资源没有正确加载时有一个回退,但只有当你合并了一个检查时才有效:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- If jQuery is not defined, something went wrong and we'll load the local file -->
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

我也发布了这个答案在这里

更新:在决定弃用协议相对url后,HTML5Boilerplate现在使用<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">,参见在这里

我在使用://example.com时没有这些问题-但你确实需要在开头添加冒号。你之前写过一篇关于这方面的文章。但却被他的一堆博客帖子淹没了。

如果你想确保所有请求都升级到安全协议,那么有一个简单的选项,使用内容安全策略头upgrade-insecure-requests

Content-Security-Policy: upgrade-insecure-requests;

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/upgrade-insecure-requests