Пошаговое руководство. Отображение и отслеживание рекламных объявлений с помощью элемента управления AdRotator

Статья
10/22/2014

Обновлен: Ноябрь 2007

На веб-узлах часто отображаются рекламные объявления или похожее динамическое содержимое, приглашающее пользователей посетить другой веб-узел. ASP.NET содержит элемент управления AdRotator, который упрощает эту задачу. Элемент управления AdRotator отображает графический объект, представляющий рекламное объявление, случайным образом выбирая объявление из созданного пользователем списка. После этого можно отслеживать, как часто пользователи просматривают и щелкают это рекламное объявление.

В данном пошаговом руководстве демонстрируется, как использовать элемент управления AdRotator для отображения рекламных объявлений, и описывается простой способ отслеживания откликов на объявления. В данном пошаговом руководстве представлены следующие задачи:

Создание списка отображаемых рекламных объявлений.
Отображение рекламных объявлений на странице.
Реализация способа отслеживания числа щелчков рекламного объявления.
Отображение статистических данных по щелчкам рекламного объявления.

Обязательные компоненты

Для выполнения инструкций данного пошагового руководства необходимы следующие компоненты.

Средство веб-разработки Microsoft Visual Web Developer.
Платформа .NET Framework.
Основные сведения о работе в Visual Web Developer. Общие сведения см. в разделе Пошаговое руководство. Создание базовой веб-страницы в Visual Web Developer.

Создание веб-узла

Если вы уже создали веб-узел в Visual Web Developer, выполнив Пошаговое руководство. Создание базовой веб-страницы в Visual Web Developer, то можно использовать этот веб-узел и перейти к следующему подразделу. В противном случае создайте новый веб-узел и страницу, выполнив следующие действия.

Создание веб-узла на базе файловой системы

Откройте Visual Web Developer.
В меню Файл выберите Создать, Веб-узел.

Откроется диалоговое окно Создать веб-узел.
В группе Установленные шаблоны Visual Studio выберите Веб-узел ASP.NET.
В поле Расположение щелкните Файловая система и введите имя папки, где следует хранить страницы веб-узла.

Например, введите имя папки C:\WebSite.
В списке Язык выберите язык программирования, с которым вы предпочитаете работать.

Выбранный язык программирования будет языком по умолчанию для веб-узла, но можно задать язык программирования для каждой страницы отдельно.
Нажмите кнопку OК.

Visual Studio создает папку и новую страницу с именем Default.aspx.

Создание рекламных объявлений

Рекламные объявления — это графические объекты, отображаемые на странице с целевым URL-адресом; когда пользователи щелкают этот объект, они перенаправляются на целевой веб-узел. Таким образом, в роли рекламных объявлений выступают файлы изображений.

Примечание.
В последующих подразделах данного пошагового руководства предполагается, что используются файлы изображений, названные в соответствии с приведенной ниже процедурой. Если используются существующие файлы изображений, не забудьте подставить правильные имена файлов при прохождении последующих подразделов.

В последующих подразделах данного пошагового руководства предполагается, что используются файлы изображений, названные в соответствии с приведенной ниже процедурой. Если используются существующие файлы изображений, не забудьте подставить правильные имена файлов при прохождении последующих подразделов.

Начните с создания на веб-узле папки для хранения файлов изображений.

Создание папки изображений «Images»

В обозревателе решений щелкните правой кнопкой мыши имя веб-узла, выберите команду Создать папку, а затем назовите папку Images.
Если у вас уже есть файлы изображений для использования в качестве рекламных объявлений, скопируйте их в новую папку. В противном случае выполните следующую процедуру для создания изображений.

Если уже имеются изображения, подходящие на роль рекламных объявлений, можно использовать их. В противном случае выполните следующую процедуру, описывающую один из способов создания изображений, которые можно будет использовать в данном пошаговом руководстве.

Создание графических объектов для использования в качестве рекламных объявлений

