amp-ad-custom

<script async custom-element="amp-ad-custom" src="https://cdn.ampproject.org/v0/amp-ad-custom-0.1.js"></script>

總覽

AMP 範本廣告是提供有效 AMPHTML 廣告的替代方式，無需處理伺服器時間驗證和簽署的複雜程序。其大致概念是載入以 AMP 撰寫並由授權 AMP Proxy 伺服器提供的廣告範本，並透過從廣告伺服器擷取的 JSON 格式廣告資料，在用戶端轉譯廣告。

任何廣告聯播網若要提供 AMPHTML 範本廣告，整合程序包含 3 個部分

• AMPHTML 廣告範本建立
• 廣告伺服器變更：廣告放送端點
• AMP 中的廣告標籤

AMPHTML 廣告範本建立

廣告聯播網以 AMP 格式建立廣告範本，並將範本託管在自己的網域中，與標準 AMP 網頁類似。

例如，adnetwork.com 可以在下列網址託管範本：https://adnetwork.com/amp_template_1.html。對應的 AMP Proxy 網址為：https://adnetwork-com.cdn.ampproject.org/ad/s/adnetwork.com/amp_template_1.html。

廣告聯播網的網域名稱 (來源) 可做為命名空間，而網址路徑則做為其 ID。

Proxy 伺服器會在首次請求時快取範本。其快取政策與標準 AMP 網頁相同，皆為 stale-while-revalidate，意即每次快取命中後，都會在背景發出同步請求。

為了確保範本是有效的 AMPHTML，廣告聯播網必須向快取網址發出 HTTP 請求；如果範本無效，系統會傳回 4XX 錯誤。這也會預先載入快取，進而加快首次廣告載入速度。快取網址可依照上述規則，從標準 AMP 網址轉換而來 (詳情請參閱這裡的網址格式)。

如要更新範本，廣告聯播網只需更新網域中的網頁，然後再次發出快取預先載入請求即可。

廣告伺服器

廣告聯播網需要提供新的放送端點，以 JSON 格式傳回 CORS 回應

{
  templateUrl: "https://adexample.com/amp_template_1.html",
  data: {
    clickUrl: "https://buy.com/buy-1",
    buttonText: "Buy now"
  },
  analytics: {
    type: "googleanalytics",
    config: {
      ...
    }
  }
}

回應需要數個自訂標頭

• CORS 的自訂標頭
• AMP-Ad-Template-Extension: amp-mustache
• Amp-Ad-Response-Type: template

廣告標籤

`amp-ad-custom` 擴充功能可用於快速宣告廣告版位，方法是使用在資料屬性中設定的鍵值組來建立廣告請求。廣告版位範例如下：

<amp-ad-custom
  width="320"
  height="50"
  src="http://www.my-ad-network.com"
  data-request-param-{param_1}="{val_1}"
  data-request-param-{param_2}="{val_2}"
  .
  .
  .
  data-request-param-{param_N}="{val_N}"
>
</amp-ad-custom>

產生的廣告請求網址會是：http://www.my-ad-network.com?{param_1}={val_1}&{param_2}={val_2}&...&{param_N}={val_N}。