通过

演练：使用 AdRotator 控件显示和跟踪广告

  • 项目

更新：2007 年 11 月

网站经常显示广告或邀请用户访问其他站点的类似动态内容。ASP.NET 提供的 AdRotator 控件可简化此任务。AdRotator 控件显示表示广告的图形，而广告是从您创建的列表中随机选择的。然后，可以跟踪某个广告的查看频率以及用户单击该广告频率。

本演练演示如何使用 AdRotator 控件显示广告，并提供一个简单方法来跟踪广告响应。本演练涉及以下任务：

  • 创建要显示的广告的列表。

  • 在页上显示广告。

  • 创建跟踪广告单击次数的方法。

  • 显示广告的单击统计信息。

先决条件

为了完成本演练，您需要：

创建网站

如果您已经通过完成 演练：在 Visual Web Developer 中创建基本网页 在 Visual Web Developer 中创建了网站，则可以使用该网站，并转至下一部分。否则，按照下面的步骤创建一个新的网站和网页。

创建文件系统网站

  1. 打开 Visual Web Developer。

  2. 在**“文件”菜单上单击“新建网站”**。

    出现**“新建网站”**对话框。

  3. 在**“Visual Studio 已安装的模板”之下单击“ASP.NET 网站”**。

  4. 在**“位置”框中单击“文件系统”**，然后输入要保存网站页面的文件夹的名称。

    例如，键入文件夹名“C:\WebSite”。

  5. 在**“语言”**列表中，单击您想使用的编程语言。

    您选择的编程语言将是网站的默认语言，但您可以为每个页分别设置编程语言。

  6. 单击**“确定”**。

    Visual Studio 创建该文件夹和一个名为 Default.aspx 的新页。

创建广告

广告是在页上显示的具有目标 URL 的图形；用户单击该图形时，他们会重定向到目标站点。因此，需要图形文件用作广告。

azwad69k.alert_note(zh-cn,VS.90).gif说明：

本演练的后面各节假定您要使用的图形是根据下面的过程命名的。如果使用现有图形，请确保在本演练后面部分中替换相应的文件名称。

从在网站中创建文件夹来存储图形开始。

创建 Images 文件夹

  1. 在解决方案资源管理器中，右击网站的名称，单击**“新建文件夹”**，然后将该文件夹命名为“Images”。

  2. 如果有现有图形可用作广告，则将这些图形复制到该新文件夹。否则，按照下一过程创建一些图像。

如果已有一些图形可用来表示广告，则可以使用这些图形。否则，下面的过程提供了一种方式，可创建适合于本演练的图形。

创建要用作广告的图形

  1. 在 Microsoft Windows 中，打开“画图”。

  2. 在**“图像”菜单上单击“属性”**。

  3. 在**“属性”对话框中，将“宽度”设置为“250”，将“高度”设置为“50”，然后单击“确定”**。

  4. 将文本工具从工具箱拖动到该图形上，然后键入一些可帮助标识该广告的文本

  5. 在文件夹 <Websitename>\Images 中，将该图形保存为 <Websitename>\Images\Contoso_ad.gif。

  6. 创建另一个图形，然后将其保存为 <Websitename>\Images\ASPNET_ad.gif。

  7. 关闭“画图”。

创建广告列表

有了广告图形之后，必须立即创建 AdRotator 控件能够读取的广告列表。列表的形式为 XML 文件。

创建广告的 XML 文件

  1. 在解决方案资源管理器中，右击 App_Data，然后单击**“添加新项”**。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    将 XML 文件放入 App_Data 文件夹时，XML 文件就自动具有了允许 ASP.NET 在运行时对其进行读取的相应权限。将 XML 文件放入 App_Data 文件夹有助于防止该文件在浏览器中被查看，因为 App_Data 文件夹被标记为不可浏览。

  2. 在**“Visual Studio 已安装的模板”之下单击“XML 文件”**。

  3. 在**“名称”**框中键入“Sample.ads”。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    使用 .ads 扩展名。

  4. 单击**“添加”**。

    创建一个仅包含 XML 指令的新 XML 文件。

  5. 将下面的 XML 复制到该文件中，并覆盖 XML 指令。

    <?xml version="1.0" encoding="utf-8" ?>
<Advertisements>
  <Ad>
    <ImageUrl>~/images/Contoso_ad.gif</ImageUrl>
    <href>https://www.contoso.com</href>
    <AlternateText>Ad for Contoso.com</AlternateText>
  </Ad>
  <Ad>
    <ImageUrl>~/images/ASPNET_ad.gif</ImageUrl>
    <href>https://www.asp.net</href>
    <AlternateText>Ad for ASP.NET Web site</AlternateText>
  </Ad>
