Question

我的网站有一项功能，允许用户创建帖子（如Facebook）。我有一个带有“消息”输入字段的表单和一个允许用户上传图像的按钮。

现在，我如何设置代码是当用户提交表单时，我的代码将首先提交数据，然后上传图像。

这样做的问题是，如果用户取消图片上传中途，数据库记录将存在（因为数据是在图片上传之前提交的），但是没有图片上传。

所以我的解决方案是首先上传图像并在之后提交数据。这个问题是我不确定如何将图像绑定到数据库记录中的数据。

我应该将所有图像上传到/tmp，然后将文件移动到永久目录，例如/var/www/html/website/public/img/uploads/<upload_id> upload_id是数据库记录的id吗？

如果用户上传图片，但中途关闭标签，我该怎么办？然后在/tmp中将有一个图像将永远保留在那里，除非清理目录。我该如何清理它？

这是最好的方法吗？还是有更好的方法？

我正在使用Laravel 5.3和Dropzone.js。

感谢。

Answer 1

由于您使用的Dropzone.js允许通过ajax上传文件，因此您可以通过以下方式执行此操作：

1）使用Dropzone.js（ajax）将文件发送到后端服务器。

2）由于您使用的是laravel，因此您收到的每个文件都是UploadedFile的实例，您可以使用此类访问上传文件的原始名称，大小，MimeType等。

3）在数据库的图像模型中（如果尚未创建，则创建此图像），为此图像创建一个新记录，并根据需要存储上述字段以及存储图像的路径。您可以使用存储在表格行中的此路径稍后访问该图像。

4）获取＆＃39; id＆＃39;在图像表中新插入的行并将其传递回前端，您可以使用＆＃39; success＆＃39; Dropzone插件的事件处理程序。

5）添加新插入的ID＆＃39;作为表单中的隐藏输入元素。

6）当您提交表单时，您将收到与您的帖子相关的图片ID，您可以使用您选择的数据库关系保存它。

7）是的，您需要额外检查已上传并在图像表格中输入的图像，但尚未创建其帖子的图像。您可以为其创建Artisan CLI命令，并将其指定为Cron Job。

Answer 2

我认为您应该使用AJAX提交表单。这个解决方案对我很有用。

使用事件＆＃34; onclick＆＃34;制作a，span或其他元素而不是按钮，因为按下按钮将自动确认表格，即使按钮的类型不是＆＃34;提交＆＃34;。

写一个像这样的ajax函数：

function newsFormSubmit(item_id){

      var formData = new FormData($('.news-form')[0]);

      formData.append("item_id", item_id);

      $.ajax({
         type: 'POST',
         url: config.routes[0].savenews,
         data: formData,
         processData: false,
         contentType: false,
         success: function (data) {
            if (data.error)
            {
                 alert(data.error);
                 return false;
            } else if (data)
            {
                 $('#news-card-' + item_id).html(data);
            }
        }
    });
}

将此功能放在onclick事件上。

图片上传后提交数据

2 个答案: