Javascript / Three.js is not working in https

Question

I recently switched my http site to https.

Since I made this change, one of my projects no longer works.

In this random generator, the background using the Three.js library does not appear when the url is in https

But in http , it works beautiful and well.

Does anyone know any solution to this problem?

Thank you for your consideration in this matter.

Answer 1

You can download the three.min.js file and save it on to your https server.

And instead of loading the script from http server, provide the path of your https server where you put the three.min.js file.

<script src="https://[path to your server]/js/three.min.js"></script>

Answer 2

Open your developer tools and look at the console, you'll find the explanation:

What this means is that you're not allowed to have an https:// site that loads some content via http:// . This is called "mixed content" and it's a security vulnerability. If you're serving a secure site, make sure all your content is using the HTTPS protocol.