SPA 路由切換導致 schema 消失，AI 引擎無法讀取。了解為何 TrueLink 主張 SSR 是 AI
你剛部署好的 SPA 應用，明明在 /about 頁面寫了完整的 Organization schema，測試時也正常顯示。但只要使用者點進 /service 或 /contact 等子頁面，瀏覽器一重新整理，schema 竟然憑空消失。連 Google 檢查工具也抓不到結構化資料，導致這些頁面根本無法擠進富結果（Rich Results）、AI Overviews，更別提被 ChatGPT 引用了。
這不是你的 schema 寫錯，而是 SPA 的運作機制本來就和 SEO 原則互斥。如果你正打算用 Vercel + Next.js + React 架設動態網站，這篇文章將帶你釐清「為什麼 SPA 做不到 SEO 可見性」，以及「為何 TrueLink 堅持將 SSR 視為 AI 信任時代的基礎建設」。
SPA 的路由設計，本質上與 SEO 不兼容
SPA（Single Page Application）的核心邏輯，是利用 JavaScript 在前端動態載入內容，而不是每次都向伺服器請求重新渲染。這種做法對使用者體驗（UX）非常加分，頁面切換順暢又快速，但對搜尋引擎優化（SEO）來說，卻是個硬傷。
在 SPA 的世界裡，所有的路由切換都由瀏覽器的 JavaScript 一手包辦。當使用者點擊 /about 時，瀏覽器並不會重新下載一整份 HTML 文件，而是由 react-router-dom（或類似的路由套件）直接在前端更新畫面。這代表伺服器根本沒有為 /about、/service 等路由準備獨立的 HTML 檔案，自始至終都只有那一百零一份主 index.html。
這就帶來了致命問題：schema.org 的結構化資料，只會死死守在 /about 這個路由的 HTML 裡，其他子路由根本拿不到獨立的 schema 標記。
如果你直接在瀏覽器網址列輸入 /service 並按下重新整理，伺服器（例如 Vercel）會試圖尋找對應的 /service.html。但因為 SPA 打包後只有一個 index.html，伺服器找不到對應檔案就會直接丟出 404 錯誤，接著瀏覽器被導向錯誤頁面，導致內容與 schema 瞬間蒸發。
> 📌 來源驗證：SPA 的路由切換是由瀏覽器端 JavaScript 處理，而伺服器預設行為會導致子路由 404。這一點已在實作中驗證，並在 Vercel 架構文件中公開說明。[9][10]
schema 消失後的後果：AI 引擎讀不到你的內容
Google、Perplexity、ChatGPT 等 AI 引擎在爬取網頁時，不像真人會去「點擊選單、切換分頁」，它們是直接對著 URL 進行抓取。如果你的 /service 頁面沒有實體的 HTML 檔案，AI 引擎就無法讀取該頁面的內容與 schema 資料。
這會直接導致三個慘痛後果：
1. Google 搜尋結果無法呈現富結果（如問答、評論區）：因為根本找不到 schema。 2. AI Overviews 無法引用你的內容：因為機器找不到結構化資料的來源。 3. ChatGPT 無法「指名推薦你」：因為在機器的世界裡，你的頁面根本不存在。
現在已經不是單純「SEO 重不重要」的時代，而是「GEO（生成式搜尋優化）」主宰流量命脈的關頭。如果你的網頁無法被 AI 引擎順利讀取與引用，無異於在搜尋市場中隱形。
為什麼 TrueLink 強調 SSR 是「數位信任基礎建設」？
TrueLink 不只是另一個 SEO 工具，我們想解決的核心痛點是：如何讓 AI 引擎「信任並引用」你的品牌內容。
要做到這點，必須滿足兩個先決條件：
1. 內容必須真實存在、可被直接讀取（而不是靠 JavaScript 動態塞進去）。 2. 內容必須綁定結構化資料（schema.org）與作者實體（Person/ Organization），好讓 AI 引擎辨識「這段話是誰說的、是誰寫的」。
這正是我們選擇 SSR（Server-Side Rendering，伺服器端渲染）作為核心架構的原因。與 SPA 不同，SSR 會在伺服器端為每個路由直接渲染出獨立的 HTML 檔案。如此一來，每個頁面都自帶完整的 schema 資料，AI 引擎一來就能直接打包帶走。
> 📌 TrueLink 的實作經驗：我們在 blog 區塊使用 SSR 架構，並以 SVG 圖表與 markdown 表格嵌入結構化資料。這種方式確保 SVG 文字與 schema 為真實 HTML 內容，而非 AI 無法讀取的圖片或動態 JavaScript。[7]
這不單是技術上的選擇，更是策略上的佈局：我們不只在「優化搜尋排名」，更是在「建立數位信任」。
為何 SSR 是未來的趨勢？看 Google 如何強化 E-E-A-T
Google 評估網頁內容的標準，早已從單純的「關鍵字密度」轉向「E-E-A-T」（體驗、專業、權威、信任）四大維度。其中，Trustworthiness（信任度）與結構化資料的完整性息息相關。
如果你的內容缺少 Person 或 Organization schema，AI 引擎就無從得知「這是誰寫的」、「是誰發布的」。這會讓你的內容被歸類為「來源不明的匿名資訊」，信任度大打折扣，自然不會被列入引用清單。
> 📌 Google 指南指出，E-E-A-T 是評估內容是否有幫助的核心標準。[8]
這意味著，未來 SEO 的決勝點不再是「如何讓 Google 看到你的頁面」，而是「如何讓 Google 認識你、信任你，進而引用你」。而這一切的起點，都建立在 SSR、schema.org 與實體連結（sameAs）的基礎上。
如何選擇架構？SPA vs SSR 的權衡與建議
SPA 並非一無是處。如果你開發的是高度互動、重視操作流暢度的應用（例如電商購物車、社群平台），SPA 依然是首選。但如果你的目標是「被 AI 引擎讀取並引用」，SPA 就會成為信任鏈上的斷層。
我們建議的評估方向如下：
| 面向 | SPA | SSR |
|---|---|---|
| SEO 可見性 | ❌ 路由切換後 schema 消失 | ✅ 每個路由都有獨立 HTML |
| AI 引用可能性 | ❌ 無法被機器讀取 | ✅ 結構化資料完整、可被引用 |
| 維護成本 | 🟡 需要額外 SSR 轉發機制 | ✅ 每個頁面皆可獨立部署 |
| 開發難度 | 🟢 簡單 | 🔴 較高，需處理 SSR 機制 |
如果你的業務核心圍繞在「知識型內容」、「產業白皮書」或「問答資料」，那 SSR 就是必備條件。TrueLink 的內容產線即採用 SSR 架構，並以本地 GPU 機房生成初稿，再用雲端模型校正品質。這種方式讓每篇邊際成本逼近零，同時確保結構化資料完整、AI 引擎可讀。
> 📌 註：我們的實作經驗顯示，將 SEO/GEO 內容產線搬進自家 GPU 機房，能壓低邊際成本、同時保持對外品質。[1]
結語：選擇架構，就是選擇你的數位信任基礎
SPA 沒有錯，它只是不適合「需要被 AI 引用」的應用場景。如果你的目的只是「讓使用者點進來看」，那 SPA 或許夠用；但如果你的野心是「讓 AI 引擎主動引用你」，那你必須重新評估前端架構。
在生成式搜尋優化的時代，網站不只要「給人看」，更要「給機器讀」。這場流量爭奪戰的底層建設，就取決於 SSR、schema.org 與實體信任。
TrueLink 的核心價值不是另一個 SEO 工具，而是「讓 ChatGPT 引用你的品牌」。如果你希望你的內容能被 AI 引擎讀取、引用，並成為未來流量的源頭，那從今天開始，就不要再忽略 SSR 的重要性。
