如何自定义 laravel api 的 json 响应并在 vuex 中显示它们

Posted 2023-03-15

【中文标题】如何自定义 laravel api 的 json 响应并在 vuex 中显示它们

【英文标题】：how can I customize json responses of laravel api and show them in vuex

【发布时间】：2021-12-24 07:19:38

【问题描述】：

尝试不同的解决方案，我在胡闹

response()->json([  ]) 

创建可以在我的 vue / vuex 应用程序中读取的响应

存储新 Speler 的 Laravel api 函数（播放器的荷兰语;)）：

我无法通过对 vuex-store 的响应来发送创建的或找到的 Speler 对象。

成功登录时尝试将状态设置为202，但实际发送的状态为200.. 很明显，我对它的理解还不够好。谁能帮忙解释一下？

 public function store(Request $request)
     
        
        if (Game::where('id',$request['game_id'])->exists() )
            if (!Speler::where('name',$request['name'])->where('game_id',$request['game_id'])->exists())
                $newSpeler = Speler::create(
                [                
                'name' => $request['name'],
                'pass_code' => $request['pass_code'],
                'game_id' => $request['game_id']
                ])->first());
                return $newSpeler;
                 
            elseif ( Speler::where('name',$request['name'])->where('game_id',$request['game_id'])->where('pass_code', $request['pass_code'])->exists())
                
                $speler = Speler::where('name',$request['name'])->where('game_id',$request['game_id'])->where('pass_code', $request['pass_code']);
                return response()->json(['speler'=> $speler, 202]);
                       
            return response()->json(['status' => 'This name is already used, pass-code is not correct', 409]);
                    
        return response()->json([ 'status' => 'The game-pin does not exist', 403 ]); 
    

这被称为 vuex 动作：

export const addSpeler = (commit, formData) => 
    return new Promise((resolve, reject) =>          
                    
        fetch(`api/speler`, 
            method: 'post',
            body:formData,
        )
        .then(res =>  
            
            if (res.status === 202)
                resolve('De speler is succesfully logged on');
                commit('SET_CURRENT_SPELER', res.data.speler);
            
            else if (res.status === 201)
                commit('SET_CURRENT_SPELER', res.data);
                resolve('De speler is succesfully added')
            
            else 
               reject('De speler is not logged in. Name exists and does not match passcode');
            
           
        )
        .catch(err => 
            reject(err.message)
        );

    )
 

这是从 vue 方法调用的：

 methods: 
       
        
        addSpeler()

            this.errorMessage ='';
            this.spelerAdded =false;

            const formData = new FormData();
            formData.append('name', this.name);
            formData.append('pass_code',this.pass_code);
            formData.append('game_id', this.currentGame.id);

            this.$store.dispatch('addSpeler', formData )
           
            .then(res =>  
                this.spelerAdded = true;
                console.log(res.status);
            )
            .catch(err => 
                this.errorMessage = err;
                this.spelerAdded = false;
            );
        ,     

mutations.js：

export const SET_CURRENT_SPELER = (state, speler) => 
    state.currentSpeler = speler;

state.js：

export default
    currentGame:,
    currentSpeler:

【问题讨论】：

这能回答你的问题吗？ Laravel - Return json along with http status code

将状态码作为...->json(...)方法的第二个参数。

steven7mwesigwa 是对的，状态作为 json 方法 return response()->json(['speler'=> $speler], 202); 的第二个参数（而不是像您所做的那样在数组中）。如果不传递第二个参数，则参数值默认分配为 200 json(mixed $data = [], int $status = 200, array $headers = [], int $options = 0)

【参考方案1】：

porloscerros 的评论完美地回答了这个问题：

状态作为 json 方法的第二个参数 return response()->json(['speler'=> $speler], 202); （而不是像你正在做的那样在数组内）。如果不传递第二个参数，参数值默认赋值为200 json(mixed $data = [], int $status = 200, array $headers = [], int $options = 0)