API Proxy

boriscy

I have tried to use the API proxy like in the docs http://quasar-framework.org/guide/app-api-proxying-for-dev.html

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

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  proxyTable: {
    // proxy all requests starting with /api to jsonplaceholder
    '/api': {
      target: 'http://localhost:4000/api',
      changeOrigin: true,
      pathRewrite: {
        '^/api': '/api'
      }
    }
  }
})

But when I do ajax request calls it calls to http://localost:8080/api/client_register instead of http://localost:4000/api/client_register, my api methods are:

import axios from 'axios'

export default {
  createUser(cb, userData) {
    axios.post('/api/client_register', {user: userData})
    .then((res) => {
      cb(res.data.user)
    })
    .catch((error) => {
      console.log('error', error)
    })
  }
}

rstoenescu

@boriscy Change in ‘/config/index.js’ not in dev or prod files. Please reread example page.

boriscy

@rstoenescu Thanks a lot for your patience

hata

Hi all,
I already change in ‘/config/index.js’ but it is not effected when I run “quasar dev”
ex:
dev: {
env: require(’./dev.env’),
cssSourceMap: true,
// auto open browser or not
openBrowser: true,
publicPath: ‘/’,
port: 8080,
// Proxy your API if using any.
// Also see /build/script.dev.js and search for “proxy api requests”
// https://github.com/chimurai/http-proxy-middleware
proxyTable: {
‘/auth’: {
target: ‘http://localhost:3000’,
changeOrigin: true,
pathRewrite: {
‘^/auth’: ‘’
}
}
}
}

boriscy

I have found that API proxy helps for development but when you build a cordova app it doesn’t work so I decided to include complet URLs for all the requests in main.js

if(DEV) {
  window.apiUrl = 'http://localhost:4000'
}
if(PROD) {
  window.apiUrl = 'https://example.com'
}

and when I do calls

axios.get(`${window.apiURL}/resource`)
...

No More Posting New Topics!

API Proxy