Неожиданный URL, сгенерированный при использовании window.location.hostname

Question

Я пытаюсь добавить URL, но сгенерированный URL не соответствует ожидаемому.Ниже приведен код, который я тестировал, и его результаты.

Поскольку я использую локальный сервер для тестирования своей системы, требуемый URL-адрес запроса - http://127.0.0.1:8000/api/posts.Я буду развертывать эту систему на удаленном сервере в ближайшем будущем, поэтому я не могу использовать URL-адрес запроса, как сейчас.Основываясь на приведенном ниже коде, я пытаюсь получить текущее имя хоста и добавить его к URL-адресу маршрута, но он выдает странный URL-адрес.Как решить эту проблему?

Компонент

created() {
        var test = window.location.hostname + '/api/posts';
        this.axios.get(test).then(response => {
        this.posts = response.data.data;
    });

Route Api (api.php)

Route::get('/posts', 'PostController@index');

Answer 1

Просто используйте абсолютный URL в ваших запросах axios, если вы не хотите настраивать базовый URL:

this.$axios.get('/apiposts')

Где префикс / является важной частью.

Answer 2

Возможно, вам не нужно устанавливать baseURL. Вы пытались определить baseURL? Например:

axios.get(`${process.env.HOST}:${PORT}/api/categories`)

Добавьте этот код в: /src/main.js

const baseURL = 'http://localhost:8080';
if (typeof baseURL !== 'undefined') {
  Vue.axios.defaults.baseURL = baseURL;
}

Смотрите решение здесь Установите baseURL из .env в VueAxios

Я думаю, что в вашем приложении baseURL установлен на http://127.0.0.1:8000 (по умолчанию), и вы добавляете хост к этому URL в этой строке var test = window.location.hostname + '/api/posts';. Попробуйте это без этого.