</Advertisements>
    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    如果图形文件具有不同的文件名，则相应地更改 <ImageUrl> 元素中的名称。

    此 XML 文件包含两个广告的 <Ad> 元素，这两个广告对应于创建的两个图形文件。在实际应用程序中，<href> 元素中的 URL 引用的是广告的网站。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    定义广告还可使用其他元素。有关详细信息，请参见 AdvertisementFile。

  6. 保存文件，然后将其关闭。

在页上显示广告

现在配置网页以显示已创建的广告。在下面的过程中，您会将 AdRotator 控件绑定到 XmlDataSource 控件。但是，当使用静态 XML 文件时，则不需要数据源控件，原因是可以用 AdRotator 控件的 AdvertisementFile 属性直接设置 XML 文件。

在页上显示广告

  1. 如果已为本演练创建了新网站，则打开 Default.aspx 页。

  2. 如果要使用在开始本演练前就已存在的网站，则按照下面的步骤添加一个新页：

    1. 在解决方案资源管理器中，右击网站的名称（如 C:\WebSites），再单击**“添加新项”**。

    2. 在**“Visual Studio 已安装的模板”下单击“Web 窗体”**。

    3. 在**“名称”**框中键入“TestAds.aspx”。

    4. 单击**“添加”**。

  3. 打开 TestAds.aspx 然后切换到“设计”视图。

  4. 从工具箱的**“标准”**组中，将一个 AdRotator 控件拖到该页上。

    出现**“AdRotator 任务”**快捷菜单。

  5. 在**“选择数据源”列表中，单击“新建数据源”**。

    出现“数据源配置”向导。

  6. 在**“应用程序从哪里获取数据”下，单击“XML 文件”**。

  7. 在**“为数据源指定 ID”框中，保留默认值“(XmlDataSource1)”**。

  8. 单击**“确定”**。

    出现**“配置数据源”**对话框。

  9. 在**“数据文件”框中，输入 ~/App_Data/Sample.ads，然后单击“确定”**。

    或者，还可以使用**“浏览”**查找文件：

    1. 在**“选择 XML 文件”对话框的“文件类型”列表中，单击“所有文件 (*.*)”**。

    2. 在**“项目文件夹”下，单击“App_Data”**。

    3. 在**“文件夹内容”下，单击“Sample.ads”，单击“确定”，然后单击“确定”**。

  10. 从工具箱的**“标准”**组中，将一个 Button 控件拖到页上。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    页的具体布局无关紧要。

    Button 控件仅在页上，以使您可以方便地将该页回发到服务器。

现在将测试广告。

测试广告

  1. 按 Ctrl+F5 运行该页。

    两个广告中的一个出现在页上。

  2. 单击几次**“按钮”**可使页回发。

    出现的广告是随机变化的。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    因为只有两个广告，因此可能必须单击数次“按钮”才能看到另一个广告。

  3. 单击广告。

    您会重定向到该广告的目标页。

  4. 关闭浏览器。

跟踪广告响应

此时，页只显示用户可以单击跳转到另一页的广告。在演练的这一部分中，将添加功能来跟踪用户单击广告的次数。您将更改 Sample.ads 文件中的广告的 URL，以便将广告响应（以及标识广告和最终目标的查询字符串中的信息）发送到重定向页。

然后，创建另一个 XML 文件来存储广告计数器信息。在成品网站中，不应使用 XML 文件来跟踪广告单击数，因为 XML 文件不支持大流量。但是，为了实现本演练的目的，方便起见将使用 XML 文件，这样就不必配置数据库访问。另外，在成品应用程序中，可能需要更为复杂的单击跟踪，如确保跟踪特定访问者、跟踪单击的时间和日期信息等。尽管如此，无论选择什么数据跟踪方式，使用重定向页处理单击的总体策略都是一样的。

最后，将创建重定向页，您将在该页中累计不同广告的计数器，然后再次重定向到要显示的广告的目标页。

将广告重定向到跟踪页

  1. 打开 Sample.ads 文件。

  2. 设置**“href”**以包含下面的内容：

    • 重定向页的名称 (AdRedirector.aspx)。

    • 每个广告的标识符。

    • 广告最终指向的页。

    下面的代码清单演示用指定 AdRedirector.aspx 页的 URL 更新的 Sample.ads XML 文件。广告标识符和目标页被指定为查询字符串。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    由于“and”符 (&) 在 XML 中是一个保留字符，因而查询字符串包含的将是实体引用 &amp; 。

    		 
    <?xml version="1.0" encoding="utf-8" ?>