В операционной системе Microsoft Windows откройте приложение «Paint».
В меню Рисунок выберите пункт Атрибуты.
В диалоговом окне Атрибуты задайте для параметра Ширина значение 250 и для параметра Высота значение 50, а затем нажмите кнопку ОК.
Перетащите инструмент текста из панели элементов на изображение, затем введите какой-либо текст, определяющий рекламное объявление.
Сохраните изображение в папке «<имя_веб-узла>\Images» как <имя_веб-узла>\Images\Contoso_ad.gif.
Создайте второй рисунок и сохраните его как «<имя_веб-узла>\Images\ASPNET_ad.gif».
Закройте приложение «Paint».

Создание списка рекламных объявлений

Как только изображения для рекламных объявлений будут готовы, необходимо создать список объявлений, который сможет прочитать элемент управления AdRotator. Список должен иметь формат XML-файла.

Создание XML-файла с рекламными объявлениями

В обозревателе решений щелкните правой кнопкой мыши папку «App_Data» и выберите команду Добавитьновый элемент.

Примечание.
Когда XML-файл помещен в папку «App_Data», ему автоматически назначаются необходимые права для разрешения чтения файла системой ASP.NET во время выполнения. Помещение XML-файла в папку «App_Data» позволяет защитить его от просмотра в обозревателе, так как папка «App_Data» помечена как недоступная для просмотра.

Когда XML-файл помещен в папку «App_Data», ему автоматически назначаются необходимые права для разрешения чтения файла системой ASP.NET во время выполнения. Помещение XML-файла в папку «App_Data» позволяет защитить его от просмотра в обозревателе, так как папка «App_Data» помечена как недоступная для просмотра.

В области Установленные шаблоны Visual Studio выберите XML-файл.
В поле Имя введите Sample.ads.

Примечание.

Используйте расширение ADS.
Нажмите кнопку Добавить.

Создан новый XML-файл, содержащий директиву XML.

Примечание.
Используйте расширение ADS.

Скопируйте в файл следующий текст 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>

Примечание.
Если файлы изображений имеют другие имена, измените имена в элементах <ImageUrl> на правильные.

Этот XML-файл содержит элементы <Ad> для двух рекламных объявлений, соответствующие двум созданным файлам изображений. В реальной ситуации эти URL-адреса в элементах <href> должны ссылаться на веб-узлы рекламодателей.

Примечание.
При определении рекламных объявлений доступны дополнительные элементы. Подробные сведения см. в разделе AdvertisementFile.

Сохраните файл и закройте его.

Отображение рекламных объявлений на странице

Теперь необходимо настроить веб-страницу для отображения созданных рекламных объявлений. В следующей процедуре выполняется привязка элемента управления AdRotator к элементу управления XmlDataSource. Однако при использовании статического XML-файла элемент управления источником данных не требуется, поскольку XML-файл можно задать непосредственно с помощью свойства AdvertisementFile элемента управления AdRotator.

Отображение рекламных объявлений на странице

Если для прохождения данного пошагового руководства был создан новый веб-узел, откройте страницу Default.aspx.
Если используется веб-узел, который был создан до начала прохождения данного пошагового руководства, добавьте новую страницу, выполнив следующие действия:
1. В обозревателе решений щелкните правой кнопкой мыши имя веб-узла (например «C:\WebSites») и пункт выберите Добавить новый элемент.
2. В области Установленные шаблоны Visual Studio выберите Форма Web Forms.
3. В поле Имя введите TestAds.aspx.
4. Нажмите кнопку Добавить.
Откройте файл TestAds.aspx и переключитесь в режим конструирования.
Из группы Стандартные панели элементов перетащите на страницу элемент управления AdRotator.

Отображается контекстное меню Задачи AdRotator.
В списке Выбор источника данных выберите Создать источник данных.

Появится мастер настройки источника данных.
В области Источник данных для приложения выберите XML-файл.
В поле Укажите идентификатор для источника данных оставьте значение по умолчанию (XmlDataSource1).
Нажмите кнопку OК.

Открывается диалоговое окно Настроить источник данных.
В поле Файл данных введите ~/App_Data/Sample.ads и нажмите кнопку ОК.

Для поиска файлов можно также использовать кнопку Обзор:
1. В диалоговом окне Выбор файла XML в списке Тип файлов выберите Все файлы (*.*).
2. В области Папки проекта щелкните App_Data.
3. В области Содержимое папки щелкните Sample.ads, нажмите кнопку ОК, а затем снова нажмите кнопку ОК.
Из группы Стандартные в панели элементов перетащите на страницу элемент управления Button.

Примечание.

Точный макет страницы не имеет значения.

Элемент управления Button находится на странице только для того, чтобы было удобно выполнить обратную передачу страницы на сервер.

Примечание.
Точный макет страницы не имеет значения.

Теперь можно проверить рекламные объявления.

Проверка рекламных объявлений

Чтобы запустить страницу, нажмите сочетание клавиш CTRL + F5.

На странице отображается одно из двух рекламных объявлений.

Несколько раз щелкните элемент Кнопка, чтобы вызвать обратную передачу страницы.

Отображаемое рекламное объявление изменяется случайным образом.

Примечание.
Поскольку доступно всего два рекламных объявления, то для того, чтобы увидеть другое объявление, может потребоваться щелкнуть элемент Кнопка несколько раз.

Щелкните рекламное объявление.

Выполняется перенаправление на целевую страницу данного рекламного объявления.
Закройте обозреватель.

Отслеживание откликов на рекламные объявления

На данном этапе страница просто отображает рекламное объявление, которое пользователи могут щелкнуть для перехода на другую страницу. В этом подразделе пошагового руководства добавляются функции отслеживания количества щелчков рекламных объявлений. Сначала изменяется URL-адрес рекламных объявлений в файле Sample.ads для отправки отклика на объявление на страницу переадресации со сведениями в строке запроса, идентифицирующими объявление и конечное назначение.

Затем создается второй XML-файл для хранения сведений счетчика рекламных объявлений. На рабочем веб-узле не следует использовать XML-файл для отслеживания щелчков рекламных объявлений, так как XML-файл не предназначен для передачи больших объемов трафика. Однако в рамках данного пошагового руководства использование XML-файла удобно, так как не требуется настраивать доступ к базе данных. Кроме того, в рабочем приложении может потребоваться более сложная функция отслеживания щелчков, например, с отслеживанием уникальных посетителей, сведениями о дате и времени выполнения щелчков и т. д. Однако общая стратегия использования страницы переадресации для обработки данных о щелчках остается одинаковой независимо от способа реализации этого отслеживания.

И наконец, создается страница переадресации, на которой накапливаются щелчки для различных рекламных объявлений, после чего выполняется перенаправление на целевую страницу, на которой должно отображаться объявление.

Переадресация рекламных объявлений на страницу отслеживания

Откройте файл Sample.ads.

Убедитесь, что href содержит следующие данные:

Имя страницы переадресации (AdRedirector.aspx).
Идентификатор каждого рекламного объявления.
Страница, на которую в конечном счете ссылается рекламное объявление.

В следующем коде XML-файл Sample.ads содержит обновленные URL-адреса, указывающие на страницу AdRedirector.aspx. Идентификатор рекламного объявления и целевая страница задаются в виде строки запроса.

Примечание.
Амперсанд (&) является зарезервированным знаком в XML, поэтому вместо него строка запроса содержит ссылку на сущность & .

<?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>

Сохраните файл Sample.ads и закройте его.

Дале необходимо создать XML-файл для сохранения информации счетчика щелчков рекламных объявлений. На рабочем веб-узле эту операцию выполнять не нужно, так как запись данных будет выполняться в базу данных. Использование XML-файла в данном пошаговом руководстве упрощает реализацию отслеживания откликов на рекламные объявления.

Создание XML-файла для отслеживания откликов на рекламные объявления

В обозревателе решений щелкните правой кнопкой мыши папку App_Data и выберите команду Добавитьновый элемент.
В области Шаблоны щелкните XML-файл.
В поле Имя введите AdResponses.xml и нажмите кнопку Добавить.

Создан новый XML-файл, содержащий директиву XML.

Скопируйте в файл следующий текст XML, перезаписав директиву XML.

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

Файл содержит элементы, состоящие из двух записей — идентификатора рекламного объявления и счетчика.

