Notion内链自动替换

2026-05-19 23:16:48 +00:00 · 2024-05-13 12:15:15 +08:00
parent 2bff6993ff
commit b663d984ba
4 changed files with 138 additions and 94 deletions
--- a/components/ExternalPlugins.js
+++ b/components/ExternalPlugins.js
@@ -6,71 +6,12 @@ import TianLiGPT from './TianliGPT'
 import WebWhiz from './Webwhiz'

 import { CUSTOM_EXTERNAL_CSS, CUSTOM_EXTERNAL_JS } from '@/blog.config'
+import { mapPageUrl } from '@/lib/notion/mapPageUrl'
 import { isBrowser, loadExternalResource } from '@/lib/utils'
+import { useRouter } from 'next/router'
 import { useEffect } from 'react'
 import { initGoogleAdsense } from './GoogleAdsense'

-const TwikooCommentCounter = dynamic(
-  () => import('@/components/TwikooCommentCounter'),
-  { ssr: false }
-)
-const DebugPanel = dynamic(() => import('@/components/DebugPanel'), {
-  ssr: false
-})
-const ThemeSwitch = dynamic(() => import('@/components/ThemeSwitch'), {
-  ssr: false
-})
-const Fireworks = dynamic(() => import('@/components/Fireworks'), {
-  ssr: false
-})
-const MouseFollow = dynamic(() => import('@/components/MouseFollow'), {
-  ssr: false
-})
-const Nest = dynamic(() => import('@/components/Nest'), { ssr: false })
-const FlutteringRibbon = dynamic(
-  () => import('@/components/FlutteringRibbon'),
-  { ssr: false }
-)
-const Ribbon = dynamic(() => import('@/components/Ribbon'), { ssr: false })
-const Sakura = dynamic(() => import('@/components/Sakura'), { ssr: false })
-const StarrySky = dynamic(() => import('@/components/StarrySky'), {
-  ssr: false
-})
-const DifyChatbot = dynamic(() => import('@/components/DifyChatbot'), {
-  ssr: false
-})
-const Analytics = dynamic(
-  () =>
-    import('@vercel/analytics/react').then(async m => {
-      return m.Analytics
-    }),
-  { ssr: false }
-)
-const MusicPlayer = dynamic(() => import('@/components/Player'), { ssr: false })
-const Ackee = dynamic(() => import('@/components/Ackee'), { ssr: false })
-const Gtag = dynamic(() => import('@/components/Gtag'), { ssr: false })
-const Busuanzi = dynamic(() => import('@/components/Busuanzi'), { ssr: false })
-const Messenger = dynamic(() => import('@/components/FacebookMessenger'), {
-  ssr: false
-})
-const VConsole = dynamic(() => import('@/components/VConsole'), { ssr: false })
-const CustomContextMenu = dynamic(
-  () => import('@/components/CustomContextMenu'),
-  { ssr: false }
-)
-const DisableCopy = dynamic(() => import('@/components/DisableCopy'), {
-  ssr: false
-})
-const AdBlockDetect = dynamic(() => import('@/components/AdBlockDetect'), {
-  ssr: false
-})
-const LoadingProgress = dynamic(() => import('@/components/LoadingProgress'), {
-  ssr: false
-})
-const AosAnimation = dynamic(() => import('@/components/AOSAnimation'), {
-  ssr: false
-})
-
 /**
 * 各种插件脚本
 * @param {*} props
@@ -155,6 +96,7 @@ const ExternalPlugin = props => {
    }
  }

+  const router = useRouter()
  useEffect(() => {
    // 异步渲染谷歌广告
    if (ADSENSE_GOOGLE_ID) {
@@ -163,6 +105,11 @@ const ExternalPlugin = props => {
      }, 1000)
    }

+    // 映射url
+    mapPageUrl(props?.allNavPages)
+  }, [router])
+
+  useEffect(() => {
    // 执行注入脚本
    // eslint-disable-next-line no-eval
    eval(GLOBAL_JS)
@@ -389,4 +336,65 @@ const ExternalPlugin = props => {
  )
 }

+const TwikooCommentCounter = dynamic(
+  () => import('@/components/TwikooCommentCounter'),
+  { ssr: false }
+)
+const DebugPanel = dynamic(() => import('@/components/DebugPanel'), {
+  ssr: false
+})
+const ThemeSwitch = dynamic(() => import('@/components/ThemeSwitch'), {
+  ssr: false
+})
+const Fireworks = dynamic(() => import('@/components/Fireworks'), {
+  ssr: false
+})
+const MouseFollow = dynamic(() => import('@/components/MouseFollow'), {
+  ssr: false
+})
+const Nest = dynamic(() => import('@/components/Nest'), { ssr: false })
+const FlutteringRibbon = dynamic(
+  () => import('@/components/FlutteringRibbon'),
+  { ssr: false }
+)
+const Ribbon = dynamic(() => import('@/components/Ribbon'), { ssr: false })
+const Sakura = dynamic(() => import('@/components/Sakura'), { ssr: false })
+const StarrySky = dynamic(() => import('@/components/StarrySky'), {
+  ssr: false
+})
+const DifyChatbot = dynamic(() => import('@/components/DifyChatbot'), {
+  ssr: false
+})
+const Analytics = dynamic(
+  () =>
+    import('@vercel/analytics/react').then(async m => {
+      return m.Analytics
+    }),
+  { ssr: false }
+)
+const MusicPlayer = dynamic(() => import('@/components/Player'), { ssr: false })
+const Ackee = dynamic(() => import('@/components/Ackee'), { ssr: false })
+const Gtag = dynamic(() => import('@/components/Gtag'), { ssr: false })
+const Busuanzi = dynamic(() => import('@/components/Busuanzi'), { ssr: false })
+const Messenger = dynamic(() => import('@/components/FacebookMessenger'), {
+  ssr: false
+})
+const VConsole = dynamic(() => import('@/components/VConsole'), { ssr: false })
+const CustomContextMenu = dynamic(
+  () => import('@/components/CustomContextMenu'),
+  { ssr: false }
+)
+const DisableCopy = dynamic(() => import('@/components/DisableCopy'), {
+  ssr: false
+})
+const AdBlockDetect = dynamic(() => import('@/components/AdBlockDetect'), {
+  ssr: false
+})
+const LoadingProgress = dynamic(() => import('@/components/LoadingProgress'), {
+  ssr: false
+})
+const AosAnimation = dynamic(() => import('@/components/AOSAnimation'), {
+  ssr: false
+})
+
 export default ExternalPlugin
--- a/components/NotionPage.js
+++ b/components/NotionPage.js
@@ -47,9 +47,6 @@ const NotionPage = ({ post, className }) => {
      processDisableDatabaseUrl()
    }

-    // 处理页内的url
-    processPageUrl()
-
    /**
     * 放大查看图片时替换成高清图像
     */
