在<script src ="http:// ...">中用//替换http://是否有效？
Dar*_*ein 455 html https uri http protocol-relative
我有以下元素:
<script type="text/javascript" src="https://cdn.example.com/js_file.js"></script>
在这种情况下,该站点是HTTPS,但该站点也可能只是HTTP.(JS文件在另一个域上.)我想知道为方便起见,执行以下操作是否有效:
<script type="text/javascript" src="//cdn.example.com/js_file.js"></script>
我想知道是否有效删除http:或https:？
它似乎适用于我测试过的所有地方,但是有什么情况下它不起作用吗？
Jef*_*eff 385
根据RFC 3986:"统一资源标识符(URI):通用语法",第4.2节,没有方案(http:或https :)的相对URL有效.如果客户端阻塞它,那么它就是客户端的错误,因为它们不符合RFC中指定的URI语法.
您的示例有效且应该有效.我自己在交通繁忙的网站上使用过这种相对网址方法而没有投诉.此外,我们在Firefox,Safari,IE6,IE7和Opera中测试我们的网站.这些浏览器都了解URL格式.
- "如果一个客户端窒息它,那么它就是客户端的错,因为它们不符合RFC中指定的URI语法." - 我认为这是一个有趣的问题 - 但客户是否遵循"规范"并不是一个好的标准,是否在网络应用程序中做到明智. (30认同)
- 谷歌不使用这个,因为Windows XP网络堆栈不支持SNI.请参见:http://blogs.msdn.com/b/ieinternals/archive/2009/12/07/certificate-name-mismatch-warnings-and-server-name-indication.aspx.因此,允许在IE6上通过https加载Google Analytics分析脚本会导致证书错误. (18认同)
- 我想知道为什么谷歌不会将其用于分析.他们使用document.location.protocol方法. (8认同)
- 尽管这种技术似乎鲜为人知,但它在所有Web浏览器中都受支持.它工作得很好. (6认同)
- @Darryl Hein我相信google使用document.location.protocol方法,因为它还修改了url,而不仅仅是方案.如果文档使用https方案,他们会访问https://SSL.google-analytics.com. (5认同)
- 当他们说相对URL时,它意味着相对于同一协议. (2认同)
And*_*ore 150
它保证可以在任何主流浏览器中工作(我不会考虑市场份额低于0.05%的浏览器).哎呀,它适用于Internet Explorer 3.0.
RFC 3986将URI定义为由以下部分组成:
foo://example.com:8042/over/there?name=ferret#nose
\_/ \______________/\_________/ \_________/ \__/
| | | | |
scheme authority path query fragment
定义相对URI时(第5.2节),您可以省略任何这些部分,始终从左侧开始.在伪代码中,它看起来像这样:
result = ""
if defined(scheme) then
append scheme to result;
append ":" to result;
endif;
if defined(authority) then
append "//" to result;
append authority to result;
endif;
append path to result;
if defined(query) then
append "?" to result;
append query to result;
endif;
if defined(fragment) then
append "#" to result;
append fragment to result;
endif;
return result;
您描述的URI是无方案的相对URI.
- @Roger:是的,但在网络开发的背景下,边缘浏览器(<0.01%的市场份额)没有被考虑在内.这就像说在所有版本的Windows中都存在API,然后有人说它可能不支持Wine ... (4认同)
- @Roger Pate:我还没有看到浏览器没有遵循RFC的URI.这个特殊的标准已经存在了很长时间......我刚刚在IE3.0中对它进行了测试,它完全理解它.如果您使用不了解这些链接的浏览器,那么它可能是一个边缘浏览器,它无关紧要. (2认同)
- @SteveMidgley：`youtube.com` 指向相对于当前 URL 的名为“youtube.com”的文件/目录。`//youtube.com` 指向与当前 URL 使用相同方案的域“youtube.com”。它们根本不一样。 (2认同)
Thi*_*ilo 77
有什么情况不起作用吗？
如果加载了父页面file://,那么它可能不起作用(它会尝试获取file://cdn.example.com/js_file.js,当然你也可以在本地提供).
- 必须知道在本地机器上测试html的人! (19认同)
ken*_*ytm 23
在这里,我复制了HTML的隐藏功能中的答案:
使用与协议无关的绝对路径:
Run Code Online (Sandbox Code Playgroud)<img src="//domain.com/img/logo.png"/>如果浏览器通过HTTPS查看SSL中的页面,那么它将使用https协议请求该资产,否则它将使用HTTP请求它.
这可以防止IE中的"此页面包含安全和非安全项目"错误消息,将所有资产请求保留在同一协议中.
警告:当在
<link>aimport或@import上使用样式表时,IE7和IE8会 下载文件两次.然而,所有其他用途都很好.
Ned*_*der 16
放弃协议是完全有效的.URL规范多年来一直非常清楚,我还没有找到一个不理解它的浏览器.我不知道为什么这种技术不为人所知; 它是跨越HTTP/HTTPS边界的棘手问题的完美解决方案.更多信息:Http-https转换和相对URL
有什么情况不起作用吗？
只是把它放在混合中,如果你在本地服务器上进行开发,它可能不起作用.您需要指定一个方案,否则浏览器可能会认为src="//cdn.example.com/js_file.js"是src="file://cdn.example.com/js_file.js",因为您没有在本地托管此资源,所以它将会中断.
Microsoft Internet Explorer似乎对此特别敏感,请看这个问题:无法在localhost(WAMP)上的Internet Explorer中加载jQuery
您可能总是试图找到适用于所有环境的解决方案,并且需要进行最少量的修改.
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>
更新:HTML5Boilerplate现在<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js在决定弃用协议相对URL之后使用,请参见[here] [3].
一、总结
2019 年的答案：您仍然可以使用协议相对 URL，但这种技术 是一种反模式。
还：
- 您可能在开发过程中遇到问题。
- 某些第三方工具可能不支持它们。
从协议相关的 URL 迁移到https://它会很好。
2. 相关性
此答案与 2019 年 1 月相关。将来，此答案的数据可能已过时。
3.反模式
3.1. 论证
Paul Irish —前端工程师和 Google Chrome 的开发者倡导者—在 2014 年 12 月写道：
既然每个人都鼓励使用SSL并且没有性能问题，这种技术现在是一种反模式。如果您需要的资产在 SSL 上可用，则始终使用该
https://资产。允许片段通过 HTTP 请求为最近的 GitHub Man-on-the-side攻击等攻击打开了大门。即使您的站点在 HTTP 上，请求 HTTPS 资产始终是安全的，但反之则不然。
3.2. 另一个链接
3.3. 例子
4. 开发过程
例如，我尝试使用clean-console。
- 示例文件
KiraCleanConsole__cdn_links_demo.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>clean-console without protocol demonstration</title>
<!-- Really dead link -->
<script src="https://unpkg.com/bowser@latest/bowser.min.js"></script>
<!-- Package exists; link without “https:” -->
<script src="//cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
<!-- Package exists: link with “https:” -->
<script src="https://cdn.jsdelivr.net/npm/gemini-scrollbar/index.js"></script>
</head>
<body>
Kira Goddess!
</body>
</html>
- 输出：
D:\SashaDebugging>clean-console -i KiraCleanConsole__cdn_links_demo.html
checking KiraCleanConsole__cdn_links_demo.html
phantomjs: opening page KiraCleanConsole__cdn_links_demo.html
phantomjs: Unable to load resource (#3URL:file://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js)
phantomjs: phantomjs://code/runner.js:30 in onResourceError
Error code: 203. Description: Error opening //cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js: The network path was not found.
phantomjs://code/runner.js:31 in onResourceError
phantomjs: Unable to load resource (#5URL:https://unpkg.com/bowser@2.1.0/bowser.min.js)
phantomjs: phantomjs://code/runner.js:30 in onResourceError
Error code: 203. Description: Error downloading https://unpkg.com/bowser@2.1.0/bowser.min.js - server replied: Not Found
phantomjs://code/runner.js:31 in onResourceError
phantomjs: Checking errors after sleeping for 1000ms
2 error(s) on KiraCleanConsole__cdn_links_demo.html
phantomjs process exited with code 2
链接//cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js有效，但出现错误。
关注file://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js并阅读Thilo和bg17aw关于file://.
我不知道这种行为，也不明白为什么我会遇到这样的问题pageres。
5. 第三方工具
我使用Clickable URLs Sublime Text 包。使用它，我可以简单地从浏览器中的文本编辑器打开链接。
示例中的两个链接均有效。但是我可以在浏览器中成功打开的第一个链接使用可点击的 URL，第二个链接 - 没有。这可能不是很方便。
六，结论
是的：
- 如果您遇到
Developing process项目中的问题，您可以设置您的开发工作流程。 - 否则你在
Third-party toolsitem 中遇到问题，你可以贡献工具。
但是你不需要这个额外的问题。通过Anti-pattern项目中的链接阅读信息：协议相关的 URL 已过时。
| 归档时间： |
|
| 查看次数： |
114950 次 |
| 最近记录： |