Javascript AJAX在通过xhr.send（）发送数据时遇到问题？

我正在使用代码上传和显示图像。 Javascript如下所示

xhr.open("POST", $id("upload").action, true);
xhr.setRequestHeader("X_FILENAME", file.name);
xhr.send(file);

这是我的PHP

$fn = (isset($_SERVER['HTTP_X_FILENAME']) ? $_SERVER['HTTP_X_FILENAME'] : false);

if ($fn) {

    // AJAX call
    file_put_contents(
        'uploads/' . $fn,
        file_get_contents('php://input')
    );
    echo "$fn uploaded";
    exit();

}
else {

    // form submit
    $files = $_FILES['fileselect'];

    foreach ($files['error'] as $id => $err) {
        if ($err == UPLOAD_ERR_OK) {
            $fn = $files['name'][$id];
            move_uploaded_file(
                $files['tmp_name'][$id],
                'uploads/' . $fn
            );
            echo "<p>File $fn uploaded.</p>";
        }
    }

}

---

但我完全明白，我不能在同一次发送中发送两种类型的数据。对我来说，实现这一目标的最佳方式是什么

您不能使用

x-www-form-urlencoded

格式进行文件上载，它必须是

multipart/form data

。。。警告：“多部分/表单数据中缺少边界在第0行中发布未知数据您不能仅更改标题，实际上必须正确格式化数据。请参阅。”

xhr.open("POST", $id("upload").action, true);
xhr.setRequestHeader("X_FILENAME", file.name);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send(file + "fname=david");