Question

我正在使用Laravel框架。我有一种向数据库添加新项目的形式，用户也可以拖放文件。然后，显示一个进度条，直到它完成，使用Ajax将文件上传到服务器。

提交该表单后，我在控制器中运行addItem函数，我想做/检查：

该文件已在服务器中托管（成功上传）
如果文件托管在服务器中，我该如何找到它？（我给它一个随机的名字）
如果用户选择不提交表单，我希望从服务器中删除该文件，因此我不会拥有与数据库中任何项目无关的文件

您能否就如何完成这些任务提出任何建议？

Answer 1

要通过AJAX发送文件，您需要使用FormData类XMLHttpRequest2，它不适用于IE＆lt; 10。

您还需要AJAX2来显示进度。

通过AJAX提交带有文件和进展的示例：

我在这里做了一个例子。在此示例中，表单使用FormData通过AJAX发送数据和文件，并使用#progress事件在progress中显示上载进度百分比。显然它是一个样本，可以改变以适应它。

$('form').submit(function(e) { // capture submit
    e.preventDefault();
    var fd = new FormData(this); // XXX: Neex AJAX2

    // You could show a loading image for example...

    $.ajax({
      url: $(this).attr('action'),
      xhr: function() { // custom xhr (is the best)

           var xhr = new XMLHttpRequest();
           var total = 0;

           // Get the total size of files
           $.each(document.getElementById('files').files, function(i, file) {
                  total += file.size;
           });

           // Called when upload progress changes. xhr2
           xhr.upload.addEventListener("progress", function(evt) {
                  // show progress like example
                  var loaded = (evt.loaded / total).toFixed(2)*100; // percent

                  $('#progress').text('Uploading... ' + loaded + '%' );
           }, false);

           return xhr;
      },
      type: 'post',
      processData: false,
      contentType: false,
      data: fd,
      success: function(data) {
           // do something...
           alert('uploaded');
      }
    });
});

了解如何运作!!：http://jsfiddle.net/0xnqy7du/3/

<强> LARAVEL ：

在laravel中，您可以使用Input::file获取文件，移动到其他位置并在需要时保存在数据库中：

Input::file('photo')->move($destinationPath, $fileName);

// Sample save in the database
$image = new Image();
$image->path = $destinationPath . $fileName;
$image->name = 'Webpage logo';
$image->save();

Laravel使用Ajax上传文件

1 个答案: