qrcode 改为cdn

blog.config.js

@@ -119,6 +119,8 @@ const BLOG = {
 
   // Mermaid 图表CDN
   MERMAID_CDN: process.env.NEXT_PUBLIC_MERMAID_CDN || 'https://cdnjs.cloudflare.com/ajax/libs/mermaid/10.2.4/mermaid.min.js', // CDN
+  // QRCodeCDN
+  QR_CODE_CDN: process.env.NEXT_PUBLIC_QR_CODE_CDN || 'https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js',
 
   BACKGROUND_LIGHT: '#eeeeee', // use hex value, don't forget '#' e.g #fffefc
   BACKGROUND_DARK: '#000000', // use hex value, don't forget '#'

components/GoogleAdsense.js

@@ -21,7 +21,7 @@ export default function GoogleAdsense() {
           for (let i = 0; i <= ads.length; i++) {
             try {
               adsbygoogle.push(ads[i])
-              console.log('adsbygoogle', i, ads[i], adsbygoogle)
+            //   console.log('adsbygoogle', i, ads[i], adsbygoogle)
             } catch (e) {
 
             }

components/PrismMac.js

@@ -141,7 +141,6 @@ const renderMermaid = async() => {
           if (needLoad) {
             loadExternalResource(BLOG.MERMAID_CDN, 'js').then(url => {
               const mermaid = window.mermaid
-              console.log('mermaid加载成功', url, mermaid)
               mermaid.contentLoaded()
             })
           }

components/QrCode.js

@@ -0,0 +1,34 @@
+import BLOG from '@/blog.config'
+import { loadExternalResource } from '@/lib/utils'
+import { useEffect } from 'react'
+
+/**
+ * 二维码生成
+ */
+export default function QrCode({ value }) {
+  useEffect(() => {
+    let qrcode
+    if (!value) {
+      return
+    }
+    loadExternalResource(BLOG.QR_CODE_CDN, 'js').then(url => {
+      const QRCode = window.QRCode
+      qrcode = new QRCode(document.getElementById('qrcode'), {
+        text: value,
+        width: 256,
+        height: 256,
+        colorDark: '#000000',
+        colorLight: '#ffffff',
+        correctLevel: QRCode.CorrectLevel.H
+      })
+      console.log('二维码', qrcode, value)
+    })
+    return () => {
+      if (qrcode) {
+        qrcode.clear() // clear the code.
+      }
+    }
+  }, [])
+
+  return <div id="qrcode"></div>
+}

components/ShareButtons.js

@@ -1,6 +1,7 @@
 import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import copy from 'copy-to-clipboard'
+import dynamic from 'next/dynamic'
 import { useState } from 'react'
 
 import {
@@ -48,6 +49,8 @@ import {
   HatenaIcon
 } from 'react-share'
 
+const QrCode = dynamic(() => import('@/components/QrCode'), { ssr: false })
+
 /**
  * @author https://github.com/txs
  * @param {*} param0
@@ -345,8 +348,8 @@ const ShareButtons = ({ shareUrl, title, body, image }) => {
                         </div>
                         <div className='absolute'>
                         <div id='pop' className={(qrCodeShow ? 'opacity-100 ' : ' invisible opacity-0') + ' z-40 absolute bottom-10 -left-10 bg-white shadow-xl transition-all duration-200 text-center'}>
-                                <div className='p-2 mt-1'>
-                                    {/* <QRCode value={shareUrl} fgColor='#000000' /> */}
+                                <div className='p-2 mt-1 w-28 h-28'>
+                                    <QrCode value={shareUrl}/>
                                 </div>
                                 <span className='text-black font-semibold p-1 rounded-t-lg text-sm mx-auto mb-1'>
                                     {locale.COMMON.SCAN_QR_CODE}

lib/utils.js

@@ -39,8 +39,14 @@ export function loadExternalResource(url, type) {
       tag.src = url
     }
     if (tag) {
-      tag.onload = () => resolve(url)
-      tag.onerror = () => reject(url)
+      tag.onload = () => {
+        console.log(url, '加载成功')
+        resolve(url)
+      }
+      tag.onerror = () => {
+        console.log(url, '加载失败')
+        reject(url)
+      }
       document.head.appendChild(tag)
     }
   })

themes/gitbook/index.js

@@ -53,7 +53,6 @@ const LayoutBase = (props) => {
   const showTocButton = post?.toc?.length > 1
 
   useEffect(() => {
-    console.log('更新导航', allNavPages)
     setFilteredNavPages(allNavPages)
   }, [post])