將 AMP 與您的應用程式整合

本指南適用於想要整合及連結至 AMP 頁面的行動和網路應用程式開發人員。例如，考量一個行動聊天應用程式，該應用程式會載入共享網址的 AMP 版本，以便為使用者提供更快速的體驗。

將連結轉換為 AMP

透過 AMP，可以在您的原生或行動網路應用程式中近乎即時地呈現外部網站。您可以透過將內容中的網址與其對應的 AMP 網址 (如果存在) 進行比對，並開啟 AMP 版本而非原始版本來達成此目的。您可以使用 Google AMP URL API 等工具來協助您完成此作業。

例如，可以轉換以下訊息，方法是將所有網址替換為其相符的 AMP 版本 (如果存在)。為了縮短載入時間並確保提供有效的 AMP，您應該連結至 AMP 快取中的快取 AMP 頁面。

原始訊息

This is a message with links to an <a href="http://www.example.org/a">
article with AMP version</a> and an <a href="http://www.example.org/b"> article without AMP version</a>.

已轉換訊息

This is a message with links to an <a href="https://www-example-org.cdn.ampproject.org/c/www.example.org/a">
article with AMP version</a> and an <a href="www.example.org/b"> article without AMP version</a>.

提示 – 考慮讓使用者能夠選擇透過應用程式中的偏好設定來檢視非 AMP 版本，而不是 AMP 版本。

轉換連結的方式

有三種以程式設計方式轉換連結的方法

寫入時伺服器端 (建議)：在網址的寫入時透過 Google AMP URL API 擷取 AMP 網址，並將 AMP 網址儲存在伺服器端。將原始網址和 AMP 網址都傳遞至用戶端，因為共用時可能需要原始網址。這是建議的方法，因為用戶端網路請求較少。採用此方法時，定期 (例如，每天) 掃描連結以尋找 AMP 版本非常重要，因為網站越來越常採用 AMP 格式。
讀取時伺服器端 (部分使用)：在將內容傳遞至您的用戶端之前，透過 Google AMP URL API 擷取 AMP 網址。如上所述，將原始網址和 AMP 網址都傳遞至用戶端，因為共用時可能需要原始網址。此方法可能適用於低扇出服務。
用戶端 (如果伺服器端不可行)：從用戶端透過 Google AMP URL API 擷取 AMP 網址。如果伺服器端網址轉換不可行，請使用此方法 (例如，對於使用端對端加密的訊息應用程式)。請務必在內容可用後立即觸發網址轉換，在任何使用者互動發生之前。

重要事項 – 絕不要因為使用者互動而透過 Google AMP API 請求 AMP 網址，因為這會引入額外的網路請求，進而降低應用程式的效能。請改用上述三種方法之一。

Google AMP URL API

Google 提供 AMP URL API，以擷取指定網址清單的相符 AMP HTML 網址 (官方文件 / 示範)。網址不需要是標準版本。如果 AMP 版本存在，則回應會包含原始 AMP 網址和 Google AMP 快取上快取 AMP 頁面的網址。

例如，對於指定的網址清單

{"urls": [
  "https://www.example.org/article-with-amp-version",
  "http://www.example.com/no-amp-version.html"
]}

回應主體包含 JSON 格式的 AMP 網址對應

{
  "ampUrls": [
    {
      "originalUrl": "https://www.example.org/article-with-amp-version",
      "ampUrl": "https://www.example.org/article-with-amp-version/amp",
      "cdnAmpUrl": "https://www-example-org.cdn.ampproject.org/c/s/www.example.org/article-with-amp-version"
    }
  ],
  "urlErrors": [
    {
      "errorCode": "NO_AMP_URL",
      "errorMessage": "AMP URL not found.",
      "originalUrl": "http://www.example.com/no-amp-version.html"
    }
  ]
}

注意 – 無法透過 AMP URL API 擷取非 Google AMP 快取上快取 AMP 頁面的網址。但是，您可以輕鬆地從傳回的 AMP 網址 (ampURL) 推導出快取網址。

使用 AMP 快取

AMP 快取是基於 Proxy 的內容傳遞網路 (CDN)，用於傳遞有效的 AMP 文件。AMP 快取的設計目的在於

僅提供有效的 AMP 頁面。
允許有效率且安全地預先載入 AMP 頁面。
對內容執行額外的使用者受益效能最佳化。

目前，有兩個 AMP 快取供應商

這提供兩種選擇，可透過使用下列其中一種方式在應用程式中顯示 AMP 檔案

發佈商託管的版本
AMP 快取中託管的版本

我們建議使用 AMP 快取，原因如下

由於載入時間更快且延遲時間短 (載入時間快 1 秒以上)，因此使用者體驗更佳。
由於額外快取用戶端相關的成品，例如，根據用戶端的可視區域大小快取相同影像的不同版本，因此可獲得效能和頻寬優勢。
原始 AMP 檔案可能不再是有效的 AMP，這可能會導致不良的使用者體驗。在這種情況下，AMP 快取會提供 AMP 檔案的最後一個有效版本。
不正直的發佈商可能會向 AMP 快取檢索器和您的使用者提供兩個不同的文件。使用 AMP 快取可保證使用者始終看到與快取相同的 AMP 檔案。

重要事項 – 透過 AMP 快取提供 AMP 頁面時，請提供檢視器體驗，清楚顯示 AMP 的來源，並讓使用者可以共用標準網址 (另請參閱以下兩節以瞭解更多相關資訊)。

實作 AMP Viewer

AMP Runtime 提供 Viewer API，該 API 提供一個協定，用於在 AMP Runtime 和 Viewer 之間傳送和接收訊息。這使得可以控制 AMP 文件的預先呈現、文章之間的滑動以及 AMP Runtime 檢測。您可以在將 AMP Viewer 與 AMP 頁面連結指南中瞭解更多關於 AMP Viewer API 的資訊。適用於 Web 和 iOS 的 Viewer 實作可在 GitHub 上取得。Android Viewer 尚不可用，請參閱 Stack Overflow 上的此回答，瞭解如何最佳地設定 WebView 以顯示 AMP 頁面。

以下是一些實作 AMP Viewer 的一般最佳實務

從 AMP 快取提供 AMP 頁面 (載入時間快 1 秒以上)。
顯示文章的發佈商來源 (例如，在可摺疊的標頭中)。
提供共用動作 (另請參閱下方的「分享 AMP 內容」章節)。
在基於 webView 的檢視器中，啟用第三方 Cookie。
為您的平台/應用程式設定參照位址。

從平台 AMP Viewer 內部分享 AMP 文件時，平台應在技術上可行時共用標準網址。例如，如果平台提供共用按鈕，則此按鈕應共用標準網址。

AMP 專案的理念是平台應可選擇向使用者呈現哪個版本的文件。因此，在共用至不同平台時，共用標準版本 (而不是 AMP 版本) 最合理，然後期望目標平台做出正確的選擇。