如何通过XmlHttpRequest或$ .ajax创建和发送文本文件？

Question

服务器期望来自名称为“websitetopdf”的表单中的html或txt文件。该文件是在客户端javascript上动态创建的，只需在Chrome上运行。

这是应该发送它的表格：

<form action="send.php" method="post" enctype="multipart/form-data" name="websitetopdf" id="websitetopdf">
<input name="localfile" type="file" id="localfile" size="58">
<input name="filetype" type="hidden" id="filetype" value="IMG">
<input name="source" type="hidden" id="source" value="SOFT">
<input name="converternow" type="submit" id="converternow" style="width: 130px; font-weight: bold;" value="Convert to Image">
</form>

我想直接将文件发送到send.php，我试过这个：

$("#sender").on("click", function(e) {
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "http://.../send.php", true);
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4) console.log(xhr.responseText);
    };
    xhr.onload = function(e) {
        if (xhr.status == 200) console.log("uploaded"); //(correctly uploaded)
        else console.log("Error " + e.status + " occurred uploading your file.<br \/>");
    };
    var blob = new Blob(['abc123'], {type: 'text/plain'});

    var formData = new FormData();
    formData.append("localfile", blob);
    formData.append("filetype", "IMG");
    formData.append("source", "SOFT");
    xhr.send(formData);
});

我总是从服务器

获取“它不是有效文件”

Answer 1

当我在FormData对象中添加blob的文件名时，它开始工作了：

formData.append("localfile", blob, "filename.txt");