在url / src / href属性中有两个正斜杠 [英] Two forward slashes in a url/src/href attribute

问题描述

可能存在重复：

以两个斜杠开始的URI…他们如何表现？

绝对URL忽略协议（方案）

shorthand //对于脚本和链接标记？任何人看到/使用此之前？

我正在浏览< a href =https://github.com/murtaugh/HTML5-Reset =noreferrer> HTML5 Reset 当我注意到

  
 
 < script src =// ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js\"> ;</script> 
  

为什么URL以两个正斜杠开始？这是对 http：// ？

解决方案

的简写。两个正斜杠是现在正在使用的任何协议的常用简写形式。

最着名的是协议相对URL，它们在元素 - 例如你的例子中的JS文件 - 可以从 http 或者 https 上下文中加载。通过使用协议相对URL，您可以避免执行

  if（window.location.protocol ==='http：'）{ 
 myResourceUrl ='http://example.com/my-resource.js'; 
} else {
 myResourceUrl ='https://example.com/my-resource.js'; 
} 
  

逻辑类型遍及您的代码库（当然，假设服务器在 example.com 能够通过 http 和 https


一个突出的现实世界的例子是Magento电子商务引擎：出于性能原因，商店的页面使用普通的 http 默认情况下，结帐是 https 启用。

当硬编码资源（即网站标题中的宣传横幅）由非协议相关URL（即 http://example.com/banner.jpg ）引用，客户到达 https 启用结帐时，会收到相当不友好的结果

此页面上有不安全的元素

提示 - 您可以想象，这会让平均不懂技术的人关闭。

如果上述资源通过<引用code> // example.com/banner.jpg ，但浏览器需要预先考虑正确的协议。

tl; dr：即使有混合http / https环境的可能性，只要使用双斜线/协议相关URL来加载资源即可 - 假设提供内容的主机既启用了http，又启用了https。

Possible Duplicate:
URI starting with two slashes … how do they behave?
Absolute URLs omitting the protocol (scheme) in order to preserve the one of the current page
shorthand as // for script and link tags? anyone see / use this before?

I was looking through the source of HTML5 Reset when I noticed the following line:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

Why does the URL start with two forward slashes? Is this a shorthand for http://?

解决方案

The "two forward slashes" are a common shorthand for "whatever protocol is being used right now".

Best known as "protocol relative URLs", they are particularly useful when elements — such as the JS file in your example — could be loaded from either a http or a https context. By using protocol relative URLs, you can avoid implementing

if (window.location.protocol === 'http:') {
    myResourceUrl = 'http://example.com/my-resource.js';
} else {
    myResourceUrl = 'https://example.com/my-resource.js';
}

type of logic all over your codebase (assuming, of course, that the server at example.com is able to serve resources via both http and https).

A prominent real-world example is the Magento E-Commerce engine: for performance reasons, the shop's pages use plain http by default, whereas the checkout is https enabled.

When hard-coded resources (i.e. promotional banners in the site's header) are referenced by non protocol relative URLs (i.e. http://example.com/banner.jpg), customers reaching the https enabled checkout will be greeted with a rather unfriendly

"there are insecure elements on this page"

prompt - which, as you can imagine, throws the average non-tech-savvy person off.

If the aforementioned resource is referenced via //example.com/banner.jpg though, the browser takes care of prepending the proper protocol.

tl;dr: With even the slightest possibility of a mixed http/https environment, just use the double slash/protocol relative URLs for loading your resources — assuming that the host serving the content is both http and https enabled.

这篇关于在url / src / href属性中有两个正斜杠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！