在Vue js中为axios设置baseUrl发出请求答案

【问题标题】：Setting baseUrl for Axios in Vue js sends out request在Vue js中为axios设置baseUrl发出请求
【发布时间】：2018-12-23 21:06:14
【问题描述】：

在我的应用程序中，我使用 Axios 来处理我的 API 请求。在 main.js 中，我设置了 baseUrl。无需我发出请求，它只需设置 baseUrl 即可自行发出请求，因此始终在浏览器中加载应用程序时发出请求。

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

一切正常，但对 baseUrl 的请求返回 500 以表示未请求数据。

main.js 中的实现：

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

配置：

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

然后在另一个文件中我执行export default {}，其中包含：

getLang(payload) {

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

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

有谁知道如何取消这个请求，或者有没有更好的方法来设置 baseUrl 而不会出现这个“错误”？

【问题讨论】：

标签： javascript vue.js axios

【解决方案1】：

我试图复制您的问题，但对我来说效果很好，您是如何实施 Axios 的？你用的是哪个版本？

[编辑] 建议的解决方案

将其用作 Nuxt 插件

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

您可以在下面的 cmets 中找到更多信息

【讨论】：

我正在使用"axios": "^0.18.0"
所以当你实现这个时，没有（get）请求发送到 url？
不，不是，我复制了您的同一行代码，并且使用的是相同的 axios 版本，您是否尝试过使用 axios.create 代替？
const axios = require('axios') module.exports = axios.create({ baseURL: 'domain.nl/path/to/my/api' })
感谢您的提醒！我的配置 (axios({) 我添加了 .create (axios.create({) 并且成功了。感谢您的帮助和时间！

【解决方案2】：

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


Vue.prototype.$http = Axios;

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

确保 baseURL 不是 baseUrl

【讨论】：