WeSt WeSt - 1 year ago 101
HTTP Question

Mixed content error for http express route

I'm running a local node js server on my machine and I provide it with a

ngrok.io
domain.

If I run it local in the web browser with
localhost:3000
or with
http://1234.ngrok.io
everything is ok. If I call it with
httpS://1234.ngrok.io
I get the error

Mixed Content: The page at 'https://1234.ngrok.io/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://localhost:3000/calculation'. This request has been blocked; the content must be served over HTTPS.


caused because the route is not http. How can I fix this?

This is the app.js on my node.js

const express = require('express');
const app = express();
const https = require('https');
const http = require('http');
const fs = require('fs');

app.use('/', express.static(__dirname + '/../Client'));

var options = {
key: fs.readFileSync('./https_certificate/client-key.pem'),
cert: fs.readFileSync('./https_certificate/client-cert.pem')
};

app.listen(server_connection.port, () => {
console.log('Server started on port ' + server_connection.port);
//do stuff
});

//load the index.html from the server
app.get('/', function(req, res) {
res.sendFile(path.join(__dirname + '/../Client/index.html'));
});


This is the other file with the route who causes the error:

const express = require('express');
const router = express();
router.post('/calculation', function(req, res) {
//do stuff
}


I already tried to configure the server for https how you can see on the
options
object in the first file but this resolved in a 502 Bad Gateway.

I also would like to use just https. Is it possible to redirect to https if someone uses http?

Answer Source

It seems that you are sending an ajax request using http to the server, make sure that all your ajax calls are over https to get ride from this error.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download