Javascript / Three.js is not working in https - javascript

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.

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>

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.

Related

HTTP and HTTPS version of a same page render differently

Here are the links to the page in question:
http version
https version
The https version of the page doesn't render the video embedded on the top of the article. I inspected the source code and found that HTTPs is missing an entire block of code, as you can see in the images below:
I wonder how this happens? Isn't http(s) just the protocol to communicate with the server? Why do I get different code by using different protocols?
From Chrome Developer Toolkit:
The page at 'https://www.eyeviewdigital.com/blog/eyeview-launches-addressable-tv-ads-with-cablevision-dish-programmatic-tv-w-clypd-and-wideorbit/' was loaded over HTTPS, but requested an insecure script 'http://pshared.5min.com/Scripts/PlayerSeed.js?sid=281&width=480&height=401&playList=519141523'. This request has been blocked; the content must be served over HTTPS.
You typically need to load your content in either http or https. Mixing them together results in the error above.
On line 252 replace
http://pshared.5min.com/Scripts/PlayerSeed.js?sid=281&width=480&height=401&playList=519141523
with
https://delivery.vidible.tv/aol?sid=281&width=480&height=401&playList=519141523.js
Long story short the content was never loaded so the page looked different.
You're right that there should be no difference based on http/https as it is just the transport layer. There must be something in the server's code that is producing the html, that behaves differently based on the url used to make the request. I suggest you provide information on the web server code to help analyse the issue.
This is most likely caused because you're loading elements from insecure sources. Google Chrome for example, loading an image over http when your page is loaded over https can result in the image not loading at all. This is all for security purposes, of course. Just go through all of your code and make sure all sources are accessed through secure https so that they load in properly.

Javascript not rendering correctly when accessed via https

Relatively self-taught user over here, so not sure if this is basic, but Google is indexing our site via https. Which, when you click to get to the home page, is not rendering a section that has a javascript on it. All the text is laid on top of each other, rather than rotating through.
However, if you go to our home page with the address http:// the java is working fine. Any help correcting this would be great.
Thanks!
You have to serve your JS over https as well, because when your https page refers to http content it is considered as insecure data, and your browser won't load it.
It looks like you are using absolute urls for your scripts. or cdn without https. if yes, use relative urls for your local script and use https:// for cdn script paths. You can simply define //cdn path without http: or https: so that the script will load according to the site path.

Why are HTTP images not appearing in HTTPS application?

I have secured (HTTPS) ASP.Net MVC 4 application that uses unsecured (HTTP) ArcGIS map services. These services are called using JavaScript to get relevant map images.
If I use HTTP for my app, everything works as expected. But if I use HTTPS, IE10 and Chrome do not display the requested map images (IE prompts to display unsecured content) but Safari shows the image, no questions asked.
As an example, say my application is https://app.mydomain.com and my map services are at http://gis.mydomain.com
I run fiddler and see the response as something like (removed some parameters to simplify): http://gis.mydomain.com/arcgis/rest/services/Energy/BaseService/MapServer/export?....&f=image
but the image is not shown. If I enter this URL directly into my address bar, the expected image is shown.
There are no errors reported anywhere, including IIS 7.5 logs. I realize that mixed content is not ideal but I have no option at the moment. I have found lots of references to SilverLight with regard to this type of problem, but I am only using javascript and ASP.Net. I also compared the page source for both https and http - there is no difference.
While browsing a secure site, the browser will not load "nonsecure items" unless you (the visitor) authorize it.
The only way to solve this from server-side is by making the "nonsecure" content secure, by placing it under a https domain aswell.
Update:
By the way, if you don't specify the protocol in the content URLs, for exemple //gis.mydomain.com without specifying if it is http:// or https://, the browser will automatically assume the same protocol that was used to access the website to load this content too.
So if you access with http:// it will load the dependencies using http:// as well, and if you use https:// it will do the same.
Another way of getting around this is to proxy the insecure content via your (https) host. ESRI have some slightly out-of-date docco on this process (including an example ASP.Net proxy page) here, but most/all of it should still hold in the latest versions of the API. From memory, they recently (3.5?) made the proxy configurable on a per-service basis, which is very handy.
You can ignore the token-based authentication stuff in your case, all you're really looking for is to have the insecure content come through a secure host.

loading http javascript in https javascript

I have a web application which has root html and this html (say index.html) loads some java script. This application is accessible through https and I want to load one java script which is exposed over http.
https://mydomain/index.html contains this line of code:
<script src="http://unsecure/custom.js" type="text/javascript"/>
When I try to run my application thorugh IDE everything works fine but problem happens when I bundle my application in war file and run it.
It fails to load the included java script by saying:
[blocked] The page at https: //mydomain/ ran insecure content from http: //unsecure/custom.js.
Is there any way to load this unsecure javascript or do I need to publish this unsecure javascript through a secure way and then access it (can change this included java script protocol from http to https)?
All content which is used by a site, which is accessed through HTTPS, must use HTTPS as well, otherwise you get this warning.
The reason for this: If not all content of a HTTPS site is HTTPS, the browser can't tell that the site is "secure" and therefore gives the user a warning.
You could either do below two things:
1) Download it over your local and create war. Then you would be using relative path.
2) Place in some https location.
If its a third party library and you do not have control on the frequent changes that would happen for this library, you could ask them to put it in https. Majority of the times hosted JS would be both http and https too.

Mixed Content Warning IE: What matters; css, images, everything?

I have just moved my site from http to https and IE-9 started showing non-secure content warning at home page. This warning is understandable because i have one http call to googleapi for getting jquery script. But when I login and enter the inner pages there is no warning from IE despite the fact that most of the images are coming from other servers through http protocol.
So the question: Is getting image over http is fine when accessing site over https? Does only css and js matters? or shall I have to get all the data through HTTPS? If so how is my scenario justifiable (getting images over http from other server on https page without warning)?
If you load CSS and JS over HTTP then an attacker can inject executable code. Unfortunately IE will execute JavaScript within CSS. The problem with loading images over HTTP from the same domain is that the browser will likely spill the session id in plain text which is a violation OWASP a9.
You can use the protocol-relative URL on all your urls to avoid this issue in IE.
Basicaly, instead of linking to a js/image/css by using its full path with the protocol, you instead link to it by leaving out the protocol bit and just using a double slash, //.
This will have the effect of all the above links inheriting the protocol from the parent page.
Of course this depends on you having valid SSL certs on the domains you're serving the different files form.
One other thing to note also is that images in your pages or CSS that are done using data URI could also cause mixed content warnings in IE.
To find out what files are causing issues, I recommend using Fiddler
There is also another tool that a fellow SO user, Eric Law wrote:
Install it from http://www.bayden.com/dl/scriptfreesetup.exe and you will get a different mixed content prompt which shows the exact URL of the first insecure resource on the page. That tool is basically a prototype and you should uninstall it when you're done with it. It works on IE8 and you should install it as admin.

Categories