javascript - 客户端如何利用superagent传输图片的二进制数据

Question

是这样的，在客户端我使用了一个图片剪裁并预览的react组件，然后就是剪裁出来的图片在客户端是以二进制数据流存在的=>

而且除了图片还有其他的表单数据存在，我想利用superagent异步上传这些数据，所以要如何处理呢？顺便说一下，后端用的是nodejs

Answer 1

function dataURLToBlob(dataURL) {
    var BASE64_MARKER = ';base64,';
    if (dataURL.indexOf(BASE64_MARKER) == -1) {
        var parts = dataURL.split(',');
        var contentType = parts[0].split(':')[1];
        var raw = parts[1];
        
        return new Blob([raw], {type: contentType});
    }
    else {
        var parts = dataURL.split(BASE64_MARKER);
        var contentType = parts[0].split(':')[1];
        var raw = window.atob(parts[1]);
        var rawLength = raw.length;
        
        var uInt8Array = new Uint8Array(rawLength);
        
        for (var i = 0; i < rawLength; ++i) {
            uInt8Array[i] = raw.charCodeAt(i);
        }
        
        return new Blob([uInt8Array], {type: contentType});
    }
}


var form = new FormData();
form.append('file', dataURLToBlob('你的 base64 字符串'), 'avatar.png');
superagent.post('你的 post 地址').send(form).end(function() {
    console.log(arguments);
});