HTTP PUT 与 Express.js & axios

Question

我正在尝试将 canvas 从浏览器上传到服务器...

浏览器 function：

function capture(canvas) {
    var canvas = document.getElementById(canvas);
    img = canvas.toDataURL()
    axios.put('/upload/'+document.title, img, {
        headers: {
          'Content-Type': 'text/plaintext'
        }
    })
}

服务器 function：

app.use(bodyParser.urlencoded({ extended: false }));
app.put('/upload/:title', (req, res) => {
    res.status(200)
    let filename = req.params.title
    console.log(req.body)
})

当捕获 function 运行时，它确实在服务器上请求，但 req.body 为空。 我需要那个身体来保存到文件中。 一切正常，但最后，服务器上什么也没有，这是我的主要问题。 我尝试过具有各种正文内容的文本正文、数据正文，但没有任何帮助。

Answer 1

尝试使用 FormData。

示例（将 canvas 元素作为参数传递）：

function fileUpload(canvas) {
    let data = new FormData();
    canvas.toBlob(function (blob) {
        data.append('data', blob);
        axios.post('/upload/'+document.title, data, {
                headers: {
                    'Content-Type': 'multipart/form-data',
                },
            })
            .then(res => {
                console.log(res)
            });
        });
    }

Answer 2

您需要将 canvas 转换为Blob或ArrayBuffer ，然后以您更适合的格式将数据发送到服务器。