提问者:小点点

使用Express.js和axios的HTTP PUT


我正在尝试从浏览器上传画布到服务器。。。

浏览器功能:

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

服务器功能:

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

当capture函数运行时,它确实在服务器上请求,但req.body为空。我要把尸体存到文件里。一切都很好,但最终,服务器上什么都没有,这是我的主要问题。我尝试过文本主体,数据主体,以及各种主体内容,但都无济于事。


共2个答案

匿名用户

请尝试使用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)
            });
        });
    }

匿名用户

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