使用動態轉譯功能做為暫時替代方案

在某些網站上，當　JavaScript 在瀏覽器執行時，會在網頁上產生其他內容。 這就是所謂的用戶端轉譯。當　Google 搜尋執行 JavaScript 時，Google 搜尋中的 JavaScript 功能會有些限制，且部分網頁會在轉譯 HTML 中可能會遇到無法顯示內容的問題。其他搜尋引擎可能會選擇忽略 JavaScript，而且不會看到 JavaScript 產生的內容。

如果搜尋引擎看不到 JavaScript 產生的內容，動態轉譯功能就是網站的替代方案。 動態轉譯伺服器會偵測可能看不見 JavaScript 產生內容的漫遊器，並在沒有這些 JavaScript 的情況下提供伺服器轉譯的版本給這些漫遊器，同時向使用者顯示用戶端轉譯內容的版本。

動態轉譯是一種替代方案，而非建議的解決方案，因為使用動態轉譯會增加複雜性和資源需求。

建議採用動態轉譯的網站

動態轉譯功能是一種替代方案，適用於符合以下條件的內容：可供建立索引、由 JavaScript 產生且會經常變更的公開內容，或者是使用了檢索器不支援的 JavaScript 功能，但卻很重要的內容。並非所有網站都需要使用動態轉譯，而且還有比動態轉譯更好的解決方案，如網路上的這篇文章所述。

瞭解動態轉譯的運作方式

使用動態轉譯時，您的網路伺服器需要偵測檢索器 (例如檢查使用者代理程式)。系統會將來自檢索器的要求轉送到轉譯器，並照常處理使用者的要求。如有必要，動態轉譯器會提供適合檢索器使用的內容版本，例如靜態 HTML 版本。您可以選擇為所有網頁啟用動態轉譯器，或針對每個頁面個別指定是否啟用。

動態轉譯並非偽裝行為

一般來說，Googlebot 不會將動態轉譯視為偽裝行為。 事實上，只要動態轉譯產生的是類似內容，就不會被 Googlebot 視為偽裝行為。

設定動態轉譯時，網站可能會產生錯誤網頁。Googlebot 不會將這些錯誤網頁視為偽裝行為，而是會比照處理其他錯誤網頁的方式來處理這個錯誤。

但是，如果您使用動態轉譯向使用者和檢索器提供完全不同的內容，Googlebot 可能就會將其視為偽裝行為。舉例來說，如果網站向使用者提供有關貓的網頁，但卻向檢索器提供狗的網頁，就可能會視為偽裝行為。

導入動態轉譯

如要為內容設定動態轉譯，請按照我們的一般指南操作。請根據實際設定環境來採用適當的操作流程，因為各項設定的導入方式可能大不相同。

1. 安裝並設定動態轉譯器 (例如 Puppeteer、Rendertron 或 prerender.io) 將內容轉換成易於檢索器使用的靜態 HTML。
2. 選擇要接收靜態 HTML 的使用者代理程式，並參考具體的設定方式，瞭解如何更新或新增使用者代理程式。以下是 Rendertron 中介軟體中常見的使用者代理程式清單範例：

   export const botUserAgents = [
     'googlebot',
     'bingbot',
     'linkedinbot',
     'mediapartners-google',
   ];

3. 如果預先轉譯會導致伺服器速度變慢，或您發現有大量預先轉譯要求，不防導入預先轉譯內容快取功能，或驗證要求是否來自合法檢索器。
4. 判斷使用者代理程式要求電腦版或行動版內容，然後使用動態服務來提供適合的版本。以下例子說明如何透過設定來判斷使用者代理程式需要電腦版或行動版內容：

   isPrerenderedUA = userAgent.matches(botUserAgents)
   isMobileUA = userAgent.matches(['mobile', 'android'])
   
   
   if (!isPrerenderedUA) {
   } else {
     servePreRendered(isMobileUA)
   }

5. 設定伺服器，提供靜態 HTML 給所選檢索器。方法有很多種，您可以根據自己採用的技術，決定要採用哪種做法。以下列出幾個範例：
   • 以 Proxy 伺服器處理檢索器對動態轉譯器的要求。
   • 在部署程序中進行預先轉譯，並且讓伺服器向檢索器提供靜態 HTML。
   • 在自訂伺服器程式碼中建構動態轉譯。
   • 將來自預先轉譯服務的靜態內容提供給檢索器。
   • 為伺服器使用中介軟體 (例如 rendertron 中介軟體)。

驗證您的設定

順利導入動態轉譯功能後，請針對網址檢查以下項目並確保一切如預期運作：

1. 使用網址檢查工具測試行動版和電腦版內容，確定電腦版內容也能顯示在轉譯後的網頁上 (這個網頁代表 Google 檢視您的網頁時所看到的內容)。

   done 成功：電腦版和行動版內容與希望呈現給使用者瀏覽的內容相符。

   error 再試一次：如果您看到的內容與預期不符，請參閱「疑難排解」一節。

2. 如果您使用結構化資料，請透過複合式搜尋結果測試來測試結構化資料能否正確轉譯。

   done 成功：結構化資料會按照預期顯示。

   error 再試一次：如果結構化資料無法按照預期顯示，請參閱「疑難排解」一節。

疑難排解

如果您的內容在網址檢查工具中出現錯誤，或者無法顯示在 Google 搜尋結果中，請試著先解決常見問題。假如都試過了還是遇到問題，請至 Google 搜尋中心產品討論社群張貼新主題提問。

內容不完整或看起來不一樣

error 問題發生原因：您的轉譯器可能設定錯誤，或是網頁應用程式與轉譯解決方案不相容。有時候逾時也會導致內容無法正確轉譯。

done 修正問題：請參閱特定轉譯解決方案的說明文件，針對動態轉譯設定進行偵錯。

回應時間過久

error 問題發生原因：使用無頭瀏覽器隨選轉譯網頁經常會導致回應時間過久，造成檢索器取消要求，並且不為您的內容建立索引。檢索器在檢索內容和建立索引時，回應時間過久也可能會造成檢索頻率降低。

done 修正問題

1. 在建構過程中，為預先轉譯的 HTML 設定快取，或為內容建立靜態 HTML 版本。
2. 務必在設定中啟用快取 (例如將檢索器指向快取)。
3. 利用行動裝置相容性測試或 WebPageTest 等測試工具，搭配 Google 檢索器使用者代理程式清單中的自訂使用者代理程式字串，檢查檢索器是否能快速擷取您的內容。您的要求不應逾時。

網頁元件無法正常顯示

error 問題發生原因：shadow DOM 與網頁的其他部分隔離。 轉譯解決方案 (例如 Rendertron) 無法查看隔離 shadow DOM 中的內容。 如需詳細資訊，請參閱網頁元件最佳做法。

done 修正問題

1. 為自訂元素和 shadow DOM 載入 webcomponents.js polyfills。
2. 執行轉譯解決方案後，請利用行動裝置相容性測試或網址檢查工具，檢查內容是否出現在轉譯後的 HTML 中。

缺少結構化資料

error 問題發生原因：缺少結構化資料使用者代理程式，或輸出結果未包含 JSON-LD 指令碼標記，都有可能導致出現結構化資料錯誤。

done 修正問題

1. 透過複合式搜尋結果測試，確認網頁能正確顯示結構化資料。接著設定使用者代理程式，使用電腦版或行動版 Googlebot 測試預先轉譯的內容。
2. 確認您內容的動態轉譯 HTML 已納入 JSON-LD 指令碼標記。詳情請參閱您的轉譯解決方案說明文件。