---
title: 协议相关的链接
tags:
- Schema
categories: 学习
permalink: the-protocol-relative-url
featureImage: https://cat.yufan.me/cats/ame/the-protocol-relative-url.jpg
date: 2013-05-01 05:19:12
---
这里有一个你可以拿走，并将能拯救你于头痛中的小窍门。
```javascript
```
如果游览器正通过HTTPS访问当前页面，然后它将使用HTTPS协议请求上面的资源。否则，游览器将通常用HTTP请求资源。这样阻止了在IE中讨厌的错误信息：“此页包含安全和不安全的项目”，使你的所有资源请求保持在相同的协议内。
当然，如果你正在游览本地文件，游览器将尝试使用`file://`协议获取文件。
我们在[HTML5模板文件](http://html5boilerplate.com/)中使用了此技巧来智能地从谷歌CDN上获取jQuery。
```javascript
```
从技术上而言，根据[RFC 3986](http://tools.ietf.org/html/rfc3986#section-4.2)这种链接写法被叫作“网络路径引用”。对了，如果你想[严格正确](http://url.spec.whatwg.org/#concept-scheme-relative-url)地使用，当论及URL时，请使用术语“scheme（系统）”而不是“protocol（协议）”。
这个技巧在CSS中同样完美有效。
```css
.omgomg { background: url(//websbestgifs.net/kittyonadolphin.gif); }
```
…假设你正指向的网站拥有通过HTTP和HTTPS均能获取的资源。
警告：当在或@import语句上对一个样式表使用本技巧时，IE7和IE8会下载两遍链接指向的文件。然而所有其它的游览器均没有此问题。
感谢miketaylr、ralphholzmann、annevk在这个上面付出的智慧。同时感谢ajaxian，一个我记得是4年前学习到此技巧的地方。也许吧。
>2011年1月23日：但是…[在谷歌分析代码中使用这个技巧](http://mathiasbynens.be/notes/async-analytics-snippet#protocol-check)如何？
>当然没问题，那样做不是很棒？…因此我和谷歌分析的JavaScript首席开发者一起研究（天哪，我喜欢在谷歌工作）是否我们可以这么做…结果是我们不能。在IE6中有一个edgecase故障会导致会话注1中断…受一些安全设置的影响（不确定它们是否为默认）当请求非SSL子域名资源时，就出现如下面截图的情况。所以如果你并不在乎IE6的话，轻松地从你的GA注2代码中去掉那40 bytes。否则，你将需要那个三元运算符注3。)
>2011年12月24日：Eric Law（来自IE团队）说明了为什么IE6与GA不兼容…
>在IE6中没有生效的原因是由于服务器使用SNI来确定返回什么样的认证。XP（因此是IE6）在HTTPS 堆中并不支持SNI。[详细了解](http://blogs.msdn.com/b/ieinternals/archive/2009/12/07/certificate-name-mismatch-warnings-and-server-name-indication.aspx)。
----
* **注1**：会话这里指HTTP会话，包含4步。建立TCP连接→发出请求文档→发出响应文档→释放TCP连接
* **注2**：此处的GA和下面的GA均指的是Google Analytics，GA代码也就是经典的ga.js——谷歌分析代码。
* **注3**：此处的三元运算符在详细看了[Scheme Relative URL](http://url.spec.whatwg.org/#concept-scheme-relative-url)后便可理解，作为非技术人员，只需知道是完整的URL链接。
* **注4**：[定制优化你的GA代码](http://mathiasbynens.be/notes/async-analytics-snippet)
----
原文：[The Protocol-relative URL](http://paulirish.com/2010/the-protocol-relative-url/)
译者：[雨帆](http://yufan.me)，转载时请保留译文链接和原文链接。
```
如果游览器正通过HTTPS访问当前页面，然后它将使用HTTPS协议请求上面的资源。否则，游览器将通常用HTTP请求资源。这样阻止了在IE中讨厌的错误信息：“此页包含安全和不安全的项目”，使你的所有资源请求保持在相同的协议内。
当然，如果你正在游览本地文件，游览器将尝试使用`file://`协议获取文件。
我们在[HTML5模板文件](http://html5boilerplate.com/)中使用了此技巧来智能地从谷歌CDN上获取jQuery。
```javascript
```
从技术上而言，根据[RFC 3986](http://tools.ietf.org/html/rfc3986#section-4.2)这种链接写法被叫作“网络路径引用”。对了，如果你想[严格正确](http://url.spec.whatwg.org/#concept-scheme-relative-url)地使用，当论及URL时，请使用术语“scheme（系统）”而不是“protocol（协议）”。
这个技巧在CSS中同样完美有效。
```css
.omgomg { background: url(//websbestgifs.net/kittyonadolphin.gif); }
```
…假设你正指向的网站拥有通过HTTP和HTTPS均能获取的资源。
警告：当在或@import语句上对一个样式表使用本技巧时，IE7和IE8会下载两遍链接指向的文件。然而所有其它的游览器均没有此问题。
感谢miketaylr、ralphholzmann、annevk在这个上面付出的智慧。同时感谢ajaxian，一个我记得是4年前学习到此技巧的地方。也许吧。
>2011年1月23日：但是…[在谷歌分析代码中使用这个技巧](http://mathiasbynens.be/notes/async-analytics-snippet#protocol-check)如何？
>当然没问题，那样做不是很棒？…因此我和谷歌分析的JavaScript首席开发者一起研究（天哪，我喜欢在谷歌工作）是否我们可以这么做…结果是我们不能。在IE6中有一个edgecase故障会导致会话注1中断…受一些安全设置的影响（不确定它们是否为默认）当请求非SSL子域名资源时，就出现如下面截图的情况。所以如果你并不在乎IE6的话，轻松地从你的GA注2代码中去掉那40 bytes。否则，你将需要那个三元运算符注3。)
>2011年12月24日：Eric Law（来自IE团队）说明了为什么IE6与GA不兼容…
>在IE6中没有生效的原因是由于服务器使用SNI来确定返回什么样的认证。XP（因此是IE6）在HTTPS 堆中并不支持SNI。[详细了解](http://blogs.msdn.com/b/ieinternals/archive/2009/12/07/certificate-name-mismatch-warnings-and-server-name-indication.aspx)。
----
* **注1**：会话这里指HTTP会话，包含4步。建立TCP连接→发出请求文档→发出响应文档→释放TCP连接
* **注2**：此处的GA和下面的GA均指的是Google Analytics，GA代码也就是经典的ga.js——谷歌分析代码。
* **注3**：此处的三元运算符在详细看了[Scheme Relative URL](http://url.spec.whatwg.org/#concept-scheme-relative-url)后便可理解，作为非技术人员，只需知道是完整的URL链接。
* **注4**：[定制优化你的GA代码](http://mathiasbynens.be/notes/async-analytics-snippet)
----
原文：[The Protocol-relative URL](http://paulirish.com/2010/the-protocol-relative-url/)
译者：[雨帆](http://yufan.me)，转载时请保留译文链接和原文链接。