fix: file type mime

This commit is contained in:
马登山
2025-12-12 13:35:01 +08:00
parent 7fca388cc1
commit 920c67770b
6 changed files with 114 additions and 11 deletions
+4 -2
View File
@@ -565,13 +565,15 @@ const download = async () => {
try {
const url = await getSignedUrl(object.value.Key)
fetch(url).then(async response => {
const filename = object.value.Key.split('/').pop() || ''
// 获取头信息,将 Headers 对象转换为普通对象
// 如果服务器没有返回 content-type,根据文件扩展名推断
const headers: any = {
'content-type': response.headers.get('content-type') || 'application/octet-stream',
'content-type': getContentType(response.headers, filename),
filename: response.headers.get('content-disposition')?.split('filename=')[1] || '',
}
let blob = await response.blob()
exportFile({ headers, data: blob }, object.value.Key.split('/').pop() || '')
exportFile({ headers, data: blob }, filename)
})
} catch (error: any) {
message.error(error?.message || t('Download Failed'))
+5 -3
View File
@@ -422,13 +422,15 @@ const downloadFile = async (key: string) => {
try {
const url = await objectApi.getSignedUrl(key)
fetch(url).then(async response => {
// 获取头信息
const filename = key.split('/').pop() || ''
// 获取头信息,将 Headers 对象转换为普通对象
// 如果服务器没有返回 content-type,根据文件扩展名推断
const headers: any = {
'content-type': response.headers.get('content-type') || 'application/octet-stream',
'content-type': getContentType(response.headers, filename),
filename: response.headers.get('content-disposition')?.split('filename=')[1] || '',
}
let blob = await response.blob()
exportFile({ headers, data: blob }, key.split('/').pop() || '')
exportFile({ headers, data: blob }, filename)
})
} catch (error: any) {
message.error(error?.message || t('Download Failed'))
+5 -3
View File
@@ -145,13 +145,15 @@ const previewVersion = (row: any) => emit('preview', row.VersionId)
const downloadVersion = async (row: any) => {
const url = await getSignedUrlWithVersion(props.objectKey, row.VersionId)
fetch(url).then(async response => {
// 获取头信息
const filename = props.objectKey.split('/').pop() || ''
// 获取头信息,将 Headers 对象转换为普通对象
// 如果服务器没有返回 content-type,根据文件扩展名推断
const headers: any = {
'content-type': response.headers.get('content-type') || 'application/octet-stream',
'content-type': getContentType(response.headers, filename),
filename: response.headers.get('content-disposition')?.split('filename=')[1] || '',
}
let blob = await response.blob()
exportFile({ headers, data: blob }, props.objectKey.split('/').pop() || '')
exportFile({ headers, data: blob }, filename)
})
}
+5 -3
View File
@@ -553,13 +553,15 @@ const download = async () => {
try {
const url = await getSignedUrl(object.value.Key)
fetch(url).then(async response => {
// 获取头信息
const filename = object.value.Key.split('/').pop() || ''
// 获取头信息,将 Headers 对象转换为普通对象
// 如果服务器没有返回 content-type,根据文件扩展名推断
const headers: any = {
'content-type': response.headers.get('content-type') || 'application/octet-stream',
'content-type': getContentType(response.headers, filename),
filename: response.headers.get('content-disposition')?.split('filename=')[1] || '',
}
let blob = await response.blob()
exportFile({ headers, data: blob }, object.value.Key.split('/').pop() || '')
exportFile({ headers, data: blob }, filename)
})
} catch (error: any) {
message.error(error?.message || t('Download Failed'))
+1
View File
@@ -1,2 +1,3 @@
export * from './array'
export * from './functions'
export * from './mime-types'
+94
View File
@@ -0,0 +1,94 @@
/**
* 根据文件扩展名获取 MIME 类型
* @param filename 文件名
* @returns MIME 类型
*/
export function getMimeTypeFromFilename(filename: string): string {
const ext = filename.split('.').pop()?.toLowerCase() || ''
const mimeTypes: Record<string, string> = {
// 图片
jpg: 'image/jpeg',
jpeg: 'image/jpeg',
png: 'image/png',
gif: 'image/gif',
webp: 'image/webp',
svg: 'image/svg+xml',
ico: 'image/x-icon',
bmp: 'image/bmp',
tiff: 'image/tiff',
tif: 'image/tiff',
// 视频
mp4: 'video/mp4',
webm: 'video/webm',
ogv: 'video/ogg',
avi: 'video/x-msvideo',
mov: 'video/quicktime',
wmv: 'video/x-ms-wmv',
flv: 'video/x-flv',
mkv: 'video/x-matroska',
// 音频
mp3: 'audio/mpeg',
wav: 'audio/wav',
ogg: 'audio/ogg',
oga: 'audio/ogg',
m4a: 'audio/mp4',
flac: 'audio/flac',
aac: 'audio/aac',
// 文档
pdf: 'application/pdf',
doc: 'application/msword',
docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
xls: 'application/vnd.ms-excel',
xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
ppt: 'application/vnd.ms-powerpoint',
pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
txt: 'text/plain',
csv: 'text/csv',
rtf: 'application/rtf',
// 压缩文件
zip: 'application/zip',
rar: 'application/x-rar-compressed',
'7z': 'application/x-7z-compressed',
tar: 'application/x-tar',
gz: 'application/gzip',
bz2: 'application/x-bzip2',
// Web 文件
html: 'text/html',
htm: 'text/html',
css: 'text/css',
js: 'application/javascript',
json: 'application/json',
xml: 'application/xml',
// 其他常见格式
wasm: 'application/wasm',
ttf: 'font/ttf',
otf: 'font/otf',
woff: 'font/woff',
woff2: 'font/woff2',
eot: 'application/vnd.ms-fontobject',
}
return mimeTypes[ext] || 'application/octet-stream'
}
/**
* 从响应头中获取内容类型,如果没有则根据文件名推断
* @param headers Response Headers 对象
* @param filename 文件名
* @returns MIME 类型
*/
export function getContentType(headers: Headers, filename: string): string {
const contentType = headers.get('content-type')
if (contentType) {
return contentType
}
// 如果服务器没有返回 content-type,根据文件扩展名推断
return getMimeTypeFromFilename(filename)
}