Просмотр исходного кода

feat: 上传图片音频格式限制

zhangjie 4 месяцев назад
Родитель
Сommit
52697deb87

+ 12 - 7
src/components/vEditor/components/audio.js

@@ -1,10 +1,10 @@
 // import { saveBlobToDisk } from "@/utils/fileUtils";
 import { $httpWithMsg } from "@/plugins/axios";
-import { audioToImageNode } from "../utils";
+import { audioToImageNode, checkFileFormat } from "../utils";
 import { QUESTION_API } from "@/constants/constants";
 
 function saveAudioApi(data) {
-  console.log(data);
+  // console.log(data);
   let formData = new FormData();
   Object.keys(data).forEach((k) => {
     formData.append(k, data[k]);
@@ -27,18 +27,23 @@ export async function audioHandle(event) {
   const file = event.target.files[0];
   event.target.value = "";
   if (file.size > this.maxAudioSize) {
-    this.$message(
+    this.$message.error(
       `音频大小超过限制!最大不超过 ${this.maxAudioSize / 1024 / 1024} MB.`
     );
     return;
   }
 
+  if (!checkFileFormat(file.name, ["mp3"])) {
+    this.$message.error("只支持mp3格式音频!");
+    return;
+  }
+
   // 上传音频文件
   const res = await saveAudioApi({ file });
-  console.log(res.data);
+  // console.log(res.data);
 
   const imageNode = await audioToImageNode(res.data);
-  console.log(imageNode);
+  // console.log(imageNode);
   // console.log({ relativeFilePath, imageNode });
   // console.log(imageNode.outerHTML);
   document.execCommand("insertHTML", false, imageNode.outerHTML);
@@ -57,10 +62,10 @@ export async function uploadAudioHandle(file) {
 
   // 上传音频文件
   const res = await saveAudioApi({ file });
-  console.log(res.data);
+  // console.log(res.data);
 
   const imageNode = await audioToImageNode(res.data);
-  console.log(imageNode);
+  // console.log(imageNode);
   // console.log({ relativeFilePath, imageNode });
   // console.log(imageNode.outerHTML);
   document.execCommand("insertHTML", false, imageNode.outerHTML);

+ 9 - 2
src/components/vEditor/components/image.js

@@ -1,4 +1,4 @@
-import { insertTagToEditor } from "../utils";
+import { insertTagToEditor, checkFileFormat } from "../utils";
 
 function toBase64(file) {
   return new Promise((resolve, reject) => {
@@ -21,7 +21,14 @@ export async function imageHandle(event) {
   const file = event.target.files[0];
   event.target.value = "";
   if (file.size > this.maxImageSize) {
-    this.$message(`单张图片超过限制,最大为 ${this.maxImageSize / 1024} KB.`);
+    this.$message.error(
+      `单张图片超过限制,最大为 ${this.maxImageSize / 1024} KB.`
+    );
+    return;
+  }
+
+  if (!checkFileFormat(file.name, ["png", "jpg", "jpeg"])) {
+    this.$message.error("只支持png、jpg、jpeg格式图片!");
     return;
   }
 

+ 7 - 0
src/components/vEditor/utils.js

@@ -91,3 +91,10 @@ export function base64ToBlob(base64Str) {
   }
   return new Blob([arr], { type: "image/png" });
 }
+
+export function checkFileFormat(filename, format) {
+  const _file_format = filename.split(".").pop().toLocaleLowerCase();
+  return format.length
+    ? format.some((item) => item.toLocaleLowerCase() === _file_format)
+    : true;
+}