gndpea
Last Updated: February 25, 2016
·
2.901K
· steve-jansen
D3b2094f1b3386e660bb737e797f5dcc

Use src="//server/lib.js" instead of src="http://server/lib.js"

Google's Angular docs turned me onto the HTML trick of linking to external files without specifying the scheme/protocol (e.g., http or https).

Do this:

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

Don't do this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

The browser will implicitly load the external resource using the same scheme as the page.

This avoids dynamically loading scripts or rewriting HTML to support hosting on both HTTP and HTTPS.

HTTPS is becoming much more ubiquitous thanks to better TLS scalability and privacy concerns of HTTP over open networks like WiFi hot spots. Even if your site isn't using HTTPS today, this simple trick today makes it easier to "flip the swtich" tomorrow with HTTPS support.

Keep in mind a few CDN operators (e.g., http://code.highcharts.com/) will overlook this trick even though they support both HTTP and HTTPS.

Say Thanks
Respond

12 Responses
Add your response

12150
F1a3945f946bb34d84f257534fb9d4e4

Also keep in mind, when testing local files (eg: file://Users/username/myfile.html), the // will resolve to file:// which obviously will not work for external resources like jQuery.

over 1 year ago ·
12151
D3b2094f1b3386e660bb737e797f5dcc

@koen, nice point. FYI there is a fix for this. To enable XHR/AJAX requests (like jQuery dynamic loading of scripts) with file:/// schemes:

Chrome

Pass the --allow-file-access-from-files command line arg, which you can check with chrome://flags.

Safari

Click the Develop menu > Disable Local File Restrictions.

over 1 year ago ·
12158
D42a7264714dee5006b9c99d2567a320

@steve-jansen I think @koen meant that if you open locally an html file that has e.g.

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

Then the browser will try to fetch file://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js instead of http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js Which causes a problem unless you use a smarter script loader with local file fallback.

over 1 year ago ·
12159
D3b2094f1b3386e660bb737e797f5dcc

Ah, now I see! Totally right.

I forgot about this since I use yeoman/grunt/bower now for local JS dev, which gives me 'grunt serve' for a lightweight server. Some people use a short rack config file for this too.

over 1 year ago ·
12160
B2bc42f69510d6a1d2c9cde1c2214d24

to avoid file:/// use python -m SimpleHTTPServer or faster node alternative

npm install http-server -g
http-server -p 8000

for a new project grunt is a good idea

over 1 year ago ·
12161
D3b2094f1b3386e660bb737e797f5dcc

@lukasz-madon, great tip!

over 1 year ago ·
12172
0fbb3826166cbd58fb8c3f44a021d511

good to know!

over 1 year ago ·
12480
0 nfyu8txkcy7l9htqq8v08golvgypn tq96e18gxteze wf5n43u8aci7u1puckp4vxyt753o6cjr

I believe it worth to mention that IE6 have some issues with protocol relative URLs.


Update: This is the right link

The previous one is about the server conditions that makes IE6 returns a dialog window.

over 1 year ago ·
12482
D3b2094f1b3386e660bb737e797f5dcc

Hi @robsonsobral, good to know however that link doesn't seem to talk about protocol relative URLs in IE6. It talks about host name mismatches when using IE6 on XP, which uses SSLv2 instead of SSLv3 or TLSv1.0. Did I misread the article?

over 1 year ago ·
12483
0 nfyu8txkcy7l9htqq8v08golvgypn tq96e18gxteze wf5n43u8aci7u1puckp4vxyt753o6cjr

I'm sorry, @steve-jansen! The comment is updated.

over 1 year ago ·
12485
D3b2094f1b3386e660bb737e797f5dcc

Hi @robsonsobral, thanks! It looks like this IE6 edge case effects Google's data center. However, it looks like it could work in IE6 if your hostname matches the subject of the SSL certs. Definitely good to know for anything hosted by Google, at the least.

over 1 year ago ·
12525
7ac967f3b1188db08c6fdd8a736d602c

You can also use python to start a simple webserver also.

Mac:
Navigate to the folder to use and enter:
python -m SimpleHTTPServer 8000

The number at the end is the port to use, open your browser and visit http://localhost:8000 You can use the default of port 80 if you wish and remove the port number entirely.

over 1 year ago ·