为什么它不会成功地张贴我的数据，即使它在邮递员上工作？

Question

我已经用正确的键和值在邮递员上测试了我的endpoint，它工作得很好。 但是，当我尝试在浏览器上发出POST请求时--我得到一个500错误。

console.log(id)；和console.log（email）；都在打印正确的值，因此我可以排除这不是问题所在。 我还尝试使用axios来发出POST请求，但它一直给我带来问题，所以我恢复到fetch。 我愿意接受任何关于改进代码的建议:）。

如何使我的post请求在浏览器上成功通过？ 我可能忽略了什么

前端代码:

fileUpload(file) {
    const formData = new FormData()
    let id = Cookies.get("id");
    let email = Cookies.get("email");

    console.log(id);
    console.log(email);

    formData.append('file', file);

    this.setState({
        id: id,
        email: email,
        formData: formData
    });

    let data = {
        "id": this.state.id,
        "email" : this.state.email,
        "formData": this.state.fData
    }

    fetch('http://myendpoint/api/auth/wall-of-fame', {
        method: 'POST',
        body: data
    })
        .then(response => console.log(response))
        .catch(error => { console.error(error) });
}

后端代码:

public function store(Request $request){
    $filePath = $request->file('file')->getClientOriginalName();
    $id = Auth::user()->id;
    $email = Auth::user()->email;

    $data= [
        'file_path' => $filePath,
        'user_id' => $id,
        'email' => $email
    ];

    DB::table('my db')->insert($data);
    echo "Record inserted successfully.<br/>";
}

Answer 1

在前端使用@wk24应答，在后端代码中使用AUTH来获取用户id，而不是$request，我认为您应该使用

$request->id；$email=$request->email；希望这样可以解决您的问题

Answer 2

当您使用表单数据上载文件时，最好向表单数据本身添加其他属性，如下所示，而不是创建数组

formData.append('file', file)
formData.set('id', id)
formData.set('email', email)

此外，在请求中，您可以将formData作为主体发送

fetch('http://myendpoint/api/auth/wall-of-fame', {
    method: 'POST',
    body: formData
})

这应该能解决你的问题。 让我知道