Laravel如何执行多个文件上传并将数据存储在两个表中

时间:2019-09-24 12:23:10

标签: php jquery ajax laravel axios

我有一个<form>,可以上传多个文件。多个文件应存储在不同的表中,但是由于某些原因,文件没有存储在database中。

这是表格:

<form method="POST" action="{{ route('application.store') }}" id="form" enctype="multipart/form-data">
   <input name="name" type="text" />
   <input name="email" type="text" />
   <input name="phone" type="text" />
   <input name="additional_files" type="file" multiple />
</form>

然后在我的控制器中,我有这个:

public function store()
{
    $validator = Validator::make(
        request()->all(),
        [
            'email' => ['required', 'email'],
            'name' => ['required', 'string'],
            'phone' => ['required', 'string']
        ],

    );

    if ($validator->fails()) {
        return response()
            ->json($validator->messages(), 400);
    }


    $application = Application::create([
        'email' => request()->email,
        'name' => request()->name,
        'phone' => request()->phone,
    ]);

    if (request()->hasFile('additional_files')) {
        $files = request()->file('additional_files');
        foreach ($files as $file) {

            $filename = $file->getClientOriginalName();
            $extension = $file->getClientOriginalExtension();
            $filesize = $file->getSize();

            $path = Storage::disk('local')->put('attachments', request()->file($filename));
            $attachment_file = ApplicationFile::create([
                'files_id' => $application->id,
                'application_id' => $application->id,
                'attachment' => $path,
                'attachment_name' => $extension,
                'attachment_size' => $filesize,
            ]);

            new ApplicationFile($attachment_file);
        }
    }
}

我的文件模型如下:

class SingleApplicationFile extends Model {
    protected $table = "additional_files";

    protected $fillable = [
        'attachment', 'files_id', 'attachment_name', 
        'attachment_size', 'application_id'
    ];

    public function files()
    {
       return $this->belongsTo('App\Application');
    }
}

然后将其发布到JS:

var additional_files = [];

$("#form input[name='additional_files']").change(
    function() {
        additional_files = [];
        for (var i = 0; i < $(this)[0].files.length; i++) {
            additional_files.push($(this)[0].files[i]);
        }
    }
);

$('#form button[type="submit"]').click(function(e) {
    e.preventDefault();

    var formData = new FormData();

    formData.append(
        "name",
        $("#form")
            .find('input[name="name"]')
            .val()
    );
    formData.append(
        "email",
        $("#form")
            .find('input[name="email"]')
            .val()
    );

    formData.append(
        "phone",
        $("#form")
            .find('input[name="phone"]')
            .val()
    );

    if (additional_files.length > 0) {
        formData.append("additional_files", additional_files);
    }

        axios
            .post($("#form").attr("action"), formData)
            .then(response => {
              // some success message
              }
            })
            .catch(error => {
                console.log("ERR: ", error);
            });

 });

“常规”字段按照应有的方式存储,但是上载的文件没有存储,当我执行dd($request()->all())时,它返回:

additional_files: [object File], [object File] // for each file

我不知道我在做什么错。我尝试在输入中添加additional_files[]-> <input type="file" name="additional_files[]" />,但是没有运气。

有人可以帮我吗?

1 个答案:

答案 0 :(得分:0)

您缺少从查看页面发送多个文件的信息。 您应该在输入类型中使用[]

<input name="additional_files[]" type="file" multiple />

此后,仅文件将作为array上传。然后,您可以遍历数组,然后可以执行其他操作。 让我知道您是否遇到任何问题。