feat: 使用svg输出登陆二维码 (#1568)

src/views/loginAccount.vue

@@ -68,8 +68,8 @@
         </div>
 
         <div v-show="mode == 'qrCode'">
-          <div v-show="qrCodeImage" class="qr-code-container">
+          <div v-show="qrCodeSvg" class="qr-code-container">
-            <img :src="qrCodeImage" width="192px" />
+            <img :src="qrCodeSvg" />
           </div>
           <div class="qr-code-info">
             {{ qrCodeInformation }}
@@ -135,7 +135,7 @@ export default {
       smsCode: '',
       inputFocus: '',
       qrCodeKey: '',
-      qrCodeImage: '',
+      qrCodeSvg: '',
       qrCodeCheckInterval: null,
       qrCodeInformation: '打开网易云音乐APP扫码登录',
     };
@@ -233,19 +233,22 @@ export default {
       return loginQrCodeKey().then(result => {
         if (result.code === 200) {
           this.qrCodeKey = result.data.unikey;
-          QRCode.toDataURL(
+          QRCode.toString(
             `https://music.163.com/login?codekey=${this.qrCodeKey}`,
             {
-              width: 384,
+              width: 192,
               margin: 0,
               color: {
                 dark: '#335eea',
                 light: '#00000000',
               },
+              type: 'svg',
             }
           )
-            .then(url => {
+            .then(svg => {
-              this.qrCodeImage = url;
+              this.qrCodeSvg = `data:image/svg+xml;utf8,${encodeURIComponent(
+                svg
+              )}`;
             })
             .catch(err => {
               console.error(err);