浏览器下载图片

src/features/OfflineExam/OfflineExamList.vue

@@ -26,7 +26,13 @@
                   download
                   :title="file.originalFileName"
                   ondragstart="return false;"
-                  @click="() => downloadOfflineFile(file.offlineFileUrl)"
+                  @click="
+                    () =>
+                      downloadOfflineFile(
+                        file.offlineFileUrl,
+                        file.originalFileName
+                      )
+                  "
                 >
                   <i-icon type="ios-cloud-download"></i-icon>下载作答
                 </a>
@@ -158,9 +164,27 @@ export default {
         course.paperId +
         "?isback=true";
     },
-    downloadOfflineFile(url) {
+    async downloadOfflineFile(url, name) {
       window._hmt.push(["_trackEvent", "离线考试页面", "下载作答"]);
-      window.location.href = url;
+      function toDataURL(url) {
+        return fetch(url)
+          .then((response) => {
+            return response.blob();
+          })
+          .then((blob) => {
+            return URL.createObjectURL(blob);
+          });
+      }
+      if ([".png", ".jpg", ".jpeg"].some((v) => name.endsWith(v))) {
+        const a = document.createElement("a");
+        a.href = await toDataURL(url);
+        a.download = name;
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+      } else {
+        window.location.href = url;
+      }
     },
     tempDisableBtnAndDownloadPaper(course) {
       window._hmt.push(["_trackEvent", "离线考试页面", "下载试卷"]);