axios url 请求的相对路径需要本地但非托管服务器的“/”前缀答案

【问题标题】：Relative path for axios url request requires a '/' prefix for local but not hosted serveraxios url 请求的相对路径需要本地但非托管服务器的“/”前缀
【发布时间】：2019-10-15 16:50:21
【问题描述】：

不确定这是否是 axios 问题，但这在本地对我有用：

axios('/api/test').then(response => console.log(response.data))

但在我的托管服务器上，它需要这个：

axios('api/test').then(response => console.log(response.data))

请注意，url 请求前缀“/”用于本地而不是服务器。

有没有什么方法可以处理这个问题（也许是 Laravel Mix？）而不做类似这样的黑客攻击：

var p = location.hostname === "localhost" || location.hostname === "127.0.0.1" ? '/' : ''
axios(p + 'api/test').then(response => console.log(response.data)

我正在使用具有标准文件夹结构的 Laravel(5.8)/Vue。上面的请求路由是：

Route::get('test', 'TestController@index');

并且位于 AppName/routes/api.php 文件中。

【问题讨论】：

第二个在本地工作吗？为什么不直接使用呢？
第二个在本地不起作用。

标签： javascript laravel vue.js axios

【解决方案1】：

您可以简单地在您的 javascript 文件中添加一个变量来添加路径。

var host = window.location.origin;
axios(host + '/api/test').then(response => console.log(response.data);

希望这可行

【讨论】：

【解决方案2】：

这可能是你的Apache服务器（或nginx）的配置有缺陷，但我建议你使用配置文件来避免这样的问题：

// Define different API Url
const urlApiDev = 'urlApiDev'
const urlApiProd = 'urlApiProd'
const secretDev = 'secretDev'
const secretPROD = 'secretProd'

export default {
  url: process.env.NODE_ENV === 'development' ? urlApiDev : urlApiProd,
  version: 'api/1.0',
  clientId: '2',
  clientSecret: process.env.NODE_ENV === 'development' ? secretDev :secretPROD,
}

并将其导入您需要使用的地方。

【讨论】：

【解决方案3】：

感谢您的建议，但我的最终解决方案是按照我认为的预期方式在我的主机服务器上进行部署。我将公用文件夹设为根文件夹并将服务器指向该文件夹。

【讨论】：