I am including a JS library into my website
<script type="text/javascript" src="http://www.turnjs.com/lib/turn.min.js "></script>
that is designed, maintained and hosted by a webdesign company. The implementation of what I am trying to achieve seems to be well coded – see my JSFiddle – it works fine with no errors. However when a copy and paste the code from my JSfiddle into my website, it doesn’t work at all – Google Chrome developer console shows this:
GET https://www.turnjs.com/lib/turn.min.js net::ERR_SSL_PROTOCOL_ERROR
But it is weird, since my Jsfiddle code is including the same turn.min.js and it works there, but on my website it doesn’t.
This is not a javascript problem, it's an ssl probem.
You can't get a file through an insecure connection (http) from a html page served through a secure connection (https). If you're going to use https (and you SHOULD!) then you need to get the script through a secure connection. To get the file, you should use:
<script type="text/javascript" src="https://www.turnjs.com/lib/turn.min.js "></script>
And make sure that the file is being served through https, by configuring the server accordingly. Here's a simple configuration for lighttpd, and here's one for apache. If you don't have a CA signed certificate, you could get one with letsencrypt ( www.letsencrypt.org/getting-started/ ). If you don't control the server, you should get in contact with the person who does.
<script type="text/javascript" src="http://www.turnjs.com/lib/turn.min.js "></script> will cause problems in any cases for your site, because this is an example of mixed content which will be blocked by almost all browsers. Copy this file on your server and then include local version
I prefer include script to the pages in that way:
<script type="text/javascript" src="//www.turnjs.com/lib/turn.min.js "></script>.
That allowed browser to check connection type itself. Which is actually won't work in you case (see p.1).
An very good explanation in Google developers