Merge pull request #497 from nagisa77/codex/add-title-and-metadata-for-seo

feat: enhance SEO titles and descriptions

frontend_nuxt/pages/index.vue

@@ -140,6 +140,16 @@ export default {
       ),
   },
   async setup() {
+    useHead({
+      title: 'OpenIsle - 全面开源的自由社区',
+      meta: [
+        {
+          name: 'description',
+          content:
+            'OpenIsle 是一个开放的技术与交流社区，致力于为开发者、技术爱好者和创作者们提供一个自由、友好、包容的讨论与协作环境。我们鼓励用户在这里分享知识、交流经验、提出问题、展示作品，并共同推动技术进步与社区成长。',
+        },
+      ],
+    })
     const route = useRoute()
     const selectedCategory = ref('')
     if (route.query.category) {

frontend_nuxt/pages/posts/[id]/index.vue

@@ -268,33 +268,24 @@ export default {
     const isFetchingComments = ref(false)
     const isMobile = useIsMobile()
 
-    // record default metadata from the main document (client only)
-    const defaultTitle = process.client ? document.title : ''
-    const metaDescriptionEl = process.client
-      ? document.querySelector('meta[name="description"]')
-      : null
-    const defaultDescription =
-      process.client && metaDescriptionEl ? metaDescriptionEl.getAttribute('content') : ''
     const headerHeight = process.client
       ? parseFloat(
           getComputedStyle(document.documentElement).getPropertyValue('--header-height'),
         ) || 0
       : 0
 
+    useHead(() => ({
+      title: title.value ? `OpenIsle - ${title.value}` : 'OpenIsle',
+      meta: [
+        {
+          name: 'description',
+          content: stripMarkdownLength(postContent.value, 400),
+        },
+      ],
+    }))
+
     if (process.client) {
-      watch(title, (t) => {
-        document.title = `OpenIsle - ${t}`
-      })
-
-      watch(postContent, (c) => {
-        if (metaDescriptionEl) {
-          metaDescriptionEl.setAttribute('content', stripMarkdownLength(c, 400))
-        }
-      })
-
       onBeforeUnmount(() => {
-        document.title = defaultTitle
-        if (metaDescriptionEl) metaDescriptionEl.setAttribute('content', defaultDescription)
         window.removeEventListener('scroll', updateCurrentIndex)
         if (countdownTimer) clearInterval(countdownTimer)
       })