Webpack dev mixed server content error

Question

I am running the React website on Cloud9 using a webpack-dev server, so it serves content over https. The problem is that when I try to execute some ajax (network) request on an external http link, this results in the following error:

Mixed content: the page on the "https: // ..." page was loaded over HTTPS, but requested the XMLHttpRequest "http: // ..." unsafe endpoint. This request is blocked; content must be transmitted via HTTPS.

Is there any trick for setting up webpack to make it possible to get request data from http?

Answer 1

There is probably no solution for webpack-dev server, but for nodejs

The following is useful:

app.use(function(req, res, next) { if (req.headers['x-forwarded-proto'] == 'https') { res.redirect('http://' + req.hostname + req.url); } else { next(); } });