您现在的位置：程式碼之家 >> 編程語言 > >> .NET 網頁程式設計 >> ASP.NET 基礎 >> ASP.NET 基礎

ASP.NET AdRotator 廣告輪播控制項完整教學：XML 設定檔、AdCreated 事件與自訂屬性

編輯：ASP.NET 基礎

AdRotator 運作原理

讀取 XML 廣告檔（AdvertisementFile），依 Impressions 權重隨機挑選一則廣告。
渲染為 <a><img /></a>，點擊導向 NavigateUrl。
所有 XML 標籤自動放入 AdCreatedEventArgs.AdProperties 字典，可在 OnAdCreated 事件中擴充邏輯。

1. 廣告 XML 檔（`ads.xml`）

<?xml version="1.0" encoding="utf-8"?>
<Advertisements>
  <Ad>
    <ImageUrl>~/Images/ad1.gif</ImageUrl>
    <NavigateUrl>https://www.example.com/product/1</NavigateUrl>
    <AlternateText>春季優惠</AlternateText>
    <Keyword>spring</Keyword>
    <Impressions>40</Impressions>
    <CustomField>自訂擴充欄位</CustomField>
  </Ad>
  <Ad>
    <ImageUrl>~/Images/ad2.jpg</ImageUrl>
    <NavigateUrl>https://www.example.com/product/2</NavigateUrl>
    <AlternateText>新品上市</AlternateText>
    <Keyword>new</Keyword>
    <Impressions>60</Impressions>
    <CustomField>另一筆資料</CustomField>
  </Ad>
</Advertisements>

必要元素：ImageUrl、NavigateUrl、AlternateText、Impressions（權重，整數）。
選用：Keyword（篩選）、CustomField 等自訂標籤皆會進入 AdProperties。

2. 前端頁面（`AdRotatorDemo.aspx`）

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AdRotatorDemo.aspx.cs" Inherits="Demo.AdRotatorDemo" %>
<!DOCTYPE html>
<html>
<head><title>AdRotator 示範</title></head>
<body>
    <form id="form1" runat="server">
        <h2>廣告輪播區</h2>
        <asp:AdRotator ID="AdRotator1" runat="server" 
            AdvertisementFile="~/App_Data/ads.xml" 
            Target="_blank" 
            OnAdCreated="AdRotator1_AdCreated" />
        <br /><br />
        <strong>自訂欄位顯示：</strong>
        <asp:Label ID="lblCustom" runat="server" />
    </form>
</body>
</html>

3. 後端邏輯（`AdRotatorDemo.aspx.cs`）

using System;
using System.Web.UI.WebControls;

namespace Demo
{
    public partial class AdRotatorDemo : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e) { }

        protected void AdRotator1_AdCreated(object sender, AdCreatedEventArgs e)
        {
            // e.AdProperties 包含 XML 所有標籤鍵值對
            // 範例：讀取自訂欄位顯示於 Label
            if (e.AdProperties.ContainsKey("CustomField"))
                lblCustom.Text = "【廣告備註】" + e.AdProperties["CustomField"];
            else
                lblCustom.Text = "無備註";

            // 也可在此動態修改圖片/連結（罕見需求）
            // e.AdProperties["NavigateUrl"] = "https://new-target.com";
        }
    }
}

4. 關鍵屬性與事件速查

屬性/事件	說明
`AdvertisementFile`	XML 路徑，支援 `~/` 虛擬路徑
`Target`	連結開啟目標：`_blank`、`_self`、`_top`、框架名稱
`KeywordFilter`	只顯示符合此 Keyword 的廣告（如 "spring"）
`OnAdCreated`	廣告選定後、渲染前觸發，可讀寫 `AdProperties`
`AdProperties`	`Dictionary`，鍵為 XML 標籤名（區分大小寫）

5. 進階技巧

動態切換廣告檔（如依使用者角色）

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        string xml = User.IsInRole("VIP") ? "~/App_Data/ads_vip.xml" : "~/App_Data/ads_normal.xml";
        AdRotator1.AdvertisementFile = xml;
    }
}

搭配 UpdatePanel 定時輪播（無需整頁重整）

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="upAd" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:AdRotator ID="AdRotator1" ... />
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
    </Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="10000" OnTick="Timer1_Tick" /> <!-- 10 秒 -->

protected void Timer1_Tick(object sender, EventArgs e)
{
    upAd.Update(); // 觸發 AdRotator 重新選取廣告
}