Setting baseUrl for Axios in Vue js sends out request

问题

In my app I use Axios to handle my API-requests. In main.js I have set the baseUrl. Without me making a request it makes a request on its own just by setting the baseUrl, so always when the app is loaded in the browser.

In my main.js axios.defaults.baseURL = 'https://domain.nl/path/to/my/api

All works fine but a request to the baseUrl gives back a 500 for not requesting data.

The implementation in main.js:

import axios from 'axios'
import VueAxios from 'vue-axios'

config:

axios.defaults.baseURL = https://domain.nl/path/to/my/api
axios({
withCredentials: true,
credentials: 'same-origin',
headers: { 'content-type': 'application/x-www-form-urlencoded' }})

Then in another file I do an export default {} which contains:

getLang(payload) {

    payload.method = 'GET'
    payload.url = 'lang';

    return axios(payload).then(result => {
        return result.data
    });
}

Does anyone know how to cancel this request or is there a better way to set the baseUrl without this 'bug?

回答1:

I have tried to replicate your problem but it works fine to me, how are you implementing Axios? Which version are you using?

[EDIT] Suggested solution

Using this as Nuxt plugin

const axios = require('axios')
module.exports = axios.create({
  baseURL: 'domain.nl/path/to/my/api'
})

You can find more info in the comments below

来源：https://stackoverflow.com/questions/51359758/setting-baseurl-for-axios-in-vue-js-sends-out-request