Примечание.
Если во время предыдущей процедуры, когда создавались строки запроса, объявлениям в файле Sample.ads были назначены другие идентификаторы, убедитесь, что в файле AdResponses.xml используются такие же идентификаторы.

Сохраните файл и закройте его.

Примечание.
Наличие у ASP.NET разрешения на запись в XML-файл зависит от используемого веб-сервера. В данном пошаговом руководстве используется сервер ASP.NET, входящий в состав Visual Web Developer и имеющий права на запись в XML-файл. При использовании служб IIS рабочий процесс веб-сервера IIS Web может не иметь прав на запись в данный XML-файл, в этом случае необходимо явно предоставить такие права. Дополнительные сведения о веб-серверах в Visual Web Developer см. в разделе Веб-серверы в Visual Web Developer.

Наличие у ASP.NET разрешения на запись в XML-файл зависит от используемого веб-сервера. В данном пошаговом руководстве используется сервер ASP.NET, входящий в состав Visual Web Developer и имеющий права на запись в XML-файл. При использовании служб IIS рабочий процесс веб-сервера IIS Web может не иметь прав на запись в данный XML-файл, в этом случае необходимо явно предоставить такие права. Дополнительные сведения о веб-серверах в Visual Web Developer см. в разделе Веб-серверы в Visual Web Developer.

Теперь необходимо создать страницу переадресации, которая собирает информацию о рекламном объявлении, которое щелкнул пользователь, обновляет счетчик для этого объявления, а затем отправляет запрос на страницу, с которой связано объявление.

Создание обработчика Page_Load

В обозревателе решений щелкните правой кнопкой мыши имя веб-узла (например «C:\WebSites») и пункт выберите Добавить новый элемент.
В области Установленные шаблоны Visual Studio выберите Форма Web Forms.
В поле Имя введите AdRedirector.aspx и нажмите кнопку Добавить.

при этом создается страница, на которую направляются все рекламные объявления, когда пользователи щелкают их. Эта страница не отображаться пользователям. Поэтому элементы управления на нее не помещаются.
В представлении конструирования дважды щелкните эту страницу, чтобы создать обработчик Page_Load.

Скопируйте в обработчик следующий код (не перезаписывайте общую схему объявления обработчика).

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);
}

Этот код считывает из строки запроса идентификатор рекламного объявления и URL-адрес. Затем он использует методы XML для считывания данных из файла AdResponse.xml в объект XmlDocument. Этот код находит необходимые элементы XML с помощью выражения XPath, извлекает значение hitCounter, а затем обновляет значение hitCounter. Затем код создает копию элемента XML с помощью клонирования, заменяет старый элемент на новый, а затем записывает обновленный документ XML обратно на диск. В конце код выполняет перенаправление на URL-адрес для рекламного объявления.

Теперь можно проверить работу счетчиков объявлений.

Проверка отслеживания откликов на рекламные объявления

Откройте страницу с элементом управления AdRotator и нажмите сочетание клавиш CTRL+F5.
Щелкните рекламное объявление.

Выполняется перенаправление на целевую страницу данного рекламного объявления.
В обозревателе нажмите кнопку Назад, чтобы вернуться на страницу объявления.
Щелкните рекламное объявление еще раз или щелкните элемент Кнопка для отображения другого рекламного объявления, а затем щелкните это рекламное объявление.
Продолжайте до тех пор, пока не щелкните каждое из рекламных объявлений хотя бы один раз, и одно или несколько объявлений — более одного раза.
Закройте обозреватель.
В Visual Web Developer откройте файл AdResponse.xml и убедитесь, что счетчики для рекламных объявлений показывают число выполненных во время проверки щелчков.
Закройте файл AdResponse.xml.

Отображение данных счетчика рекламных объявлений

В завершение данного пошагового руководства создается страница, на которой отображаются сведения о счетчиках объявлений, что значительно удобнее проверки XML-файла вручную.

Создание страницы для отображения данных об откликах на рекламные объявления

