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.
Related
So I have an API endpoint to which CORS requests sent over http are redirected with the http 308 permanent redirect in the response. In Firefox, the response is as expected, a 308 status code with the upgraded https location header to which Firefox outright rejects and refuse to redirect/upgrade to https. In Chrome however, the response from the API with the header Non-Authoritative-Reason: HSTS is set, to which Chrome performs 307 an internal redirect. I understand why Chrome(cause of HSTS) does this, but how is this behavior isn't implemented in Firefox. In Firefox, the browser just rejects the CORS response despite the 308 redirect URL, while Chrome fakes a request and then upgrades automatically to the https version of the URL.
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.
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 am injecting some script tags in a website, with source such as http:localhost:3000/css/my-page-css.css . While its working on almost all sites, there's this particular website that is somehow sending all my http requests as https. How do I handle such a case?
I have configured an https server also on my nodejs app which listens to port 8443 and http listens to 3000. But, when I inject my script tags, they have src URLS which point to port 3000. So even if I have an https configured on my nodejs app, it won't work since it would be listening to a different port.
You are using HTTP Strict Transport Security (HSTS)
Using the securityheader.com website on your URL, or Chrome Developer tools we see the following HTTP Header is sent back by your site:
Strict-Transport-Security max-age=7889238
This HTTP Header will be configured in your webserver and is a way of your webserver telling the browser "For the next 7889238 seconds only use HTTPS on this domain. If someone tries to use HTTP (either by typing or by clicking on a link) then automatically switch HTTP to HTTPS before you send it on to the server."
This is a security feature as currently the default (if a scheme is not explicitly given) is HTTP. This allows website owners to switch the default and, even strong that that, prevents it being able to be switched back.
HSTS is set at a domain level and it is not possible to have it on for one port (e.g. 443) but not for another (e.g. 3000) - it's either on for that domain or off.
If you really want to use HTTP then you need to remove this header and remove the remembered value of this header from your browser. While chrome allows you to do this by typing chrome://net-internals/#hsts in the URL and using the delete option, the easiest way to do this is to change the max age from 7889238 to 0, and then load the website again. And then remove the header completely.
This can be especially annoying for sites like localhost where you proxy requests and inadvertently set it for that dummy host name. You should see if your node proxy server allows you to strip off that HTTP header. Some might say it would be better if browser makers ignored HSTS for localhost, however I think it would be better if developers just stopped fighting HTTPS and used that even for development environments using a self-signed certificate that is added to your local trust store. This was you can avoid problems like mixed content, and also use features that are HTTPS only (including Brotli, HTTP/2, Geo Location...etc.) while developing (though some browsers like Chrome still allow these on http://localhost).
Alternatively set up a local DNS alias for each of your dev sites and use that with or without HTTPS as appropriate for the site in question.
I understand the CSP that won't allow mixed content on Firefox and Safari, though Chrome allows it.
Is there any way to whitelist an HTTP call to http://localhost:1234 from an online website accessed via HTTPS (without modifying browser config)?