170

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://?

Community
  • 1
  • 1
Michael Parkin
  • 1,855
  • 2
  • 12
  • 13
  • possible duplicate of [Absolute URLs omitting the protocol (scheme) in order to preserve the one of the current page](http://stackoverflow.com/questions/4978235/absolute-urls-omitting-the-protocol-scheme-in-order-to-preserve-the-one-of-the), see also [Can I change all my http:// links to just //?](http://stackoverflow.com/questions/4831741/can-i-change-all-my-http-links-to-just) – Wesley Murch Mar 10 '12 at 12:33
  • possible duplicate of [Is it valid to replace http:// with // in a – outis Mar 10 '12 at 15:33

2 Answers2

250

The "two forward slashes" are a common shorthand for "request the referenced resource using whatever protocol is being used to load the current page".

Best known as "protocol relative URLs", they are particularly useful when elements — such as the JS file in your example — could be served and/or requested 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 content through both http and https).

A prominent real-world example is the Magento 1.X E-Commerce engine: for performance reasons, the category and product pages use plain http by default, whereas the checkout is https enabled.

If some resources (e.g. promotional banners in the site's header) are referenced via non protocol relative URLs (i.e. http://example.com/banner.jpg), customers reaching the https enabled checkout are greeted with a rather unfriendly

"there are insecure elements on this page"

prompt - which, one can safely assume, isn't exactly great for business.

If the aforementioned resource is referenced via //example.com/banner.jpg though, the browser takes care of loading it via the proper protocol both on the plain http product/category pages and in the https-enabled checkout flow.

tl;dr: With even the slightest possibility of a mixed http/https environment, just use the double slash/protocol relative URLs to reference resources — assuming that the host serving them supports both http and https.

vzwick
  • 11,008
  • 5
  • 43
  • 63
  • Carefull though, if you do this in SharePoint 2010 SP will automatically change the tag to be https if your content authors are authoring on a secure site for a page consumed on a public site. The image will always be https on the http accessed url. Confirmed with the Telerik Rad Editor....not sure about vanilla SP. – Marc Sep 21 '12 at 21:19
  • 5
    Yes, but why not a single slash? Doesn't that do the same thing? – mckoss Mar 29 '13 at 07:16
  • 13
    @mckoss : a single slash works great if the file is on the same domain. I could, of course, fetch `http(s)://mydomain.com/resource.jpg` by referencing `/resource.jpg`. For `http(s)://some-other-dudes-domain.com/other-resource.jpg`, the single slash obviously won't work. – vzwick Mar 31 '13 at 14:22
  • On a minor note, the snippet above could be better implemented as: myResourceUrl = window.location.protocol + '://example.com/my-resource.js'; but of course myResourceUrl = '//example.com/my-resource.js'; is even simpler – Jose Gómez Oct 29 '14 at 23:35
  • 1
    @vzwick, When did browsers started supporting this syntax? Since IE6 era? – Pacerier Jan 23 '15 at 09:34
  • 3
    @Pacerier - this is standardised at least since [RFC 3986](http://tools.ietf.org/html/rfc3986#section-4.2), so 2005-ish. Probably worked before, too. – vzwick Jan 23 '15 at 14:18
  • According to wikipedia in 2005 IE 6 was released in August 2001 and IE7 was released in October 2006. @Pacerier, if IE6 was a guess, it was accurate. – Shanimal Oct 22 '15 at 17:31
  • Dammit.. iOS 11.2.5 Safari will interpret `localhost` as `https:`, while pc chrome and android as `http:`. – choz Mar 01 '18 at 10:20
15

It will automatically add https or http, depending on how the request was made.

Radu Cugut
  • 1,663
  • 1
  • 16
  • 18
  • 14
    Its worth noting this will populate not just http or https, but also any other protocol that the browser supports. FTP for example. It tells the browser to use the same protocol that is being used. (sorry to comment on an old post!) – kirgy Oct 23 '15 at 15:30