В обозревателе решений щелкните правой кнопкой имя веб-узла, а затем выберите Добавитьновый элемент.
В области Установленные шаблоны Visual Studio выберите Форма Web Forms.
В поле Имя введите ViewAdData.aspx.
Нажмите кнопку Добавить.
Перейдите в режим конструирования.
Из группы Данные в панели элементов перетащите на страницу элемент управления XmlDataSource.
В контекстном меню ЗадачиXmlDataSource выберите команду Настроить источник данных.

Отображается диалоговое окно Настроить источник данных <имя_источника_данных>.
В поле Файл данных введите ~/App_Data/AdResponses.xml.

Для поиска файлов можно также использовать кнопку Обзор.
Нажмите кнопку OК.
Из группы Данные панели элементов перетащите на страницу элемент управления GridView.
В контекстном меню Задачи GridView выберите в списке Выбор источника данных команду XmlDataSource1.
Чтобы запустить страницу, нажмите сочетание клавиш CTRL + F5.

На странице отображается таблица с данными откликов на рекламные объявления.
Закройте обозреватель.

Следующие действия

В элементе управления AdRotator доступно больше функций, чем описано в данном пошаговом руководстве. Вы можете изучить их следующими способами:

Используйте дополнительные атрибуты при создании рекламных объявлений в XML-файле.

Например, с помощью элемента Impressions можно регулировать частоту выбора данного объявления по сравнению с другими объявлениями в файле объявлений. Чем выше значение, тем выше вероятность выбора этого объявления. Подробные сведения см. в разделе AdvertisementFile.

Используйте для отслеживания откликов на объявления базу данных.

Примечание.
В рабочем приложении не следует использовать XML-файл для отслеживания откликов на рекламные объявления, так как он не обеспечивает поддержку большого числа пользователей. Использование XML-файла в данном пошаговом руководстве упрощает реализацию отслеживания откликов на рекламные объявления и позволяет не настраивать базу данных.

В рабочем приложении не следует использовать XML-файл для отслеживания откликов на рекламные объявления, так как он не обеспечивает поддержку большого числа пользователей. Использование XML-файла в данном пошаговом руководстве упрощает реализацию отслеживания откликов на рекламные объявления и позволяет не настраивать базу данных.

Отслеживайте дополнительные сведения о щелчках рекламных объявлений.

Может потребоваться отслеживать уникальных посетителей, например с помощью записи файла cookie в обозреватель, чтобы определить, щелкнул ли пользователь объявление в течение дня, или с помощью отслеживания IP-адреса обозревателя при сохранении сведений о щелчках. Можно также регистрировать статистику сведений о щелчках по дате и времени, а также отслеживать сведения об объявлениях по другому динамическому содержимому на исходной странице, с помощью которого можно анализировать шаблоны трафика.
Выполните привязку элемента управления AdRotator к его данным с помощью другого элемента управления источником данных.

Например, можно сохранить данные рекламных объявлений в базе данных. В этом случае можно добавить на страницу элемент управления источником данных и настроить его на использование запроса для получения данных рекламных объявлений. После этого можно связать элемент управления AdRotator с элементом управления источником данных. Подробные сведения см. в разделе Практическое руководство. Отображение рекламных объявлений из базы данных с помощью серверного веб-элемента управления AdRotator.

См. также

Ссылки

Общие сведения о серверном веб-элементе управления AdRotator

Поделиться через

Пошаговое руководство. Отображение и отслеживание рекламных объявлений с помощью элемента управления AdRotator

Обязательные компоненты

Создание веб-узла

Создание веб-узла на базе файловой системы

Создание рекламных объявлений

Создание папки изображений «Images»

Создание графических объектов для использования в качестве рекламных объявлений

Создание списка рекламных объявлений

Создание XML-файла с рекламными объявлениями

Отображение рекламных объявлений на странице

Отображение рекламных объявлений на странице

Проверка рекламных объявлений

Отслеживание откликов на рекламные объявления

Переадресация рекламных объявлений на страницу отслеживания

Создание XML-файла для отслеживания откликов на рекламные объявления

Создание обработчика Page_Load

Проверка отслеживания откликов на рекламные объявления

Отображение данных счетчика рекламных объявлений

Создание страницы для отображения данных об откликах на рекламные объявления

Следующие действия

См. также

Ссылки

Дополнительные ресурсы