使用 Jasny 文件输入将文件上传到使用 PHP 的服务器

Posted 2023-02-24

【中文标题】使用 Jasny 文件输入将文件上传到使用 PHP 的服务器

【英文标题】：Using Jasny file input to upload file to the server using PHP

【发布时间】：2014-02-18 03:08:06

【问题描述】：

我正在实现Jasny File Input 插件。但是，我无法将其上传到服务器。

html

<form method="post" id="formCreateMod" class="form form-horizontal" enctype="multipart/form-data" role="form">
    <div class="fileinput fileinput-new" data-provides="fileinput">
         <div class="fileinput-preview thumbnail" data-trigger="fileinput"></div>
         <div>
              <span class="btn btn-default btn-file"><span class="fileinput-new">Select image</span><span class="fileinput-exists">Change</span><input type="file" name="img"></span>
              <a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Delete</a>
         </div>
    </div>
</form>

上面的sn-p在<form>标签里面。然后我在 jQuery 中使用 post 将表单的序列化数据发送到服务器。

我希望通过使用$_FILES['img']["name"] 或$_FILES['img']["type"] 来获取php 中的内容，但结果是NULL。

那么在图片发布后我应该如何在php中检索图片数据呢？

任何帮助将不胜感激！

更新

以下是我在 jQuery 中发布表单的方式。

var theForm = $('form');
$.post(location.href, theForm.serialize(), function(data) 
    // handle return data
);

【问题讨论】：

你能在你的代码中发布你的<form>标签吗？ （是的，这很重要）

@FlorianF。我不太明白你所说的 post

@FlorianF。抱歉，我没有仔细阅读您希望我发布<form> sn-p。不像将它发布到jquery。 （东西太多了）<form>sn-p 上面现在更新了。有什么线索吗？

【参考方案1】：

您不能使用 ajax 和表单序列化发布文件。

您应该查看this answer，其中解释了原因。

但是，您仍然有解决方案：

不使用 ajax，只使用表单上的enctype='multipart/form-data' 属性提交表单

<form [...] enctype='multipart/form-data'></form>

使用FormData

var formData = new FormData();

// HTML file input user's choice...
formData.append("userfile", fileInputElement.files[0]);

var request = new XMLHttpRequest();
request.open("POST", "http://foo.com/submitform.php");
request.send(formData);

使用File API

var reader = new FileReader();

reader.onload = function(e) 
  var rawData = reader.result;


reader.readAsBinaryString(file);

【讨论】：

不发表评论就投反对票？我为什么要费心帮忙:)

我不知道文件不能通过序列化上传。我会试试你提供的方法。顺便说一句，我的名声不会让我投反对票……

所以使用上面的 FormData 方法。如何从服务器获取响应？

this answer 中有一个使用 jQuery ajax 的很好的例子。

如何从 Jasny 文件输入中获取文件元素？