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

本文介绍如何使用ASP.NET的AdRotator控件显示广告并跟踪用户点击行为。通过逐步指导,读者可以学会创建广告列表、显示随机广告、记录点击次数及展示统计数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

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

本演练演示如何使用 AdRotator 控件显示广告,并提供一个简单方法来跟踪广告响应。本演练演示的任务包括:

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

  • 在页上显示广告。

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

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

创建广告创建广告

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

Note注意

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

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

创建 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,然后单击“添加新项”。

    Note注意

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

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

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

    Note注意

    使用 .ads 扩展名。

  4. 单击“添加”。

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

  5. 将下面的 XML 复制到该文件中,并改写 XML 指令。

    <?xml version="1.0" encoding="utf-8" ?>
    <Advertisements>
      <Ad>
        <ImageUrl>~/images/Contoso_ad.gif</ImageUrl>
        <NavigateUrl>http://www.contoso.com</NavigateUrl>
        <AlternateText>Ad for Contoso.com</AlternateText>
      </Ad>
      <Ad>
        <ImageUrl>~/images/ASPNET_ad.gif</ImageUrl>
        <NavigateUrl>http://www.asp.net</NavigateUrl>
        <AlternateText>Ad for ASP.NET Web site</AlternateText>
      </Ad>
    </Advertisements>
    Note注意

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

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

    Note注意

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

AdvertisementFile
  • 保存文件,然后将其关闭。

在页上显示广告

现在配置网页以显示已创建的广告。在下面的过程中,您会将 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 控件拖到页上。

    Note注意

    页的具体布局无关紧要。

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

现在将测试广告。

测试广告

  1. 按 Ctrl+F5 运行该页。

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

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

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

    Note注意

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

  3. 单击广告。

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

  4. 关闭浏览器。

复制代码
跟踪广告响应跟踪广告响应

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

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

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

将广告重定向到跟踪页

  1. 打开 Sample.ads 文件。

  2. 设置“NavigateUrl”以包含下面的内容:

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

    • 每个广告的标识符。

    • 广告最终指向的页。

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

    Note注意

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

    <?xml version="1.0" encoding="utf-8" ?>
    <Advertisements>
      <Ad>
        <ImageUrl>~/images/Contoso_ad.gif</ImageUrl>
        <NavigateUrl>AdRedirector.aspx?ad=Widgets&amp;target=http://www.contoso.com/widgets/</NavigateUrl>
        <AlternateText>Ad for Contoso.com</AlternateText>
      </Ad>
      <Ad>
        <ImageUrl>~/images/ASPNET_ad.gif</ImageUrl>
        <NavigateUrl>AdRedirector.aspx?ad=ASPNET&amp;target=http://www.asp.net</NavigateUrl>
        <AlternateText>Ad for ASP.NET Web site</AlternateText>
      </Ad>
    </Advertisements>
  3. 保存 Sample.ads 文件,然后将其关闭。

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

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

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

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

Note注意

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

  • 保存文件,然后将其关闭。

    Note注意

    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. 将下面的代码复制到该处理程序中(不改写主干处理程序声明)。

    Visual Basic
    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. 关闭浏览器。

后续步骤后续步骤
 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值