EDIT:
Так что я просто получил эту работу, изменив axios get call на post post, то же самое с маршрутом, есть идеи, почему это сработало ???
из:
javascript
axios.get('/globals/get-logged-user')
и
php
Route::get('/globals/get-logged-user','GlobalsController@getLoggedUser');
до:
javascript
axios.post('/globals/get-logged-user')
и
php
Route::post('/globals/get-logged-user','GlobalsController@getLoggedUser');
Я пытаюсь получить текущего аутентифицированного пользователя (если существует) для моего компонента Header vue, я также использую модули хранилища vuex, чтобы сохранить мой код организованным и отделенным.
Процесс выглядит так:
Когда компонент заголовка смонтирован (), я отправляю действие getLoggedUser.
Теперь внутри магазина Globals я делаю axios get call для route / globals / get-logged-user
Если вызов выполнен успешно, я обновляю состояние, теперь мой компонент Header должен иметь возможность доступа к заблокированным данным пользователя с помощью помощника mapState vuex.
Теперь, что на самом деле происходит:
Вызов вызова axios завершен, он возвращает положительный код состояния 200, но ответ пустой, ничего не возвращается с бэкэнда.
Это моя сетевая вкладка:
https://i.imgur.com/hlD9bAY.png
Как вы видите, другие запросы ajax возвращают реальные данные, но вызов get ничего не возвращает, я также заметил, что тип вызова GET - html, может ли это быть?
Мой компонент:
<template>
<header class="header_maincontainer">
<div class="header_small_container">
<span>{{ loggedUser.email }}</span>
</div>
</header>
</template>
<!--SCRIPTS-->
<script>
import { mapState, mapActions } from 'vuex'
export default {
name: 'MainHeader',
computed: {
//...mapState('Globals', ['allGlobals', 'loggedUser', 'globals']),
...mapState('Globals', [ 'loggedUser']),
},
mounted() {
console.log(this.$options.name+' component successfully mounted');
this.getLoggedUser();
},
methods:{
//component actions declaration
...mapActions('Globals', ['getLoggedUser']),
}
};
</script>
<!--STYLES-->
<style scoped>
</style>
Модуль My Globals vuex:
import axios from 'axios'
//STATE
const state = {
loggedUser:'',
loadingStatus:0
}
//GETTERS
const getters = {
}
//ACTIONS
const actions = {
getLoggedUser ({ commit }) {
commit( 'SET_LOAD_STATUS', {status: 1} );
axios.get('/globals/get-logged-user')
.then((response) => {
commit('GET_LOGGED_USER', { loggedUser: response.data.loggedUser })
console.log(response.data.loggedUser);
commit( 'SET_LOAD_STATUS', {status: 2} );
},
(error) => {
console.log(error);
commit( 'SET_LOAD_STATUS', {status: 3} );
})
},
}
//MUTATIONS
const mutations = {
GET_LOGGED_USER (state, loggedUser) {
state.loggedUser = loggedUser;
},
}
export default {
namespaced: true, state, getters, actions, mutations
}
И мой интерфейс Laravel:
<?php
namespace App\Http\Controllers;
use App\Models\Globals;
use Illuminate\Http\Request;
class GlobalsController extends Controller
{
public function getLoggedUser(){
$loggedUser = Auth::user();
return response()->json([
'loggedUser' => $loggedUser
]);
}
}
Пожалуйста, помогите мне, я все еще застрял с этим после всех этих дней.