nuxt-community / axios-module

Secure and easy axios integration for Nuxt 2
https://axios.nuxtjs.org
MIT License
1.19k stars 245 forks source link

baseURL not working in asyncData #508

Open darrenchiu opened 3 years ago

darrenchiu commented 3 years ago

It seems that baseURL is not working in asyncData. Requests always sent to localhost.

nuxt.config.js

modules: [
    '@nuxtjs/axios',
    '@nuxtjs/auth-next',
  ],
axios: {
    baseURL: 'http://localhost:8000',
  },

pages/index.vue

  async asyncData({ params, $axios, $auth }) {
    const courses = await $axios.$get(
      `api/students/${$auth.id_slug}/enrollments/`
    )
    return { courses }
  },

Would be good if anyone could shred some light on this. This is supposed to be a very simple one i am guessing... Not sure what I missed

geoffreylzf commented 3 years ago

I also facing this problem, I had to change back ver 5.12.5 instead of 5.13.6

martianmartian commented 3 years ago

It seems that baseURL is not working in asyncData. Requests always sent to localhost.

nuxt.config.js

modules: [
    '@nuxtjs/axios',
    '@nuxtjs/auth-next',
  ],
axios: {
    baseURL: 'http://localhost:8000',
  },

pages/index.vue

  async asyncData({ params, $axios, $auth }) {
    const courses = await $axios.$get(
      `api/students/${$auth.id_slug}/enrollments/`
    )
    return { courses }
  },

Would be good if anyone could shred some light on this. This is supposed to be a very simple one i am guessing... Not sure what I missed

i'm afraid no one can "shred light" for you.... we are mortals

nwittwer commented 3 years ago

Running into the same effect.

Versions: nuxt: 2.15.7 @nuxtjs/axios: 5.13.6 @nuxtjs/composition-api: 0.24.6 vuex: 3.6.2

Use case:

In my particular case I'm using the useStore function from @nuxtjs/composition-api to trigger a Vuex action which asynchronously awaits an Axios $get() call.

Let's say I have Nuxt on localhost:3000, and my API on localhost:8000/api

nuxt.config.js

axios: {
  baseURL: 'http://localhost:8000/api',
}

store/myfile.js

await $axios.$get(`/students/${$auth.id_slug}/enrollments/`)

Expected result: Axios should query the full URL, automatically filling in the baseURL used in the Nuxt Axios config (nuxt.config.js) http://localhost:8000/api/students/123/enrollments/

Current result: An Axios request is made only to the /students/${$auth.id_slug}/enrollments/ path without the baseURL, causing it to fail.

If I inspect this.$axios.defaults.baseURL, I see: http://localhost:3000... which is not what I set in nuxt.config.js. If I inspect process.env.API_URL (which I've also set), I see: http://localhost:8000/api. So for some reason Nuxt-Axios is not using the config?

vedmant commented 3 years ago

I have the same problem:

axios: { baseURL: process.env.API_URL, },

is just ignored

devzom commented 3 years ago

Let's try to set different config with public & private config "Options - Axios Module" https://axios.nuxtjs.org/options#baseurl

DaDoBaag commented 3 years ago

Have you tried setting browserBaseURL in publicRuntimeConfig?