使用 SPA 且沒有服務器端計算時，如何正確處理 404 HTTP 錯誤？

Question

我目前正在我的一個網站項目中使用Vue.js。

返回此 Vue.js SPA 的服務器將無法進行計算或檢查，並且只會提供在瀏覽器中運行 SPA 所需的靜態資源，然后所有計算都將在瀏覽器中進行。

出於 SEO 的目的，我想確保正確處理錯誤頁面。 目前，每個 URL 都會返回200 OK並為 SPA 提供服務，這可能會混淆搜索引擎來查找實際上應該無效的頁面。 如果我無法更改服務器提供的響應，那么告訴用戶和搜索引擎該頁面無效的正確方法是什么？

對於上下文，SPA 將從另一個域上的 API 獲取數據。

我查看了其他類似的問題，但他們通常推薦服務器端檢查、專用 404 頁面重定向或軟 404 頁面。 服務器端檢查和專用 404 頁面將是不可能的，而且我已經讀到搜索引擎不喜歡軟 404 頁面。

有什么合適的方法可以解決這個問題嗎？

我看過這篇文章，但它已經很老了，只建議一個無索引標簽，這仍然使頁面在搜索引擎眼中有效，只是不可索引。

Answer 1

您不能在沒有任何服務器端計算/渲染的情況下返回 404 錯誤，因為找不到資源/頁面這一事實依賴於某些僅在您的情況下在客戶端執行的邏輯。 因此，您唯一的選擇如下：

• 如果未找到資源，將用戶重定向到預定義的 404 頁面（返回正確的 HTTP 狀態）

• 將代理內部無效的路徑列入黑名單，或將有效路徑列入白名單，並代理到所有其他路徑上的 404 頁面

• 使用您的有效頁面/路線手動創建站點地圖

如果您的項目增長或您有動態路由，這些選項都不是最佳選擇，但這些都是客戶端渲染的限制。 因此，我認為您的問題沒有很好的答案，因為這是眾所周知的客戶端渲染限制，也是關心 SEO 的項目更喜歡服務器端渲染的主要原因之一。

從 SEO 的角度來看：只要您將所有有效頁面添加到站點地圖，並且不鏈接（錨標記）到任何其他頁面上的無效頁面，搜索引擎爬蟲將永遠不會抓取或索引這些頁面。

但是，如果您真的很關心 SEO 並且有一個動態應用程序，其中包含無法手動添加到站點地圖的成百上千個動態鏈接，我建議您切換到像 Nuxt.js 或 Next.js 這樣的生產框架，因為它們提供您正在尋找的內容以及許多其他開箱即用的 SEO 功能。