Docker ERR_SSL_PROTOCOL_ERROR

Question

I have 2 docker containers running on a server:

1. Frontend Vue.js app (0.0.0.0:6336 -> 443/tcp)
2. Express Backend (0.0.0.0:8000 -> 443/tcp)

When the frontend tries to communicate with the backend, with this request:

https://host:8000/query

I'm getting this error:

net::ERR_SSL_PROTOCOL_ERROR

The backend has a certificate applied to it like so:

app = https.createServer({
    key: fs.readFileSync('private_key.key', 'utf8'),
    cert: fs.readFileSync('cert.crt', 'utf8')
}, app)

If I run both of these apps locally, it works fine. I feel like this is a simple fix but I'm pretty new to Docker so I don't know where to begin.

If I change it to http , I get this error:

xhr.js:178 Mixed Content: The page at 'https://host:6336/#/search?subject=a' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://host:8000/query'. This request has been blocked; the content must be served over HTTPS.

Answer 1

My problem was adding the listen statement before the https server was created, I didn't realize that the order mattered. Before it was like this:

var app = express()

app.listen(PORT, function() {
  console.log(`Listening on port ${PORT}...`)
});

const options = {
  key: fs.readFileSync(keyPath, 'utf8'),
  cert: fs.readFileSync(certPath, 'utf8')
}
app = https.createServer(options, app)

return app

The listen should come after creating the https server:

var app = express()

const options = {
  key: fs.readFileSync(keyPath, 'utf8'),
  cert: fs.readFileSync(certPath, 'utf8')
}
app = https.createServer(options, app)

app.listen(PORT, function() {
  console.log(`Listening on port ${PORT}...`)
});

return app