<Advertisements>
  <Ad>
    <ImageUrl>~/images/Contoso_ad.gif</ImageUrl>
    <href>AdRedirector.aspx?ad=Widgets&amp;target=https://www.contoso.com/widgets/</href>
    <AlternateText>Ad for Contoso.com</AlternateText>
  </Ad>
  <Ad>
    <ImageUrl>~/images/ASPNET_ad.gif</ImageUrl>
    <href>AdRedirector.aspx?ad=ASPNET&amp;target=https://www.asp.net</href>
    <AlternateText>Ad for ASP.NET Web site</AlternateText>
  </Ad>
</Advertisements>

  3. 保存 Sample.ads 文件，然后将其关闭。

下一步，创建 XML 文件，该文件存储广告单击的计数器信息。在成品网站中不需要此步骤，因为信息会写入数据库。本演练中使用 XML 文件简化了跟踪广告响应所需的步骤。

创建用于跟踪广告响应的 XML 文件

  1. 在解决方案资源管理器中，右击“App_Data”文件夹，然后单击**“添加新项”**。

  2. 在**“模板”之下单击“XML 文件”**。

  3. 在**“名称”框中，键入“AdResponses.xml”，然后单击“添加”**。

    创建一个仅包含 XML 指令的新 XML 文件。

  4. 将下面的 XML 复制到该文件中，并覆盖 XML 指令。

    <?xml version="1.0" standalone="yes"?>
<adResponses>
  <ad adname="Widgets" hitCount="0" />
  <ad adname="ASPNET" hitCount="0" />
</adResponses>

    该文件包含的元素具有两条信息（广告的 ID 和计数器）。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    如果在前一过程中创建查询字符串时在 Sample.ads 文件中将不同的 ID 指定给了广告，请确保 AdResponses.xml 文件中的 ID 与这些 ID 匹配。

  5. 保存文件，然后将其关闭。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    ASP.NET 是否具有 XML 文件的写入权限取决于您所使用的 Web 服务器。在本演练中，您将使用 ASP.NET Development Server（包括在 Visual Web Developer 中，并对 XML 文件具有写访问权）。如果您使用 Microsoft Internet 信息服务 (IIS)，由于 IIS Web 服务器辅助进程可能对 XML 文件没有写访问权，因此您必须显式设置该写入权限。有关 Visual Web Developer 中 Web 服务器的更多信息，请参见 Visual Web Developer 中的 Web 服务器。

现在，将创建重定向页，该页可捕捉有关被单击的广告的信息，更新该广告的计数器，然后将请求发送到该广告的关联页。

创建 Page_Load 处理程序

  1. 在解决方案资源管理器中，右击网站的名称（如 C:\WebSites），再单击**“添加新项”**。

  2. 在**“Visual Studio 已安装的模板”下单击“Web 窗体”**。

  3. 在**“名称”框中，键入“AdRedirector.aspx”，然后单击“添加”**。

    这样即可创建一个页，用户单击任何广告时都会定向到该页。该页不会向用户显示。因此，您不能在该页上放置任何控件。

  4. 在“设计”视图中，双击该页以创建 Page_Load 处理程序。

  5. 将下面的代码复制到该处理程序中（不覆盖主干处理程序声明）。

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    Dim adName As String = Request.QueryString("ad")
    Dim redirect As String = Request.QueryString("target")
    If (adName Is Nothing Or redirect Is Nothing) Then
        redirect = "TestAds.aspx"
    End If

    Dim doc As System.Xml.XmlDocument
    Dim docPath As String = "~/App_Data/AdResponses.xml"

    doc = New System.Xml.XmlDocument()
    doc.Load(Server.MapPath(docPath))
    Dim root As System.Xml.XmlNode = doc.DocumentElement
    Dim xpathExpr As String
    xpathExpr = "descendant::ad[@adname='" & adName & "']"
    Dim adNode As System.Xml.XmlNode = _
        root.SelectSingleNode(xpathExpr)
    If adNode IsNot Nothing Then
        Dim ctr As Integer = _
            CInt(adNode.Attributes("hitCount").Value)
        ctr += 1
        Dim newAdNode As System.Xml.XmlNode = _
            adNode.CloneNode(False)
        newAdNode.Attributes("hitCount").Value = ctr.ToString()
        root.ReplaceChild(newAdNode, adNode)
        doc.Save(Server.MapPath(docPath))
    End If
    Response.Redirect(redirect)

