I have install on VPS a nodejs server with react front.
I buy comondo SSL, fix both server and domain and after that if i call http it shows Mixted type error.
SSL checker gives A grade to SSL. I use https.create to create the node server. Also postman gives correct result for http://example.com/5000/posts.
Mixed Content: The page at 'https://example.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://example.com:5000/posts'. This request has been blocked; the content must be served over HTTPS.
How i can fix this error ? Its axios , node or SSL problem ?
in the first step, you have to know what's the mean by Mixed Content, quoted from web.dev:
Mixed content occurs when initial HTML is loaded over a secure HTTPS
connection, but other resources (such as images, videos, stylesheets,
scripts) are loaded over an insecure HTTP connection. This is called
mixed content because both HTTP and HTTPS content are being loaded to
display the same page, and the initial request was secure over HTTPS.
to solve this problem, you must serve your API under SSL protocol.
Related
I am trying to make an XHR request to my dev server over http and the request gets blocked on Chrome or gets upgraded to https on Firefox which then never resolves. Is there a way to allow insecure requests on my site? The site too is insecure and the static html is served fine but the XHR gets blocked. It's not actually "mixed content" but Chrome treats it as such and blokcks the request.
The dev server is not served over https but the production server will be.
I have developed a node js application which works fine as long as use http. Now I need to upgrade the code too be able to work ssl and I am having problems to load the socket.io-client/socket.io.js file. (The rest is working fine. I installed the certificates and the server works well)
Firefox fails with the following message: Blocked loading mixed active content "http://"url"/socket.io/?EIO=3&transport=polling&t=NX-uS5E". which is weird because the link states a http request.
Chrome fails with this message: socket.io.js:3511 Mixed Content: The page at 'https://"url"?' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://"url"/socket.io/?EIO=3&transport=polling&t=NX-s_OB'. This request has been blocked; the content must be served over HTTPS.
It seems that socket.io-client is trying to load a resource using http instead of https. Is that possible?
How can I correct this? Any idea?
I have been searching the web for two days noow and I have not come to any indication of someone else having this issue
Ok, after letting it go for the evening and having a good rest I checked my whole code again and found the error!
I had one obfuscated code line where I was using a http request instead of a https one. I had to correct this on both, the server and the client side.
I also had to include the port number on each of the calls and force the socket on the client side to use polling instead of websockets by adding the option "transports: ['polling']"
I have deployed my angular application on a server using apache2 . This application communicates with a node application which is deployed on the same server which again communicate to a java application deployed to the same server. All the applications are running on different ports .
Now If I make a "http request like http::/path" I am able to get the response.
Now I have purchased a ssl certificate for my domain. From this i am able to access the front end but the api calls are failing.
I am making calls like "https:domainname.com:port/path" which doesnt work but If i do it like "http:ipaddr:port/path it works" from a rested client but on UI it throws error saying "he page at 'https://domain.in/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint http:ip:port" This request has been blocked; the content must be served over HTTPS.
not able to resolve this . Please suggest a solution.
you need to add proper CORS Header.
Take an look at https://developer.mozilla.org/de/docs/Web/HTTP/CORS
The error
"he page at 'https://domain.in/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint http:ip:port" This request has been blocked; the content must be served over HTTPS
is just a result of being on an https site and trying to make an XHR to a non-https site. So this error should disappear once you correctly set up https for all of your servers and configure your site to use the https://... url when making xhr.
I've been having this error in Chrome Developer Tools for a while and I just can't seem to find the insecure http:// request. It points to my domain but without https://. http://www.example.com/ is not a script so I don't understand where it's coming from.
Mixed Content: The page at 'https://www.example.com/categoy/a-product.html'
was loaded over HTTPS, but requested an insecure script 'http://www.example.com/'. This request has been blocked;
the content must be served over HTTPS.
Mixed Content: The page at 'https://www.example.com/categoy/a-product.html'
was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://www.example.com/'.
This request has been blocked; the content must be served over HTTPS.
Thanks
I had a similar issue. Is the page you are hosting a single page application with HTML5/history/push-state routing?
This type of routing goes by many names, but what it does is replace your hash-based url https://address.com/page/#client/side/route with regular routes such as https://address.com/page/client/side/route. When the files are hosted with a static file server, the file server may not know about the client-side routing and return a 404 instead of routing everything to index.html. Apparently, this can lead to the problem you described in Chrome even though the page might appear to work.
In short, many static file hosting tools are not suitable to serve a SPA with HTML5 routing, notably http-server (https://github.com/indexzero/http-server/issues/80). Try a different tool (e.g. serve) or use nginx with try_files $uri $uri/ index.html.
This means your web page is being accessed over https, but it uses resources that are served over http. Modern browsers like Chrome consider this as a security risk. The browser does not load the http resources and shows a warning in the developers console.
The solution is to change the protocol method from http to https for all resources that are being accessed over http.
See this link: https://developers.google.com/web/fundamentals/security/prevent-mixed-content/fixing-mixed-content#alternatives_to_csp
I am making a self-hosted app, and I would like to require HTTPS since sensitive informations might be sent. How can I tell if client is using a secure connection ?
I could use javascript in the browser, but this wouldn't be secure (since an attacker could just bypass this)
The node server might be running as HTTP, but behind a secure nginx/apache proxy.
Optionnally, I would need to enforce this rule every time someone is making a request.
Well you can configure your web server so it redirects the user to the HTTPS url from a HTTP url. Apache htaccess is commonly used ensure that a website is accessible only over HTTPS. See this link for more information: http://www.askapache.com/htaccess/ssl-example-usage-in-htaccess/#redirect-http-to-https