【问题标题】:Laravel & Vue: Axios GET call returning 200 status but no responseLaravel 和 Vue:Axios GET 调用返回 200 状态但没有响应
【发布时间】:2019-04-09 21:32:00
【问题描述】:

编辑:

所以我只是通过将 axios get 调用更改为 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 存储模块来保持我的代码组织和解耦。

流程是这样的:

当 header 组件被 mount() 时,我调度操作 getLoggedUser。

现在在 Globals 商店中,我让 axios 调用路由 /globals/get-logged-user

如果调用成功,我会更新状态,现在我的 Header 组件应该能够在 mapState vuex helper 的帮助下访问记录的用户数据。

现在实际发生了什么:

axios get 调用完成,它返回一个积极的 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>

我的全局 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

        ]);

    }


   
}

请帮助我,这些天后我仍然坚持这个。

【问题讨论】:

    标签: javascript php laravel vue.js


    【解决方案1】:

    如果您收到一个空响应的 200,您可能走错了路线。

    尝试添加调试输出或断点以检查您是否处于正确的控制器功能中。

    【讨论】:

    • 你能给我一些例子来说明如何做到这一点
    • 尝试添加一个 dd('test');在控制器功能的开头并调用您的路线。如果它不打印“测试”,则说明您使用了错误的控制器功能。在这种情况下,您的路线可能配置错误。有关 dd 辅助函数的更多信息:laravel.com/docs/5.7/helpers#method-dd
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-09-30
    • 1970-01-01
    • 1970-01-01
    • 2011-05-16
    • 1970-01-01
    • 2021-02-05
    • 2019-12-24
    相关资源
    最近更新 更多