1

I'm trying to set up a reverse proxy on the development server for my VUE js webapp to get around the CORS issue that I was getting when I was trying to use my flask HTTP APIs with the vue js webapp.

I did this by creating a vue.config.js file in the root of the project directory:

module.exports = {
  devServer: {
    proxy: 'http://localhost:5001/'
  }
}

when I run npm run serve, and try to use a REST API defined on port 5001 - I don't see the request going to port 5001, it uses the same port as the web app.

And there are no useful logs being written to stdout either to help me debug this.

Has anyone come across this issue before ?

user12246781
  • 11
  • 1
  • Usually you want to proxy only the API requests, so usually the config looks like `proxy: { '/api': { target: 'http://remote_api.com:5001/', changeOrigin: true } }` – IVO GELOV Jun 21 '20 at 15:16
  • 1
    @IVOGELOV I do realize that. I was just trying to get the simplest config change working. But it seems like the config file is just not being picked up by `vue-cli-service` – user12246781 Jun 21 '20 at 15:51
  • 1
    You can confirm if the file is not picked up by intentionally making a syntax error in the file. – IVO GELOV Jun 22 '20 at 06:51

1 Answers1

0

I had a similar issue and found that the port was already in use by another application and hence it was not going to the correct port. Once i shutdown the other app, it started working as expected.

neelmeg
  • 2,459
  • 6
  • 34
  • 46