react将前端Blob类型文件传到后台

react将前端Blob类型文件传到后台

最近在做一个关于语音识别的功能，具体需求是用户在线录制音频提交给后台，后台转写成文字输出txt文本。我使用的是一个第三方类库recordmp3.js，可以录制音频并生成一个压缩后的音频对象Blob，直接将对象Blob传到后台就可以。
真的是太天真的我以为了，我以为直接将Blob作为一个值传给后台就可以了（使用axios）
然而调接口的时候并没有把Blob传过去，当时很纳闷，明明输出是有内容的，为什么传过去是空的呢

通过各种方法我终于完美的解决了问题
原因：不能使用axios进行Blob的传参，应该将Blob对象封装成FormData对象，就像表单上传文件一样去处理
解决方法：

this.recorder.getMp3Blob(function (blob) {
	let mp3Blob = blob;
	let url = URL.createObjectURL(mp3Blob);
	let div = document.createElement('div');
	let au = document.createElement('audio');
	au.controls = true;
	au.src = url;
	div.appendChild(au);
	document.getElementById('recordingList').appendChild(div)
	let formData = new FormData();
	formData.append("file", mp3Blob,"file.mp3");
	let request = new XMLHttpRequest();
	request.open("POST", "/url",)
	request.onreadystatechange = () => {
		if (request.readyState == 4) {
			var res = JSON.parse(request.responseText);
			 }
	}
	request.send(formData)
	});