webpack dev-server proxy over https

Question

I'm having the hardest time getting my webpack dev server to proxy to my backend.

I'm using Vue and the webpack cli template.

My back end is hosted in a docker container and can be seen at localhost:8443/foo

My devServer config is set up as:

dev: {
  proxyTable: {
    '/foo': {
       target: 'https://0.0.0.0:8443',
       secure: false,
       changeOrigin: true,
  },
  host: '0.0.0.0',
  port: 9000,
  https: {
    pfx: /path/to/pfx/file,
    passphrase: 'password',
    ca: /path/to/ca/file,
  }

Like I said earlier I can get to my api when I point my browser to https://localhost:8443/foo

When I run my webpack server and try to get to https://localhost:9000/foo I get the error message:

Error occurred while trying to proxy request /foo from localhost:9000 to https://0.0.0.0:8334 (EPROTO)

I can't see what I'm doing wrong and there are no errors in my backend about connecting. I don't think my proxy is even connecting.

The docker command that I'm running on the web server is:

docker run -d --env-file=service.env -v /path/to/certs:/docker/path/certs -v /path/for/logs:/docker/path/logs -p 8443:8443

The webpack dev server is not running in a docker instance.

What does your Docker Run command look like? Do you have the port open to let traffic come through? Also are you running your vue dev server inside of a docker container? — Necevil

lmcadory lmcadory · Accepted Answer · 2018-02-12T13:59:18

Solved my own problem.

I had to break out the target key and add SSL tags to it.

Instead of passing server creds to the https tag, I did it all in the target tag.

webpack dev-server proxy over https

1 Answers