JS 大于5M的文件分片上传 前端JS代码，后台ASHX IHttpHandler VB代码

在前端JavaScript中处理大于5MB的文件分片上传通常涉及到FileReader API，可以将大文件分割成较小的块逐个发送到服务器。以下是一个简单的示例：

// 假设我们有fileInput用于选择文件
var fileInput = document.getElementById('fileInput');
fileInput.addEventListener('change', function(e) {
  var file = e.target.files[0];
  var chunkSize = 5 * 1024 * 1024; // 每次上传5MB

  uploadFile(file);
});

function uploadFile(file) {
  var reader = new FileReader();
  reader.onload = function(event) {
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/uploadHandler.ashx'); // 后台处理程序地址
    xhr.setRequestHeader('Content-Type', 'application/octet-stream');

    var start = 0;
    var end = Math.min(chunkSize, file.size);

    xhr.upload.onprogress = function(progressEvent) {
      if (progressEvent.lengthComputable) {
        var percentComplete = (progressEvent.loaded / progressEvent.total) * 100;
        console.log('Uploaded:', percentComplete + '%');
      }
    };

    xhr.send(reader.result.slice(start, end)); // 发送当前块数据

    // 分片上传
    if (end < file.size) {
      start = end;
      end += chunkSize;
      uploadNextChunk(xhr, start, end);
    }
  };
}

function uploadNextChunk(xhr, start, end) {
  reader.readAsArrayBuffer(file.slice(start, end));
}

后端，VB.NET 中的 ASHX HttpHandler 可能会类似下面的样子（注意这是简化版本，实际可能需要添加错误处理和验证）：

Imports System.IO
Imports Microsoft.VisualBasic.FileIO

Public Class UploadHandler : Inherits System.Web.UI.Page
    Protected Sub ProcessRequest(ByVal context As HttpContext)
        Dim uploadedData As Byte() = context.Request.BinaryRead(context.Request.InputStream.Length)
        ' ... 这里处理上传的数据，比如保存到数据库或者文件系统
        ' 将接收到的每一块数据合并或存储
        ' 可能还需要通知前端进度或完成状态
        
        ' 清理输入流
        context.Request.InputStream.Close()
    End Sub
End Class