Ajax JS/PHP Image Uploader无法正常工作

Question

我尝试了多种方法,并在StkOvfl和W3规范中遵循了很多问题,但仍然不知道.

我有一个表单输入:

<input type="file" multiple accept="image/*" id="item-image-upload" >

然后在我的Javascript(prepareFormData方法)中:[在这里查看完整的要点类]:

    var files = this.getFiles();
    var formData = new FormData();

    for (var i = 0; i < files.length; i++) {

        var file = files[i];

        if (!file.type.match('image.*')) {
            continue;
        }

        formData.append(this.uploadEntityName, file);
    }

当我console.log(files),得到所有文件都很好.但是,formData不起作用.我还尝试添加一个任意项目:

    formData.append("Apple", 1);

我得到的回答是空的.服务器在php中休息为:

public function uploadImage(){
    return json_encode(array_merge($_REQUEST, $_FILES));
}

Answer 1

我现在 99% 确定这是您的标头，如果您查看日志或打开 PHP 警告，您会看到Warning: Missing boundary in multipart/form-data POST data in Unknown on line 0

我从MDN复制了这个（并添加了标题行并删除了输入文件），并在我的开发盒上的脚本上运行了它，该脚本设置为喊出所有错误，我收到了该错误，然后是一个空数组

var formData = new FormData();

formData.append("username", "Groucho");
formData.append("accountnum", 123456); // number 123456 is immediately converted to a string "123456"

// JavaScript file-like object
var content = '<a id="a"><b id="b">hey!</b></a>'; // the body of the new file...
var blob = new Blob([content], { type: "text/xml"});

formData.append("somefiles[]", blob);

var request = new XMLHttpRequest();
request.open("POST", "MYDEVBOX/testpost.php");
// remove the line below and it works
request.setRequestHeader("Content-Type", "multipart/form-data");
request.responseType = "json";
request.send(formData);

决定调查原因后几分钟后返回。它与多部分数据的边界有关。xhr.send(formData)当您这样做时（或沿途的某个地方），XHR 会自动设置具有匹配边界的标头。当您设置该标头时，请求会使用该标头，从而消除边界，并且 PHP 不知道在哪里分割输入。这是一个快速屏幕截图，可以更好地指出这一点。