Laravel 从表单数据中保存图像答案

【问题标题】：Laravel save image from formdataLaravel 从表单数据中保存图像
【发布时间】：2018-10-06 12:16:16
【问题描述】：

我正在尝试将从我的 javascript（使用 vue）发送的图像保存为表单数据，我正在尝试将其正确保存到我的数据库并在我的存储目录中创建一个文件夹。

到目前为止，我做了以下工作：

// the axios works properly
submit () {
    const formData = new FormData();
    formData.append('thumbnail', this.selectedImageFile);
    formData.append('title', this.title)
    formData.append('image', this.image)
    formData.append('thumbnail', this.thumbnail)
    formData.append('day', this.day)

    if (this.$refs.form.validate()) {
        axios.post('/event/store', formData)
        .then((response) => {
            console.log("event saved: " + response.data);
        })
        .catch((error) => {
            console.log("error trying to save event: " + response);
        })
    }
},

在我的控制器的存储方法中，我执行以下操作：

public function store(EventRequest $request)
{
    $event = $this->event->create([
        'title' => $request->title,
        'image' => $request->image,
        'thumbnail' => $request->thumbnail
    ]);

    $this->event->createDir($request->file('image'), $request->file('thumbnail'), $request->title);

    if($event) {
        return response()->json('success');
    }            

    return response()->json('An error accured');
}

我的Repository中create中的createDir方法

public function createDir($image, $thumbnail, $title)
{
    $image->store($title.'/image');
    $thumbnail->store($title.'/thumbnail');
}

Axios 帖子有效。 $request->file('image') 和 $request->file('thumbnail') 返回 null 而如果我在控制台中输出表单数据，我会得到正确的日志。

我想将文件名保存在我的数据库中，并在存储中创建一个包含两张图片的文件夹。

我不确定如何使用 FormData 进行管理。

【问题讨论】：

尝试formData.append('image',$('#file_uploader').prop('files')[0]); 将所选文件附加到formData
@GihanLakshan 那么有什么不同呢？

标签： javascript laravel vue.js form-data

【解决方案1】：

只需将您的存储方法更新为以下内容：

public function store(EventRequest $request)
{
    $event = $this->event->create([
        'title' => $request->title,
        'image' => $request->image,
        'thumbnail' => $request->thumbnail
    ]);

    $request->file('image')->store($request->title.'/image');
    $request->file('thumbnail')->store($request->title.'/thumbnail');

    if($event) {
        return response()->json('success');
    }            

    return response()->json('An error accured');
}

这将从您的 FormData 请求文件并将它们存储在您的存储文件夹中并添加一个随机散列名称。所以这个：

    $request->file('image')->store($request->title.'/image');
    $request->file('thumbnail')->store($request->title.'/thumbnail');

例如将图像移动到此位置：

storage/app/dragon/thumbnail/abcaksdhsadui123.png // your request title is in this example dragon
storage/app/dragon/image/abcaksdhsadui123.png

【讨论】：