在服务器上上传视频/图像不带Express的Node.js

如何解决在服务器上上传视频/图像不带Express的Node.js

多亏了AJAX，我试图将视频上传到Node.js服务器上，这是当前脚本：

home.ejs：

test: function() {
    return 'example'
}

server.js：

    <form action="#" method="post" enctype="multipart/form-data">
        <input type="file" name="file" class="file" />
        <input class="submit" type="submit" value="Send" />
    </form>

    <script>
        let form = document.querySelector("form")
        let file = document.querySelector(".file")

        form.addEventListener("submit",e => {
            e.preventDefault()
            let reader = new FileReader();
            reader.onload = function(evt) {
                let xhr = new XMLHttpRequest()
                xhr.open("POST","/server",true)
                xhr.send(evt.target.result)
            }
            reader.readAsBinaryString(file.files[0])
        })
    </script>

这里路由器只是我自己的模块，用于创建HTTP服务器，如果URL正确，则matchURL方法执行回调

问题是视频上传得很好，但是我无法运行它，就像文件已损坏...

非常感谢！

编辑：

• 此代码适用于txt文件，因此我不知道问题出在哪里，也许是编码（即使我尝试将写入编码更改为二进制并且不起作用），我也试图使用ArrayBuffer，但是不起作用！

• 我还尝试上传1px * 1px的图像（因此仅需要1个块），但它也无法正常工作。因此，问题可能是数据丢失，但我不知道如何解决。我注意到原始图像和上传的图像之间发生了变化：原始图像的大小为802o，上传的图像大小为998o，但是这种更改不会出现在txt文件上

解决方法

这里有一个解决方案：https://nodejs.org/en/knowledge/HTTP/servers/how-to-handle-multipart-form-data/

实际上multipart / form-data公式器可能包含破坏文件的边界。

因此，我们必须使用一个可以解析数据的模块（此处为 formidable ）

可仿冒链接：https://www.npmjs.com/package/formidable

这是AJAX的解决方案：

home.ejs ：

<form action="#" method="post" enctype="multipart/form-data">
    <input type="file" name="file" class="file" />
    <input class="submit" type="submit" value="Send" />
</form>

<script>
    let form = document.querySelector("form")
    let fileInput = document.querySelector(".file")

    form.addEventListener("submit",e => {
        e.preventDefault()
        let xhr = new XMLHttpRequest()
        let formData = new FormData(form)
        xhr.open("POST","/upload",true)
        xhr.send(formData)
    })
</script>

FormData接口提供了一种轻松构造代表表单字段及其值的键/值对集合的方法，然后可以使用XMLHttpRequest.send（）方法（https://developer.mozilla.org/en-US/docs/Web/API/FormData）轻松发送该键/值对

// Function which execute the callback if /upload is called
const formidable = require("formidable")

// Execute the callback if the URL is requested
router.matchURL("/upload",(req,res,data) => {
    if (req.method === "POST") {
        let form = new formidable.IncomingForm()

        // We parse the request to get fields and files
        form.parse(req,(err,fields,files) => {
            if (err) throw err

            res.writeHead(200,{'content-type': 'text/plain'});

            // We write the copy of the video using the path of the temp video file
            let writer = fs.createWriteStream("../video.mp4")
            let reader = fs.createReadStream(files.file.path).pipe(writer)
            writer.on("finish",() => {
                // Once the video uploaded,we delete the temp file
                fs.unlink(files.file.path,err => {
                    if (err) throw err
                })
            })
        })
    }
})