feat: switch canonical SEO to primary domain

Author: Otto-J

.env.example

@@ -4,8 +4,8 @@ REDIS_URL=redis://:local_password@127.0.0.1:6379
 REDIS_IMAGE=redis:7.0.15
 REDIS_PORT=6379
 REDIS_PASSWORD=local_password
-PUBLIC_SITE_URL=https://staging.example.com
-PUBLIC_ALLOW_INDEXING=false
+PUBLIC_SITE_URL=https://webworker.tech
+PUBLIC_ALLOW_INDEXING=true
 JWT_SECRET=change-me-to-a-long-random-secret
 ADMIN_USERNAME=admin
 ADMIN_PASSWORD=change-me

astro.config.mjs

@@ -5,7 +5,7 @@ import vue from '@astrojs/vue'
 import tailwindcss from '@tailwindcss/vite'
 
 export default defineConfig({
-  site: process.env.PUBLIC_SITE_URL || 'https://new.webworker.tech',
+  site: process.env.PUBLIC_SITE_URL || 'https://webworker.tech',
   integrations: [vue()],
   output: 'server',
   adapter: node({

docker-compose.prod.yml

@@ -22,8 +22,8 @@ services:
       RSS_URL: ${RSS_URL:-https://feed.xyzfm.space/rv449dl9kqka}
       EPISODES_DIR: /app/content/episodes
       REDIS_URL: ${REDIS_URL:?REDIS_URL is required}
-      PUBLIC_SITE_URL: ${PUBLIC_SITE_URL:-https://staging.example.com}
-      PUBLIC_ALLOW_INDEXING: ${PUBLIC_ALLOW_INDEXING:-false}
+      PUBLIC_SITE_URL: ${PUBLIC_SITE_URL:-https://webworker.tech}
+      PUBLIC_ALLOW_INDEXING: ${PUBLIC_ALLOW_INDEXING:-true}
       JWT_SECRET: ${JWT_SECRET:?JWT_SECRET is required}
       ADMIN_USERNAME: ${ADMIN_USERNAME:-admin}
       ADMIN_PASSWORD: ${ADMIN_PASSWORD:?ADMIN_PASSWORD is required}

src/layouts/Layout.astro

@@ -5,15 +5,25 @@ export interface Props {
   title: string
   description?: string
   image?: string
+  type?: 'website' | 'article'
 }
 
 const {
   title,
   description = '前端程序员闲聊的中文播客节目',
   image = '/logo500.webp',
+  type = 'website',
 } = Astro.props
 
-const allowIndexing = import.meta.env.PUBLIC_ALLOW_INDEXING === 'true'
+const allowIndexing = process.env.PUBLIC_ALLOW_INDEXING === 'true'
+const siteOrigin = (
+  Astro.site?.toString() ||
+  import.meta.env.PUBLIC_SITE_URL ||
+  'https://webworker.tech'
+).replace(/\/$/, '')
+const canonicalUrl = new URL(Astro.url.pathname, siteOrigin).toString()
+const imageUrl = new URL(image, siteOrigin).toString()
+const rssUrl = process.env.RSS_URL || 'https://feed.xyzfm.space/rv449dl9kqka'
 ---
 
 <!doctype html>
@@ -28,26 +38,30 @@ const allowIndexing = import.meta.env.PUBLIC_ALLOW_INDEXING === 'true'
     }
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="icon" type="image/webp" href="/logo500.webp" />
+    <link rel="canonical" href={canonicalUrl} />
     <meta name="generator" content={Astro.generator} />
 
     <link
-      href="https://www.xiaoyuzhoufm.com/podcast/613753ef23c82a9a1ccfdf35"
+      href={rssUrl}
       rel="alternate"
-      title="Web Worker 播客 小宇宙"
+      title="Web Worker 播客 RSS"
       type="application/rss+xml"
     />
 
     <!-- Open Graph -->
     <meta property="og:title" content={title} />
     <meta property="og:description" content={description} />
-    <meta property="og:image" content={image} />
-    <meta property="og:type" content="website" />
+    <meta property="og:image" content={imageUrl} />
+    <meta property="og:type" content={type} />
+    <meta property="og:url" content={canonicalUrl} />
+    <meta property="og:site_name" content="Web Worker" />
+    <meta property="og:locale" content="zh_CN" />
 
     <!-- Twitter Card -->
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:title" content={title} />
     <meta name="twitter:description" content={description} />
-    <meta name="twitter:image" content={image} />
+    <meta name="twitter:image" content={imageUrl} />
 
     <title>{title}</title>
   </head>

src/pages/episode/[id].astro

@@ -3,6 +3,7 @@ import Layout from '@/layouts/Layout.astro'
 import Header from '@/components/layout/Header.vue'
 import Footer from '@/components/layout/Footer.vue'
 import { getEpisodeById } from '@/utils/podcast'
+import { stripHtml } from '@/server/markdown'
 import {
   ChevronLeft,
   Mic,
@@ -18,9 +19,18 @@ const episode = Astro.params.id
 if (!episode) {
   return Astro.redirect('/404')
 }
+
+const episodeDescription =
+  stripHtml(episode.description || episode.showNotes || '').slice(0, 160) ||
+  'Web Worker 播客单集'
 ---
 
-<Layout title={episode.title}>
+<Layout
+  title={`${episode.title} - Web Worker`}
+  description={episodeDescription}
+  image={episode.imageUrl}
+  type="article"
+>
   <Header client:load />
 
   <main class="container mx-auto px-4 py-8 pb-24">

src/pages/episodes.astro

@@ -22,7 +22,10 @@ const categories = [
 ]
 ---
 
-<Layout title="全部播客 - MindTech">
+<Layout
+  title="全部播客 - Web Worker"
+  description={`收听 Web Worker 播客全部 ${allEpisodes.length} 期节目，按标题搜索前端技术、工程实践和开发者社区相关内容。`}
+>
   <Header client:load />
 
   <main class="container mx-auto px-4 py-8 md:py-12 pb-24 md:pb-0">

src/pages/index.astro

@@ -52,7 +52,10 @@ const testimonials: Testimonial[] = [
 ]
 ---
 
-<Layout title="Web Worker - 前端程序员都爱听的播客平台">
+<Layout
+  title="Web Worker - 前端程序员都爱听的播客"
+  description="Web Worker 是几个前端程序员闲聊的中文音频播客，关注前端技术、工程实践、职业成长与技术社区。"
+>
   <Header client:load />
 
   <main class="container mx-auto px-4 py-4 md:py-12">

src/pages/robots.txt.ts

@@ -2,9 +2,14 @@ import type { APIRoute } from 'astro'
 
 export const GET: APIRoute = ({ site }) => {
   const allowIndexing = process.env.PUBLIC_ALLOW_INDEXING === 'true'
-  const origin = site?.toString().replace(/\/$/, '') || 'https://new.webworker.tech'
+  const origin = site?.toString().replace(/\/$/, '') || 'https://webworker.tech'
   const lines = allowIndexing
-    ? ['User-agent: *', 'Allow: /', 'Disallow: /admin', 'Disallow: /api/admin']
+    ? [
+        'User-agent: *',
+        'Allow: /',
+        'Disallow: /admin',
+        'Disallow: /api/admin',
+      ]
     : ['User-agent: *', 'Disallow: /']
 
   return new Response([...lines, `Sitemap: ${origin}/sitemap.xml`, ''].join('\n'), {

src/pages/sitemap.xml.ts

@@ -12,7 +12,7 @@ function escapeXml(value: string) {
 
 export const GET: APIRoute = async ({ site }) => {
   const origin =
-    site?.toString().replace(/\/$/, '') || 'https://new.webworker.tech'
+    site?.toString().replace(/\/$/, '') || 'https://webworker.tech'
   const episodes = await getAllEpisodes()
   const urls = [
     { loc: '/', lastmod: new Date().toISOString() },