CODEWITHSUNDEEP
vue.jsquasar-framework
Juan Piza Ferra
Juan Piza Ferra

Reputation: 120

Can't connect to backend after quasar build

I have a project made with quasar, I have a proxy that maps the calls on the app to my backend API, but when it builds using quasar build it generates the dist folder, for testing I use a server if it works but the calls that the app makes don't work enter image description here

This is supposed to make a call to http://localhost:8080/getCategories

Here is the proxy conf:

proxyTable: {
  '/api': {
    target: 'http://localhost:8080/',
    changeOrigin: true,
    pathRewrite: {
      '^/api': ''
    }
  }
}

When I try it with dev server, dev server running on 8081 enter image description here

I do not know if I have to change the API calls, all the calls I do are like this.$http.get('/api/getCategories') for a sample.

Not sure if I explained things clearly, hope someone can help, thanks!

Upvotes: 2

Views: 2680

Answers (1)

Juan Piza Ferra
Juan Piza Ferra

Reputation: 120

SOLVED

I've fixed that, don't know if this is the correct way, will try to explain for other people that may have had the same problem.

First of all i've removed the proxyTable from the config/index.js, then added one environment, one in the config/dev.env.js that looks like this:

var merge = require('webpack-merge')
var prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  API: "'http://localhost:8080'"
})

and one for the config/prov.env.js that looks like this:

module.exports = {
  NODE_ENV: '"production"',
  API: "'http://my-website.com:8080'"
}

Then all the AJAX calls that I've used with VueResource look like this:

this.$http.get(`${process.env.API}/path/`)
    .then(response => response.json(), console.log)
            .then(response => {
                 console.log(response)
            })

Totally worked for me, hope someone's find this useful!

Upvotes: 1

Related Questions