惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

罗磊的独立博客
L
LangChain Blog
aimingoo的专栏
aimingoo的专栏
IT之家
IT之家
B
Blog
博客园_首页
博客园 - 司徒正美
有赞技术团队
有赞技术团队
博客园 - 聂微东
I
InfoQ
美团技术团队
GbyAI
GbyAI
阮一峰的网络日志
阮一峰的网络日志
H
Help Net Security
大猫的无限游戏
大猫的无限游戏
MyScale Blog
MyScale Blog
WordPress大学
WordPress大学
The GitHub Blog
The GitHub Blog
A
About on SuperTechFans
人人都是产品经理
人人都是产品经理
Microsoft Azure Blog
Microsoft Azure Blog
Engineering at Meta
Engineering at Meta
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
The Cloudflare Blog

博客园 - 漫思

python使用.env构建开发和生产环境 python项目的构建 nodejs构建CICD时的思考  成为 AI 智能体工程师的 10 个步骤 es6的 yield python 中的 yield 笔记本的A壳 thinkpad 更换 reduce() in Python python的字段赋值和取值的操作 python的语法类似于lodash分组展开,合并分组操作 SelectMany C# lodash 数组的常用做法 lodash里面的常用方法 技术的边界 Reduce 和 Transduce 的含义 尤雨溪创办的 VoidZero 官宣加入 Cloudflare,前端 Vite 等保持开源 Ramda 函数库参考教程 ramda es 数组的方法 flatmap map object.entity的教程 Map与FlatMap:在数据处理中的区别与联系 flat、flatmap与map的用法区别1 flat、flatmap与map的用法区别 AI不是从天而降,它经历了七十年三起三落:读懂AI的第三课 Agent 17 种架构模式 分析 & 思考 只有踩过坑才懂:前端生成唯一 ID,别用 Date.now ()了!试试它crypto.randomUUID() FastAPI python并发 代码是 AI 写的,生产事故谁背锅? AI Agent 走出 Demo 幻觉的唯一解药:Harness Engineering
自定义hook的写法
漫思 · 2026-04-25 · via 博客园 - 漫思

import { useState } from 'react';

import { message } from 'antd';

import SparkMD5 from 'spark-md5';

import { uploadFile as uploadFileService, uploadInit, finishUpload } from '@/services/files';

interface UploadParams {

md5: string;

file_name: string;

file_size: number;

part_size: number;

}

const useUpload = () => {

const [uploading, setUploading] = useState(false);

const [progress, setProgress] = useState(0);

const calculateMD5 = (file: File): Promise<string> => {

return new Promise((resolve, reject) => {

const chunkSize = 2097152; // 2MB

const chunks = Math.ceil(file.size / chunkSize);

const spark = new SparkMD5.ArrayBuffer();

const fileReader = new FileReader();

let currentChunk = 0;

fileReader.onload = (e) => {

if (e.target?.result) {

spark.append(e.target.result as ArrayBuffer);

currentChunk++;

if (currentChunk < chunks) {

loadNext();

} else {

resolve(spark.end());

}

}

};

fileReader.onerror = reject;

const loadNext = () => {

const start = currentChunk * chunkSize;

const end = start + chunkSize >= file.size ? file.size : start + chunkSize;

fileReader.readAsArrayBuffer(file.slice(start, end));

};

loadNext();

});

};

const uploadFile = async (file: File, basePath: string = 'data') => {

try {

setUploading(true);

setProgress(0);

// 使用新的简单上传接口

setProgress(30);

const result = await uploadFileService(file, basePath);

if (result.code === 200 && result.data?.success) {

setProgress(100);

return result.data.file_id;

} else {

throw new Error(result.message || '上传失败');

}

} catch (error: any) {

console.error('文件上传失败:', error);

const errorMessage = error?.response?.data?.detail || error?.message || '上传失败,请重试';

message.error(errorMessage);

throw error;

} finally {

setUploading(false);

}

};

const uploadWholeFile = async (file: File, uploadUrl: string) => {

const response = await fetch(uploadUrl, {

method: 'PUT',

headers: {

'Content-Type': 'application/octet-stream',

},

body: file,

});

if (!response.ok) {

throw new Error(`上传失败: ${response.statusText}`);

}

setProgress(90);

};

const downloadFile = async (fileId?: any) => {

const res = await getFilesDownload(fileId);

const response = res?.data?.url;

if(res.code === 200){

const contentDisposition = response.headers['content-disposition'];

let fileName = 'cargo_export'; // 默认文件名

if (contentDisposition) {

// 关键正则:兼容带/不带引号、URL编码的文件名

const match = contentDisposition.match(/filename=(?:")?(.+?)(?:")?(?:;|$)/i);

if (match && match[1]) {

fileName = decodeURIComponent(match[1].trim()); // 解码+去空格

}

}

console.log(response);

try {

const downloadElement = document.createElement("a");

const href = window.URL.createObjectURL(response?.data); // 直接使用Blob对象

downloadElement.style.display = "none";

downloadElement.href = href;

// 优先使用传入的fileName,否则默认名

downloadElement.download = fileName || 'download file';

document.body.appendChild(downloadElement);

downloadElement.click();

document.body.removeChild(downloadElement);

window.URL.revokeObjectURL(href); // 释放资源

} catch (error) {

console.error("下载文件时出错:", error);

throw new Error("文件下载失败,请重试"); // 抛出错误供上层处理

}

}

};

const exportFile = async (fileId: any, fileName: string) => {

const res = await getArchivalData(fileId);

const response = res?.data;

if(res.code === 200){

const url = response;

const a = document.createElement('a');

a.href = url;

a.download = fileName;

document.body.appendChild(a);

a.click();

document.body.removeChild(a);

URL.revokeObjectURL(url); // Clean up the URL object

}

};

// 导出结构化数据

const exportStructuredData = async (fileId: any, fileName: string) => {

const res = await getStructuredDataExport(fileId);

const response = res?.data;

if(res.code === 200){

const url = response;

const a = document.createElement('a');

a.href = url;

a.download = fileName;

document.body.appendChild(a);

a.click();

document.body.removeChild(a);

URL.revokeObjectURL(url); // Clean up the URL object

}

};

return { uploading, progress, uploadFile, downloadFile, exportFile, exportStructuredData };

};

export default useUpload;