I'm creating a Progressive web app and need to make requests to an API which is HTTP and doesn't have HTTPS. Can't change the app to HTTP as PWA's require HTTPS, can't change request link to https.
Getting this error:
Mixed Content: The page at 'https://current-site.herokuapp.com/' was
loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint
'http://the-api.com/api/customer?$filter=contains(CustomerName,%20%27test%27)&$select=CustomerName,CustomerId&$top=10'.
This request has been blocked; the content must be served over HTTPS.
Hoping there's a way around this. Currently using nodejs and express to serve. Requests are being made from frontend vuejs with axios.
Thanks for helping.
Shy of using an insecure or old browser, or telling your users to use some command line flags before surfing the web, there is not a direct method for this. This is by design and would be a major security flaw if apps could do this directly.
However, if you're determined to use the insecure API, you can write an HTTPS proxy API on your server, that turns around and does the request to the real API over HTTP.
Related
I have a Nginx webserver in front of a Node REST API delivering JSON formatted data.
I also have a web app which consumes the above API and works fine for a majority of the requests it makes but sometimes, for certain URLs, the client gets a CORs error aka an 'Access-Control-Allow-Origin' error.
When I call the data again from the server of the web app it works fine again.
Could anyone shed some light on this issue.
I am using axios to call the API from the web app
You need to add CORS headers in response so that api can be accessed from browser.
You can use npm cors package https://www.npmjs.com/package/cors
I'm working on a single page app that uses Backbone.js and marionette on the front end, and Django with Tastypie on the back. I just added a ssl certificate to the web server, and redirected all the http traffic to https.
Everything seems to work fine except for the backbone (sync) request that continues to send request over http, causing the browser to block those requests, and I don't know how to tell backbone to use https by default.
The backbone models url/urlroot are relative so they should take the same protocol as the rest of the site right? Thanks,
Backbone.sync is a wrapper around jQuery.ajax(...) in the end. You are correct that Backbone (via jQuery) should use the protocol of the hosting page. And the Same Origin Policy dictates the browser reject any request made to a different host, port, or protocol.
All this suggests the way you're hosting the page is getting jQuery's signals crossed. If you access the page directly via HTTPS instead of relying on the HTTP --> HTTPS redirect, does it work? If so, the problem isn't a Backbone one, but a hosting one.
I'm developing an angular application that executes ajax calls to web services to get/post data. The issue is that my app runs under a secure protocol (https), but the services are exposed using a non secure protocol (http) so everytime it tries to get/post data Ithe console shows this message: "Mixed content: the page https://myappdev.abcdomain.com/app/index.html was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://myservice-a-bus.abcdomain.com/moduleUserApp/verifyUser'. This request has been blocked; the content must be served over HTTPS." I found this is related to Cross-Domain Resources and that the xdomain patch would fix it. So I tried implementing it but I can't figure out where to add the proxy.html file. Below is where my app is and some of the services I call:
Angular app is
https://myappdev.abcdomain.com/app/index.html
The services I call are (get/post):
http://myservice-a-bus.abcdomain.com/moduleUserApp/verifyUser
http://myservice-b-bus.abcdomain.com/moduleFriendList/get/{"friendList": "ListA"}
http://myservice-c-bus.abcdomain.com/moduleCountryList/get/{"countryList": "Canada"}
Hope anyone can help with this issue.
I have a local html file in may desktop accessing a web api (JAX-RS) that responds with some JSON data. I enabled CORS and everything works fine, but only without SSL. How can I do to make it work with SSL? I use a self-signed certificate and can call this web api from a WPF application, but from a JavaScript application (standalone html file), when Chrome sends the OPTIONS pre-flight before the POST, the request seems not to even reach the server. I also tried to import the self-signed certificate in the browser, but nothing has changed.
The preflight request is not allowed to include an entity body or credentials. If you are using preflighted requests then you cannot use two way SSL.
The solution is to change the server to make the certificate optional. I've only done this using Apache HTTP server or Tomcat but I assume other servers are also capable of this.
In apache the setting should be changed to
SSLVerifyClient optional
and in Tomcat the SSL settings should be changed to
clientAuth="want"
Without this change only CORS simple requests will work.
i have in my localhost:8111 a restlet app running. This app have a ServerResource that respond http requests from a javascript api that i'm doing.
This Javascript api is running in my apache in localhost, and i want to do http request to the localhost:8111, but i can't for the cross domain problem.
The restlet response in json, which solution is the best in this case?
Thanks!
The same as any other case.
CORS if you want control and are willing to sacrifice some cross-browser support.
JSON-P if you can live with GET only requests and no security over which sites can trigger the request
A proxy on the same origin if you don't need the final server to get credentials directly from the client