Content hosted by github pages doesn't show up perfectly

Question

I was experimenting with github after building a little webapp as a project for free code camp. After hosting it on github pages it shows up broken. Most of its content is blocked. This is the link https://mojojojo77.github.io/ On mozila it says that the connection is secure but "firefox has blocked parts of this page which are not secure." I looked into the console for the problem and the API's I used seem to be cause. Is there a way to bypass this ? Like asking the user for permissions.

Answer 1

Load your resources using a // protocol instead of http:// or https://. That will cause the browser to request resources using a protocol that matches the page (using SSL if the page does, and not if it doesn't).