关于html：在

are there any cases where it doesn't work?

如果父页是从file://加载的，那么它可能无法工作(它将尝试获取file://cdn.example.com/js_file.js，当然您也可以在本地提供)。

相关讨论

许多人称之为协议相关的URL。

它会导致在IE 7&8中双重下载CSS文件。

相关讨论

在这里，我复制了HTML隐藏功能中的答案：

Using a protocol-independent absolute
path:

1
<img src="//domain.com/img/logo.png"/>

If the browser is viewing an page in
SSL through HTTPS, then it'll request
that asset with the https protocol,
otherwise it'll request it with HTTP.

This prevents that awful"This Page
Contains Both Secure and Non-Secure
Items" error message in IE, keeping
all your asset requests within the
same protocol.

Caveat: When used on a or
@import for a stylesheet, IE7 and IE8
download the file twice. All other
uses, however, are just fine.

不遵守协议是完全有效的。多年来，URL规范对此非常清楚，我还没有找到一个不理解它的浏览器。我不知道为什么这种技术不为人所熟知；它是解决跨越HTTP/HTTPS边界这一棘手问题的完美解决方案。更多信息：HTTP HTTPS转换和相对URL

are there any cases where it doesn't work?

如果您是在本地服务器上开发的，那么将其加入到组合中，它可能不会工作。您需要指定一个方案，否则浏览器可能会假定src="//cdn.example.com/js_file.js"是src="file://cdn.example.com/js_file.js"，因为您不在本地托管此资源，所以它将中断。

Microsoft Internet Explorer似乎对此特别敏感，请参阅以下问题：无法在本地主机(wamp)上的Internet Explorer中加载jquery

您可能总是试图找到一个在所有环境中都能工作的解决方案，只需要最少的修改。

HTML5BoilerPlate使用的解决方案是在资源未正确加载时进行回退，但只有在合并检查时才有效：

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

更新：html5boilerplate现在使用

我在HTML5样板上看到的模式是：

1
2
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')

在http、https、file等不同方案上运行平稳。

相关讨论

1。总结

2019年的答案是：您仍然可以使用协议相关的URL，但是这种技术是反模式的。

也：

  • 您可能在开发中遇到问题。
  • 某些第三方工具可能不支持它们。

    • 从协议相关的URL迁移到https://是很好的。

    2。关联

    此答案适用于2019年1月。将来，这个答案的数据可能会过时。

    三。反模式3.1。论证

    Paul Irish-谷歌Chrome的前端工程师和开发倡导者-撰写于2014年12月：

    Now that SSL is encouraged for everyone and doesn’t have performance concerns, this technique is now an anti-pattern. If the asset you need is available on SSL, then always use the https:// asset.

    Allowing the snippet to request over HTTP opens the door for attacks like the recent GitHub Man-on-the-side attack. It’s always safe to request HTTPS assets even if your site is on HTTP, however the reverse is not true.

    3.2。另一个环节

    • 使用协议相关的URI加载页面资源
    • 停止使用与协议相关的URL

    3.3。实例

    • 2017年，栈溢出从协议相关的URL切换到了https。
    • 2018年，Chrome将所有未加密的网站标记为"不安全"

    4。开发过程

    例如，我尝试使用干净的控制台。

    • 示例文件KiraCleanConsole__cdn_links_demo.html：
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        clean-console without protocol demonstration
        <!-- Really dead link -->
        <script src="https://unpkg.com/bowser@latest/bowser.min.js">
        <!-- Package exists; link without"https:" -->
        <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js">
        <!-- Package exists: link with"https:" -->
        <script src="https://cdn.jsdelivr.net/npm/gemini-scrollbar/index.js">
    </head>
    <body>
        Kira Goddess!
    </body>
    </html>
    • 输出：
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    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/[email protected]/dist/jquery.min.js)


    phantomjs:   phantomjs://code/runner.js:30 in onResourceError
    Error code: 203. Description: Error opening //cdn.jsdelivr.net/npm/[email protected]/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/[email protected]/bowser.min.js)


    phantomjs:   phantomjs://code/runner.js:30 in onResourceError
    Error code: 203. Description: Error downloading https://unpkg.com/[email protected]/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

    link //cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js是有效的，但我得到了一个错误。

    注意file://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js，阅读thilo和bg17aw关于file://的回答。

    我不知道这种行为，也不明白为什么我在寻呼机上遇到这样的问题。

    5。第三方工具

    我使用可点击的网址升华文本包。使用它，我可以在浏览器中打开我的文本编辑器的链接。

    CSS links examples

    示例中的两个链接都有效。但我能在浏览器中成功打开的第一个链接使用可点击的URL，第二个链接-不。这可能不太方便。

    6。结论

    对：

  • 如果您在Developing process项中遇到问题，可以设置开发工作流。
  • 否则，您会遇到与Third-party tools项相同的问题，您可以贡献工具。

    • 但你不需要这些额外的问题。通过Anti-pattern项中的链接读取信息：与协议相关的URL已过时。

    由于您的示例是链接到外部域，如果您使用的是HTTPS，那么您应该验证外部域是否也设置了SSL。否则，您的用户可能会看到SSL错误和/或404错误(例如，PLESK的旧版本将HTTP和HTTPS存储在单独的文件夹中)。对于cdn来说，这不应该是一个问题，但对于任何其他网站来说，这可能是一个问题。

    另一方面，在更新旧网站的同时进行了测试，并且还可以在url=元刷新的一部分中工作。