up

src/views/course/components/showCode.vue

@@ -66,6 +66,17 @@
     created() {},
     methods: {
 
+      fallbackQrUrl() {
+        return `/storage/course_qrcode/${this.row.id}.png?t=${Date.now()}`
+      },
+      checkImage(url) {
+        return new Promise(resolve => {
+          const img = new Image()
+          img.onload = () => resolve(true)
+          img.onerror = () => resolve(false)
+          img.src = url
+        })
+      },
       async getCode() {
         if (!this.row.id) {
           this.imgSrc = ''
@@ -82,9 +93,15 @@
           this.imgSrc = res.msg || ''
         } catch (e) {
           this.imgSrc = ''
-        } finally {
-          this.loading = false
         }
+        // 接口异常时，兜底探测静态文件是否已存在
+        if (!this.imgSrc) {
+          const fallback = this.fallbackQrUrl()
+          if (await this.checkImage(fallback)) {
+            this.imgSrc = fallback
+          }
+        }
+        this.loading = false
       },
       async generateCode() {
         if (!this.row.id || this.generating) {
@@ -101,7 +118,11 @@
             this.$message.success('二维码生成成功')
           }
         } catch (e) {
-          // request 拦截器已提示错误
+          const fallback = this.fallbackQrUrl()
+          if (await this.checkImage(fallback)) {
+            this.imgSrc = fallback
+            this.$message.success('二维码已生成')
+          }
         } finally {
           this.generating = false
         }