使用backbone.js save() 方法提交表单后如何上传多个文件？答案

【问题标题】：How to Upload multiple files after form submit using backbone.js save() method?使用backbone.js save() 方法提交表单后如何上传多个文件？
【发布时间】：2014-05-03 09:32:54
【问题描述】：

我正在使用主干作为 java 脚本框架。我有一个表格，我想同时上传最多 10 张图片。我还在表单标签中给出 enctype="multipart/form-data" 并使用

<form id="myform" enctype="multipart/form-data" method="post">
   <input type="file" name="file1"/>
   <input type="file" name="file2"/>
</form>

在文件更改时，我使用 HTML5 FileReader() 来读取文件。然后当我提交表单时，我想保存所有的表单数据。我必须将这些图像上传到“上传/图像”目录。正如我所提到的，我正在使用主干，所以当我的表单提交时，我使用 e.preventDefault() 防止页面重新加载。之后，

     var savemyForm = Backbone.View.extend(){
     id: '#form_id",
     events: {
             'submit' : 'save'
     }
     save : function (e){
             e.preventDefault();
             var newproject = new App.Models.Project;
              newproject.save({

               // I have to pass values here. But how can i pass values of files. 
               // And that files where I am passing from here should be 
               // moveable to my '/uploads/directory' using the 
               // move_upload_file($destination_path, $filename);
             });     
   });

【问题讨论】：

将它们移到服务器端？
你在这里问什么？听起来你只是在问how to handle the upload on the server side using PHP？

标签： javascript php ajax backbone.js laravel

【解决方案1】：

您应该能够将带有文件的 AJAX 帖子从多部分表单发送到处理文件写入的服务器端脚本！使用 jQuery.forms 插件是一件很聪明的事情，因此您的文件上传也兼容 IE。

http://malsup.com/jquery/form/

然后将表单发布到路由并使用 Laravel 服务器端脚本进行处理，如下所示：

public function create() {
   $file = Input::file('file');
   $file_upload = new FileUpload;
   $file_upload->name = Input::get('name');
   $file_upload->path = $this->settings['destination_folder'];
   $file_upload->extension = $file->getClientOriginalExtension();
   $file_upload->mimetype = $file->getMimeType();
   $file_upload->file_size = $file->getSize();
   if (exif_imagetype($file)) {
      list($width, $height) = getimagesize($file);
      $file_upload->dimensions = $width . " x " . $height;
   }
   $file_upload->save();
   $file->move($this->settings['destination_folder'], $file_upload->name);
}

这是我用来在 Laravel 中编写文件的代码片段。在您的情况下，您必须创建一些 for 循环来添加多个文件。

关于如何在 Laravel 中设置和使用 RESTful 控制器的一些信息：

我建议您首先尝试成功上传一个文件，如果成功，请尝试多个。从一个到多个不是火箭科学。 ;)

【讨论】：

但是，我无法通过主干使用 Input::file('file') 访问。这才是真正的问题
这个想法是您从前端向 API 端点发帖。您使用哪种 JavaScript 前端技术并不重要。不，你不能在你的客户端代码中使用你的服务器端框架！ :)
你在 Laravel 中是否已经有一个 API，即你正在使用的 RESTful 控制器？
是的。我有。我正在使用 RESTful 控制器
好吧，好吧，那么你应该设置一个像 api.example.com/api/files 这样的路由，它应该是一个帖子。然后在资源控制器中调用 store() 函数。在那里，您可以使用我发布的代码的变体。除了后端之外，您应该真正看到前端。它们仅通过路由连接。