如何直接从浏览器上传超过30秒的大型音频文件到AwS S3?

Question

我想将录音保存到S3。我使用下面的函数直接从浏览器加载到awsS3。它适用于长达25秒左右的短音频记录，但不适用于较大的文件。

目前的功能如下:我使用recorder.js对着麦克风说话。录制完成后，我按下stop键，然后将文件保存到AWS

从浏览器:

getSignedRequest(file,fileLoc);


function getFetchSignedRequest(file,fileLoc){
const fetchUrl = `/xxxxxxxxx?file-name=${file.name}&file-type=${file.type}&fileLoc=${fileLoc}`;
fetch(fetchUrl )
.then((response) => {
console.log('response',response)
if(!response.ok){
console.log('Network response was not OK',response.ok)
} else {
putAudioFetchFile(file, response.signedRequest, response.url)
}
})
.catch((error) => {
console.error('Could not get signed URL:', error);
})
}

向NodeJs服务器发送get请求，该请求调用:

const aws = require('aws-sdk');
const fs = require('fs');
aws.config.region = 'xxxxxx';
const S3_BUCKET = process.env.AWS_S3_BUCKET
this.uploadToAWSDrive =
async function uploadToAWSDrive(req,res){
const s3 = new aws.S3();
const URL_EXPIRATION_SECONDS = 3000;
const subFolderName = req.query['fileLoc'];
const fileName = req.query['file-name'];
const fileType = req.query['file-type'];
const fileLocName = subFolderName +  fileName;
const s3Params = {
Bucket: S3_BUCKET,
Key: fileLocName,
Expires: URL_EXPIRATION_SECONDS,
ContentType: fileType,
ACL: 'public-read'
};
await s3.getSignedUrl('putObject', s3Params, (err, data) => {
if(err){
console.log(err);
return res.end();
}
const returnData = {
signedRequest: data,
url: `https://${S3_BUCKET}.s3.amazonaws.com/${fileLocName}`
};
console.log('audio uploaded',returnData)
res.write(JSON.stringify(returnData));
res.end();
});
}

然后调用:

function uploadFile(file, signedRequest, url){
const xhr = new XMLHttpRequest();
xhr.open('PUT', signedRequest);
xhr.onreadystatechange = () => {
if(xhr.readyState === 4){
if(xhr.status === 200){
console.log('destination url= ', url,xhr.readyState,xhr.status)
}
else{
alert('Could not upload file.');
}
}
};
xhr.send(file);
}

然后将文件发送到awsS3服务器。对于小于30秒的音频文件可以，但是对于较长的音频文件失败。

我需要做些什么才能使它与大于20秒和最多3分钟的音频文件一起工作?

任何帮助都非常感谢

Answer 1

不是很优雅，但是通过在原始函数调用中添加计时器解决了这个问题。接下来的一个函数也需要延迟，以允许处理器时间。我相信会有更好的办法。

setTimeout( getSignedRequest( myAudioFile,fileLoc), proccessTime)  ;