Проблема метода Axios Post в проекте чата laravel в реальном времени

Question

Получение ошибки POST http://127.0.0.1:8000/chat/getChat/20 405 (метод не разрешен)

Когда я вручную посещаю этот URL, он показывает мне модель чатов, содержащую данные между вошедшим в систему пользователем и другом, но в axios еговыдаю эту ошибку.

Что не так с моим КОДОМ?

JS:

const app = new Vue({
    el: '#app',
    data: {
        chats: [],
        chat: 'Hello Universe'
    },
    created() {
        const userId = $('meta[name="userId"]').attr('content');
        const friendId = $('meta[name="friendId"]').attr('content');

        if (friendId != undefined) {
            axios.post('/chat/getChat/' + friendId)
          .then(function (response) {
            this.chats = response.data;
            console.log(response);
          })
          .catch(function (error) {
            console.log(error);
          });
        }
    }
});

Component:
<template>
    <div class="panel-block">
        component
    </div>
</template>

<script>
    export default {
        props: ['chats'],
        mounted() {
            console.log('Component mounted.')
        }
    }
</script>

Answer 1

lol, это были мои плохие парни, извините, что беспокою вас, весь мой код был верным, но маршрут, который я использовал, был get

Route :: get ('/ chat / getChat / {id}', 'ChatController@getChat ') -> middleware (' auth ');

должно быть

Route :: post (' / chat / getChat / {id} ',' ChatController @ getChat ')-> middleware ('auth');

вызывает аксиос, запрашивающий в методе post в бэкэнде, что маршрут был в get, поэтому он не разрешил запрос, т.е. 405 (метод не разрешен)

Answer 2

const app = new Vue({
el: '#app',
data: {
    chats: [],
    chat: 'Hello Universe'
},
created() {
    const userId = $('meta[name="userId"]').attr('content');
    const friendId = $('meta[name="friendId"]').attr('content');

    if (friendId != undefined) {
        axios.Get('/chat/getChat/' + friendId)
      .then(function (response) {
        this.chats = response.data;
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });
    }
}

});

Компонент: компонент

попробуйте это и посмотрите ... используя Get