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 = '

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 = 
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?

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?

• javascript
• vue.js
• axios

2 Answers 2

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 ments below

import Vue from "vue";
import Axios from "axios";


Vue.prototype.$http = Axios;

Axios.defaults.headers.mon = {'X-Requested-With': 'XMLHttpRequest'}
Axios.defaults.baseURL = (process.env.API_PATH !== 'production') ? 'http://localhost:8000/api/' : '';

Ensure baseURL not baseUrl