axios/laravel/formdata 发布请求为空

Posted 2023-02-22

【中文标题】axios/laravel/formdata 发布请求为空

【英文标题】：axios/laravel/formdata post request is empty

【发布时间】：2018-03-22 16:52:39

【问题描述】：

我想上传一些文件，但是当我用axios发布时，我的formdata在laravel中是一个空请求

vuejs: 上传者.vue

filesChange(e) 
    const fileList = e.target.files;
    const formData = new FormData();
    if (!fileList.length) return;
    for (let i = 0; i < fileList.length; i += 1) 
      console.log(fileList[i]);
      formData.append('files', fileList[i], fileList[i].name);
    
    this.save(formData);
  ,

来自控制台的输出，所有文件都被循环并附加到 formData

save(formData) 
    photosApi.storePhotos(formData, this.galleryId).then((response) =>     
        console.log(response);
    ).catch((error) => 
        console.log(error);
    );
,

vuejs：photosApi.js

storePhotos(formData, id) 
    return axios.post(`api/photo/$id`, formData);
,

当我检查我的 api 调用时，我看到了这个

laravel: api.php

Route::post('/photo/id',  'PhotoController@store');

laravel: PhotoController.php

public function store(Request $request, $id)

    return $request->all(); 

我的回复只是空的...

我做错了什么？

【问题讨论】：

尝试返回json响应。

@pdshah3690 也为空，返回 response()->json($request->all());

@ParthShah with print_r($request->all());你可以检查数据

【参考方案1】：

我终于解决了:)

第一个问题是这一行

formData.append('files', fileList[i], fileList[i].name);

追加总是覆盖最后一个“文件”条目...（我认为它像推送一样工作）

所以第一个修复是

formData.append(`file$i`, fileList[i], fileList[i].name);

查看数据不使用

return $request->all();

改为使用

print_r($request->all());

现在您可以在检查 apicall 时看到一些有用的东西

现在很容易

$data = $request->all();
foreach ($data as $key => $file) 
    $file->move('/public/images', $file->getClientOriginalName());
;

我所有的文件都存储在我的文件夹中；）

更新： 我发现，如果我用“[]”写入文件，那么我也会将数据作为数组获取

for (let i = 0; i < fileList.length; i += 1) 
    formData.append('files[]', fileList[i], fileList[i].name);

在我的控制器中，我可以通过这一行访问我的文件，但没有“[]”

$files = $request->file('files');