diff --git a/blog.config.js b/blog.config.js index fab696b8..9f8511b8 100644 --- a/blog.config.js +++ b/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 '#' diff --git a/components/GoogleAdsense.js b/components/GoogleAdsense.js index 22fca879..420dc993 100644 --- a/components/GoogleAdsense.js +++ b/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) { } diff --git a/components/PrismMac.js b/components/PrismMac.js index 172c6ceb..38742281 100644 --- a/components/PrismMac.js +++ b/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() }) } diff --git a/components/QrCode.js b/components/QrCode.js new file mode 100644 index 00000000..ca78c881 --- /dev/null +++ b/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
+} diff --git a/components/ShareButtons.js b/components/ShareButtons.js index 02ca7230..efd3ab87 100644 --- a/components/ShareButtons.js +++ b/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 }) => {