End Sub

    protected void Page_Load(object sender, EventArgs e)
{
    String adName = Request.QueryString["ad"];
    String redirect = Request.QueryString["target"];
    if (adName == null | redirect == null)
        redirect = "TestAds.aspx";

    System.Xml.XmlDocument doc = new System.Xml.XmlDocument();
    String docPath = @"~/App_Data/AdResponses.xml";
    doc.Load(Server.MapPath(docPath));
    System.Xml.XmlNode root = doc.DocumentElement;
    System.Xml.XmlNode adNode =
        root.SelectSingleNode(
        @"descendant::ad[@adname='" + adName + "']");
    if (adNode != null)
    {
        int ctr =
            int.Parse(adNode.Attributes["hitCount"].Value);
        ctr += 1;
        System.Xml.XmlNode newAdNode = adNode.CloneNode(false);
        newAdNode.Attributes["hitCount"].Value = ctr.ToString();
        root.ReplaceChild(newAdNode, adNode);
        doc.Save(Server.MapPath(docPath));
    }
    Response.Redirect(redirect);
}

    这段代码从查询字符串中读取广告 ID 和 URL。然后，使用 XML 方法将 AdResponse.xml 文件读入到 XmlDocument 对象中。这段代码使用 XPath 表达式查找适当的 XML 元素，提取 hitCounter 值，然后更新 hitCounter 值。接下来，这段代码通过克隆创建 XML 元素的副本，用新的元素替换旧的元素，然后将更新后的 XML 文档写回磁盘。最后，这段代码重定向到广告的 URL。

现在将进行测试，以确认广告的广告计数器可正常工作。

测试广告响应跟踪

  1. 打开包含 AdRotator 控件的页，然后按 Ctrl+F5。

  2. 单击广告。

    您会重定向到该广告的目标页。

  3. 在浏览器中，单击**“后退”**返回到广告页。

  4. 再次单击广告或单击**“按钮”**以显示另一个广告，然后单击该广告。

  5. 继续这样操作，直到每个广告都至少被单击一次，且一个或多个广告被单击了多次。

  6. 关闭浏览器。

  7. 在 Visual Web Developer 中，打开 AdResponse.xml 文件，验证广告的计数器是否反映了测试中单击的次数。

  8. 关闭 AdResponse.xml 文件。

显示广告计数器数据

在本演练的最后部分，您将创建显示广告计数器信息的页，这比手动检查 XML 文件更加方便。

创建显示广告响应数据的页

  1. 在解决方案资源管理器中，右击网站的名称，然后单击**“添加新项”**。

  2. 在**“Visual Studio 已安装的模板”下单击“Web 窗体”**。

  3. 在**“名称”**框中，键入“ViewAdData.aspx”。

  4. 单击**“添加”**。

  5. 切换到“设计”视图。

  6. 从工具箱的**“数据”**组中，将 XmlDataSource 控件拖到该页上。

  7. 在**“XmlDataSource 任务”快捷菜单中，单击“配置数据源”**。

    出现**“配置数据源 <Datasourcename>”**对话框。

  8. 在**“数据文件”**框中，键入 ~/App_Data/AdResponses.xml。

    或者，还可以使用**“浏览”**查找该文件。

  9. 单击**“确定”**。

  10. 从工具箱的**“数据”**组中，将 GridView 控件拖动到页面上。

  11. 在**“GridView 任务”快捷菜单的“选择数据源”列表中，单击“XmlDataSource1”**。

  12. 按 Ctrl+F5 运行该页。

    该页在网格中显示广告响应数据。

  13. 关闭浏览器。

后续步骤

本演练只介绍了 AdRotator 控件的一部分功能。通过以下方式可了解该控件的其他功能：

  • 在 XML 文件中创建广告时使用更多属性。

    例如，可以使用 Impressions 元素来控制某个广告相对于广告文件中其他广告的选中频率。值越大，选中该广告的可能性越大。有关详细信息，请参见 AdvertisementFile。

  • 使用数据库跟踪广告响应。

    azwad69k.alert_note(zh-cn,VS.90).gif说明：

    在成品应用程序中，不要使用 XML 文件跟踪广告响应，因为 XML 文件不会无法支持很多用户。本演练将 XML 文件用于广告响应仅是为了简化演练，这样不必配置数据库。

  • 跟踪广告单击的更多信息。

    通过向浏览器写入 Cookie（如果用户当天单击过该广告），或在存储单击信息时跟踪浏览器的 IP 地址，可以确保跟踪特定访问者。可以根据日期和时间收集单击信息，也可以根据源页上的其他动态内容跟踪广告信息，这有助于对流量模式进行分析。

  • 使用另一个数据源控件将 AdRotator 控件绑定到其数据。

    例如，可以将广告数据存储在数据库中。如果这样做，则可以将数据源控件添加到页，也可以配置该控件以使用查询获取广告数据。然后，可以将 AdRotator 控件绑定到数据源控件。有关详细信息，请参见如何：使用 AdRotator Web 服务器控件显示数据库中的广告。

请参见

参考

AdRotator Web 服务器控件概述