webpack-dev-server config for CORS requests

Question

I'm trying to configure a React dev environment to hit a https endpoint that requires certificate credentials to access. When I hit the endpoint in a browser tab I'm asked for my cert, and once supplied I can see the JSON data.

I've tried a number of things to get it working but get nothing but 500 failed proxy requests (via webpack-dev-server's proxy config and trying to hit a rewritten endpoint) or CORS errors. I've tried via fetch requests, axios requests, etc.

Does anyone have a guide on how to effectively deal with this in development? The code will be fine once deployed, as it'll all be on the same domain, but during development when previewing from localhost it's frustrating.

Do I need to setup a local proxy aside from webpack-dev-server?

Answer 1

Have you tried CORS middleware ?

npm i cors

const cors = require('cors')
const app = express()
app.use(cors()) // <---

// ...

app.use(require('webpack-dev-middleware')(webpack(webpackConfig),{}))