Project not loading a library when imported into Chrome+Codio

Question

I just migrated a working JSfiddle project to Chrome+Codio. I did an exact copy-paste. It failed with the error message:

<p>[blocked] The page at <a href="https://d.codio.com/hugolpz/Censorship-zh/App/index.html">https://d.codio.com/hugolpz/Censorship-zh/App/index.html</a> ran insecure content from <a href="http://maps.google.com/maps/api/js?sensor=false">http://maps.google.com/maps/api/js?sensor=false</a>. 
Uncaught ReferenceError: google is not defined index.html:51 
window.onload</p>

It works on JSfiddle (Chrome, Firefox), and Codio with Firefox. It confirms that the JS/HTML/CSS is valid.

It doesn't work on "Chrome + Codio.com". The Google map API link is ok on fiddle.net, but flagged "insecure".

What is the source of this Chrome-Codio failure?

[3]: [except chinese characters addresses but it doesn't matter right now]

Answer 1

Explanation: This issue is due to Chrome. When Chrome is on a secure website (https://Codio.com), it refuses to call non-secure (http://) external resources.

---

Solution/Workaround 1: Also, instead of

<script src="http://mysite.org"></script> // which is forbidden by Chrome!

rather use:

<script src="//mysite.org"></script>

---

Solution/Workaround 2: I've been noticed[1] that Codio projects can be run on both https:// and http:// urls. So if your project get in trouble when run as :

https://d.codio.com/myName/myProject/App/ 

switch to no-secure url:

http://d.codio.com/myName/myProject/App/

And all the external ressources should load fine.

[1]: Big thanks to Joel Moss for this explanation and tips !