JS ajax上传音频超过5M 分块上传 前端JS代码后端VB

在JavaScript (JS) 中，当需要上传音频文件大小超过浏览器默认限制（通常约5MB）时，可以采用分块上传（也称为断点续传或多部分上传）。这种技术允许你将大文件分割成较小的部分，然后逐一上传，最后在服务器端合并。

前端JS代码示例（使用jQuery库简化说明）：

// 假设audioFile是音频文件对象
var file = audioFile;
var chunkSize = 5 * 1024 * 1024; // 每次上传5MB

function uploadChunk(file, index) {
  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/upload', true);
  xhr.setRequestHeader('Content-Type', 'application/octet-stream');
  xhr.onload = function() {
    if (xhr.status === 200) { // 成功响应
      handleSuccess(index, xhr.responseText);
    } else {
      handleError(xhr);
    }
  };
  xhr.send(file.slice(index * chunkSize, (index + 1) * chunkSize));
}

function handleSuccess(index, response) {
  // 接收并处理服务器返回的数据，例如创建一个哈希列表
  console.log('Part ' + index + ' uploaded successfully.');
  if (index < getTotalParts(file)) {
    uploadChunk(file, index + 1); // 继续上传下一个部分
  } else {
    // 所有部分上传完毕，拼接文件
    serverResponse = serverResponse.concat(receivedResponses[index]);
    // 后续操作（如上传到服务器的API）
    completeUpload(serverResponse);
  }
}

function getTotalParts(file) {
  return Math.ceil(file.size / chunkSize);
}

// 初始化并开始第一个上传
uploadChunk(file, 0);

后端VB.NET（Visual Basic .NET）代码示例（假设有一个`SavePart`方法接收上传的每个部分）：

Imports System.IO
Imports System.Net

Public Async Function SavePart(partIndex As Integer, partData As Byte()) As Task(Of String)
    Dim savePath = "uploads/" & GenerateFileName(partIndex)
    Using writer As New BinaryWriter(New FileStream(savePath, FileMode.Append))
        writer.Write(partData)
    End Using
    Return "Part " & partIndex & " saved."
End Function

Function GenerateFileName(partIndex As Integer) As String
    ' 根据部分索引生成文件名，比如 "part_001", "part_002" 等
    Return "part_" & partIndex.ToString("D3") & ".bin"
End Function