增强文件校验的兼容性

flipped-aurora · Nov 8, 2024 · d314bfb · d314bfb
1 parent 35fd5c8
commit d314bfb
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 8 deletions.
diff --git a/web/src/components/office/index.vue b/web/src/components/office/index.vue
@@ -43,7 +43,7 @@ watch(
     fileUrl.value = val
     const fileExt = val.split('.')[1] || ''
     const image = ['png', 'jpg', 'jpeg', 'gif']
-    ext.value = image.includes(fileExt) ? 'image' : fileExt
+    ext.value = image.includes(fileExt.toLowerCase()) ? 'image' : fileExt
   },
   { immediate: true }
 )

diff --git a/web/src/components/selectImage/selectImage.vue b/web/src/components/selectImage/selectImage.vue
@@ -212,7 +212,7 @@ const listObj = {
 const chooseImg = (url) => {
   if (props.fileType) {
     const typeSuccess = listObj[props.fileType].some(item => {
-      if (url.includes(item)) {
+      if (url.includes(item.toLowerCase())) {
         return true
       }
     })

diff --git a/web/src/components/upload/image.vue b/web/src/components/upload/image.vue
@@ -39,8 +39,8 @@ const props = defineProps({
 })
 
 const beforeImageUpload = (file) => {
-  const isJPG = file.type === 'image/jpeg'
-  const isPng = file.type === 'image/png'
+  const isJPG = file.type?.toLowerCase() === 'image/jpeg'
+  const isPng = file.type?.toLowerCase() === 'image/png'
   if (!isJPG && !isPng) {
     ElMessage.error('上传头像图片只能是 jpg或png 格式!')
     return false

diff --git a/web/src/utils/image.js b/web/src/utils/image.js
@@ -106,8 +106,21 @@ export const getUrl = (url) => {
   }
 }
 
-export const isVideoExt = (url) => url.endsWith('.mp4') || url.endsWith('.mov') || url.endsWith('.webm') || url.endsWith('.ogg');
+const VIDEO_EXTENSIONS = ['.mp4', '.mov', '.webm', '.ogg']
+const VIDEO_MIME_TYPES = ['video/mp4', 'video/webm', 'video/ogg']
+const IMAGE_MIME_TYPES = ['image/jpeg', 'image/png', 'image/webp', 'image/svg+xml']
 
-export const isVideoMime = (type) => type == 'video/mp4' || type == 'video/webm' || type == 'video/ogg';
+export const isVideoExt = (url) => {
+  const urlLower = url?.toLowerCase() || ''
+  return urlLower !== '' && VIDEO_EXTENSIONS.some(ext => urlLower.endsWith(ext))
+}
+
+export const isVideoMime = (type) => {
+  const typeLower = type?.toLowerCase() || ''
+  return typeLower !== '' && VIDEO_MIME_TYPES.includes(typeLower)
+}
 
-export const isImageMime = (type) => type == 'image/jpeg' || type == 'image/png' || type == 'image/webp' || type == 'image/svg+xml';
+export const isImageMime = (type) => {
+  const typeLower = type?.toLowerCase() || ''
+  return typeLower !== '' && IMAGE_MIME_TYPES.includes(typeLower)
+}
diff --git a/web/src/view/example/upload/upload.vue b/web/src/view/example/upload/upload.vue
@@ -85,7 +85,7 @@
         >
           <template #default="scope">
             <el-tag
-              :type="scope.row.tag === 'jpg' ? 'info' : 'success'"
+              :type="scope.row.tag?.toLowerCase() === 'jpg' ? 'info' : 'success'"
               disable-transitions
             >{{ scope.row.tag }}
             </el-tag>