@@ -146,36 +143,6 @@ const processGalleryImg = zoom => {
  }, 800)
 }

-/**
- * 处理页面内连接跳转:
- * 1. 若是本站域名，则在当前窗口打开、不开新窗口
- * 2. 若是Notion笔记中的内链，尝试转换成博客中现有的文章地址
- */
-const processPageUrl = () => {
-  if (isBrowser) {
-    const currentURL = window.location.origin + window.location.pathname
-    const allAnchorTags = document.getElementsByTagName('a') // 或者使用 document.querySelectorAll('a') 获取 NodeList
-    for (const anchorTag of allAnchorTags) {
-      // 检查url
-      if (anchorTag.href) {
-        // 如果是notion页面间的内链，尝试匹配成博客的文章链接
-      }
-
-      if (anchorTag?.target === '_blank') {
-        const hrefWithoutQueryHash = anchorTag.href.split('?')[0].split('#')[0]
-        const hrefWithRelativeHash =
-          currentURL.split('#')[0] + anchorTag.href.split('#')[1]
-
-        if (
-          currentURL === hrefWithoutQueryHash ||
-          currentURL === hrefWithRelativeHash
-        ) {
-          anchorTag.target = '_self'
-        }
-      }
-    }
-  }
-}
 /**
 * 根据url参数自动滚动到指定区域
 */