Портал для веб-мастера
Вход пользователей
Поиск статей
WoWeb.ru » Статьи » Программирование для Web » ASP

WAP и ASP - Часть III

В этой статье мы рассмотрим практическое приложение, созданное с использованием WML и ASP. Мы разработаем "корзину" для магазина некой компании по продаже бумаги для печатающих устройств. Предложенное приложение покажет продавцу компании состояние склада, используя его WAP-телефон, и в то же время позволит ему разместить заказ для клиента. Это приложение иллюстрирует некоторые концепции в WML и то, как WML и ASP могут использоваться вместе для создания динамических WAP-приложений.

Проектирование БД

Компания поддерживает базу данных Stock.mdb, содержащую следующие таблицы: Inventory (Опись), Orders (Заказы) и Staff (Персонал). Отношения для таблиц следующие:

Таблица Inventory содержит идентификатор (SKU) изделия и его запас, а также себестоимость и продажную цену. Таблица Orders используется, чтобы фиксировать заказы, сделанные продавцом компании. Таблица Staff содержит информацию входа в систему продавца.

Запуск приложения

Чтобы проверить примеры приложения, описываемые в этой статье, вы можете использовать UP.SDK 4.0 Beta 1 WAP Phone Emulator. UP.SDK доступен для загрузки на сайте Phone.com. Чтобы протестировать приложение, используйте UP.SIMULATOR.

WAP Телефоны, поддерживающие UP.BROWSER

В настоящее время более 20 изготовителей лицензировали UP.BROWSER для своих мобильных телефонов. Среди них Motorola, Ericsson, Nokia и Toshiba. Для получения полного списка мобильных телефонов, поддерживающих UP.BROWSER, посетите http://updev.phone.com/dev/ts/up/phones.html. 

Переносимость приложения

Пример, иллюстрированный здесь, был проверен только на UP.SIMULATOR. Поскольку различные изготовители телефонов имеют слегка различное исполнение WML, приложение, написанное в WML и проверенное на одной программе просмотра, может не работать правильно в другой. Поэтому возможно, что при загрузке данных исходных текстов вам потребуется адаптировать их к некоторым иным программам просмотра.

Вход в программу

Каждому продавцу от нашей гипотетической компании PaperClip присваивается StaffID и пароль для доступа к информации склада. 

Код для входа продавца:

<% Response.ContentType = "text/vnd.wap.wml" %> <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <!-- Welcome Screen --> <card id="Welcome" title="Welcome"> <p> Welcome to PaperClip WAP Services <img alt="" localsrc="paperclip" src=""/> <br/> StaffID ? <input name="StaffID" type="text" maxlength="8" /> Password ? <input name="Password" type="password" maxlength="8" /> <do type="accept" label="Login"> <go href="Login.asp" method="post"> <postfield name="StaffID" value="$StaffID" /> <postfield name="Password" value="$Password" /> </go> </do> </p> </card> 

Первая часть кода должна установить тип документа. Вы можете обратить внимание, что вышеупомянутый код содержит только WML-разметку за исключением первой строки:

<% Response.ContentType = "text/vnd.wap.wml" %>

Использование свойства ASP Response.ContentType гарантирует, что тип MIME установлен правильно.

<% Response.ContentType = "text/vnd.wap.wml" %> <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> 

Обратите внимание на изображение скрепки на экране входа в систему. Оно создано WML–тэгом

<img>.

<img alt="" localsrc="paperclip" src=""/>

Атрибут localsrc <img> элемента определяет список изображений, доступных телефону локально. Для полного списка доступных изображений, обратитесь к WML Language Reference, стр. 37.
Большинство элементов WML подобны HTML. Прежде, чем мы перейдем к следующему экрану, рассмотрим этот код:

<do type="accept" label="Login">  <go href="Login.asp" method="post">  <postfield name="StaffID" value="$StaffID" />  <postfield name="Password" value="$Password" /> </go> </do>  

Элемент сопоставляет задачу с клавишей интерфейса пользователя телефона. Для UP.SIMULATOR:

После того, как продавец ввел свой StaffID и пароль, он нажимает на клавишу accept (Login), для подтверждения подлинности его идентификации.

Идентификация

Как только продавец введет StaffID и пароль, приложение перейдет к подтверждению его подлинности.

<template> <do type="options" label="Search"> <go href="Search.asp" /> </do> </template> <!-- Login Card --> <card id="Login" title="Login"> <p> <% sqlQuery = "SELECT * FROM Staff WHERE StaffID='" Request.Form("StaffID") & "' AND Password='" Request.Form("Password") & "'" set rs = conn.Execute(SQLquery) if rs.EOF then Response.Write "Invalid Login" Response.Write "<do type='accept' label='Retry'>" Response.Write " <go href='index.asp'/>" Response.Write "</do>" '---override the <template> element Response.Write "<do type='options' label=''>" Response.Write " <go href=''/>" Response.Write "</do>" else Session("StaffID") = Request.Form("StaffID") Session("Password") = Request.Form("Password") Response.Write "<strong>Welcome, " & rs.Fields("Name") & "! </strong><br/>" sqlQuery = "SELECT * FROM Inventory" Set rs = conn.Execute(SQLquery) %> 

Если продавец не прошел идентификацию, появляется экран, показанный здесь. Заметьте, что, когда пользователь не сумел войти, элемент <template>:

<template> <do type="options" label="Search"> <go href="Search.asp" /> </do> </template> заменяется на: '---override the <template> element Response.Write "<do type='options' label=''>" Response.Write " <go href=''/>" Response.Write "</do>" 

Это гарантирует, что функция поиска недоступна неидентифицированному пользователю. Как только пользователь прошел регистрацию, его StaffID и пароль сохраняются в объекте session.

Относительно поддержки Cookies

В этом приложении был использован объект Session в ASP. Поскольку объект Session требует поддержки cookies на стороне клиента, предположим, что платформа, которая используется, чтобы выполнить это приложение, поддерживает cookies. В частности, при разработке приложений, которые будут развернуты в реальном мире, гарантируйте, что Ваш WAP шлюз использует поддержку cookies. UP.SIMULATOR поддерживает cookies, и, таким образом, мы можем использовать их для создания двух переменных сессии:

Session("StaffID") = Request.Form("StaffID") Session("Password") = Request.Form("Password") 

Эти две переменные сессии могут использоваться повсюду в приложении для идентификации пользователя, который его запустит. Если платформа не поддерживает cookies, то StaffID и пароль должны передаваться от входной формы до их повторного использования при помощи методов get или post (элементы <go> и <postfield >).

Получение списка описи

Как только пользователь идентифицирован, сценарий ASP начнет генерировать список доступных изделий. Для простоты изложения ограничим число предметов в списке десятью предметами.

<anchor> View Cart <go href="cart.asp" /> </anchor> <br/>Stock List: <select name="stockID"> <% while not rs.EOF %> <option value="<% =rs("SKU") %>"> <% =rs("SKU") %>-<% =rs("Name") %>(<% =rs("OnHand") %>) $$<% =rs("CostPrice") %> - $$<% =rs("SellPrice") %> </option> <% rs.MoveNext Wend %> </select> <do type="accept" label="Order"> <go href="cart.asp" method="get"> <postfield name="SKU" value="$stockID" /> </go> </do> 

Мы будем использовать элемент <anchor> для создания гиперсвязи просмотра содержания корзины покупок. Что касается списка предметов, доступных в таблице описи, будем использовать элементы <select> и <option>. 

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

Ввод для функций «Заказ» и «Поиск» соответственно:

>do type="accept" label="Order"< >go href="cart.asp" method="get"< >postfield name="SKU" value="$stockID" /< >/go< >/do< >template< >do type="options" label="Search"< >go href="Search.asp" /< >/do< >/template< 

Обратите внимание, что здесь был использован элемент < template >, чтобы отделить параметр «Поиск». Элемент template определяет связи на уровне деки и относится ко всем платам в деке.
Если пользователь щелкает на клавише Up, «фокус» переходит на ссылку View Cart.
Формат отображенного товара - SKU-Название- (Количество -Себестоимость-Цена Продажи).

Клавиша accept теперь изменена на Link. Щелчок по клавише accept покажет содержимое корзины.

Добавление товара а корзину

Для добавления товара в корзину просто выберем элемент и нажмем на клавишу accept.

При добавлении товара отображается содержание корзины. Изображенный ниже код добавляет товар в корзину:

sqlQuery = "INSERT INTO Orders (StaffID, SKU, Qty, OrderDate) " sqlQuery = sqlQuery + "Values ('" & Session("StaffID") & "','" & " sqlQuery = sqlQuery + "Request.QueryString("SKU") & "',1,'" & date & "')"" On Error Resume Next '---prevent duplicate items from crashing my program--- set rs = conn.Execute(sqlQuery) rs.Close 'Displaying the Cart Content 

Следующий код показывает содержание корзины:

'---Displays the cart content--- Response.Write "<br/><strong>Cart Contents</strong>" sqlQuery = "SELECT * FROM Orders INNER JOIN Inventory ON Orders.SKU=Inventory.SKU WHERE StaffID='" & Session("StaffID") & "'" set rs = conn.Execute(sqlQuery) if not rs.EOF then Response.Write "<select name='CartItem'>" While not rs.EOF Response.Write "<option value='" & rs("SKU") & "'>" & rs("SKU") & _ "-" & rs("Name") & "(" & rs("qty") & ")</option>" rs.MoveNext Wend Response.Write "</select>" rs.Close %> <do type="option" label="Qty"> <go href="EditCart.asp" method="get"> <postfield name="SKU" value="$CartItem" /> </go> </do> <% else %> <br/>Cart is empty! <do type="accept" label="Main"> <go href="login.asp" method="post"> <postfield name="StaffID" value="<% =Session("StaffID") %>" /> <postfield name="Password" value="<% =Session("Password") %>" /> </go> </do> <% end if %> 

Заметьте, что, если тележка пуста, клавиша ACCEPT будет отображена как Main и возвратит пользователя к основной экранной странице.

В корзине две ссылки [Главная] и [Поиск], и два параметра: Delete и Qty  (чтобы изменить количество товара). Чтобы удалить товар, щелкните на клавише ACCEPT (Delete).

<template> <do type="accept" label="Delete"> <go href="Cart.asp" method="get"> <postfield name="delete" value="$CartItem" /> </go> </do> </template> 

Чтобы изменить количество товар, щелкните на клавише option (Qty).

<do type="option" label="Qty"> <go href="EditCart.asp" method="get"> <postfield name="SKU" value="$CartItem" /> </go> </do> 

Изменение количества товара в корзине

Когда пользователь нажимает на клавишу option (Qty), исполняется файл EditCart.asp.

<card id="GetQty" title="Get Qty"> <p> Qty? <input name="Qty" type="text" maxlength="3" /> <do type="accept" label="Set"> <go href="EditCart.asp" method="get"> <postfield name="SKU" value="<% =Request.QueryString("SKU")%>" /> <postfield name="qty" value="$Qty" /> </go> </do> </p> </card> 

Чтобы изменить количество, введите число и нажмите на клавишу accept ( Set ). 

sqlQuery = "UPDATE Orders SET Qty=" & Request.QueryString("qty") & _ 
" WHERE StaffID='" & Session("StaffID") & "' AND SKU='" & _
Request.QueryString("SKU") & "'" 
set rs = conn.Execute(sqlQuery) 
'response.write sqlquery 
'---display the content of the cart--- 
Response.Redirect "cart.asp" 

После изменения количества WAP – броузер перенаправит на cart.asp, где отобразится обновленное содержание корзины.

Удаление товара из корзины

Для этого нажмите на кнопку accept (Delete).

'---check to see if this is a deletion?--- ItemToDelete = Request.QueryString("delete") if ItemToDelete<>"" then '---delete an item--- sqlQuery = "DELETE FROM Orders WHERE StaffID='" & Session("StaffID")" sqlQuery = sqlQuery + " & "' AND SKU='" & ItemToDelete & "'"" set rs = conn.Execute(sqlQuery) 'rs.Close 

Поиск товара

Поиск можно производить из основной страницы и со страницы корзины

Для поиска введите SKU товара и нажмите на кнопку accept (Locate).

sqlQuery = "SELECT * FROM Inventory WHERE SKU LIKE '%" & SearchStr & "%'" Set rs = conn.Execute(SQLquery) 
Выведем результаты поиска
Response.Write "<select name='stockID'>" While not rs.EOF Response.Write "<option value='" & rs("SKU") & "'>" & rs("SKU") & "-" _ & rs("Name") & "(" & rs("OnHand") & ") $$" & rs("CostPrice") & "-$$" _ & rs("SellPrice") & "</option>" rs.MoveNext Wend Response.Write "</select>" 

Со страницы поиска можно заказать товар или перейти на главную страницу

Отладка WAP-программы

Немногие симуляторы позволяют удобно работать с отлаживаемым WAP-приложением. Однако, в UP.Simulator во все время работы открыто окно Phone Information Window.

Окно Phone Information представляет полезную информацию для WAP разработчика. В нем отображены все HTTP запросы и WML страницы, которые вы загружаете с сервера. Наиболее полезная особенность - способность показать неправильно созданную WML страницу. Пример ниже:

<% Response.ContentType = "text/vnd.wap.wml" %> <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <!-- Welcome Screen --> <card id="Welcome" title="Welcome"> <p> Welcome to PaperClip WAP Services <img alt="" localsrc="paperclip" src=""/> <br> StaffID ? <input name="StaffID" type="text" maxlength="8" /> Password ? <input name="Password" type="password" maxlength="8" /> <do type="accept" label="Login"> <go href="Login.asp" method="post"> <postfield name="StaffID" value="$StaffID" /> <postfield name="Password" value="$Password" /> </go> </do> </p> </card> 

Обычная ошибка - пропущено "/" после <br>. UP.Simulator отобразит такую картинку:

В окне Phone Information мы получим

======================= WML Errors ===================== WML translation failed. (10) : error: Expected tag end(>) instead of <newline> (10) : error: Expected </ instead of TEXT '' (10) : error: Invalid element 'PCDATA' in content of 'br'. Expected closing tag (10) : error: Invalid element 'input' in content of 'br'. Expected closing tag (11) : error: Invalid element 'PCDATA' in content of 'br'. Expected closing tag (11) : error: Invalid element 'input' in content of 'br'. Expected closing tag (12) : error: Invalid element 'do' in content of 'br'. Expected closing tag (18) : error: Close tag 'p' does not match start tag 'br' (19) : error: Close tag 'card' does not match start tag 'p' (29) : error: Close tag 'wml' does not match start tag 'card' (29) : error: Expected the end of root element instead of end of file ======================= End Errors ===================== ************************ Current WML ****************************************** <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD /wml_1.1.xml"> <wml> <!-- Welcome Screen --> <card id="Welcome" title="Welcome"> <p> Welcome to PaperClip WAP Services <img alt="" localsrc="paperclip" src=""/ <br> StaffID ? <input name="StaffID" type="text" maxlength="8" /> Password ? <input name="Password" type="password" maxlength="8" /> <do type="accept" label="Login"> <go href="Login.asp" method="post"> <postfield name="StaffID" value="$StaffID" /> <postfield name="Password" value="$Password" /> </go> </do> </p> </card> </wml> ******************************************************************************** Translation failed for content-type: text/vnd.wap.wml ----------------- DATA SIZE ------------------------ Uncompiled data from FILE is 266 bytes. ...found Content-Type: text/vnd.wap.wml. Compiled WAP binary is 96 bytes. ---------------------------------------------------- 

В сообщении об ошибках мы можем видеть, что строка 10 содержит ошибку и что ожидается "/". Мы можем также просмотреть коды WML, которые посланы UP.SIMULATOR. Коды отображены в конце окна Phone Information. Еще одна интересная информация – размер неоткомпилированных и откомпилированных WAP данных.

----------------- DATA SIZE ------------------------ Uncompiled data from FILE is 266 bytes. ...found Content-Type: text/vnd.wap.wml. Compiled WAP binary is 96 bytes. ---------------------------------------------------- 

Заключение

В этой статье Вы увидели, как типичное приложение E-коммерции может быть адаптировано для WAP устройств. Очевидно , что размер экрана накладывает серьезные ограничения на разрабатываемые приложения. Однако есть и хорошие новости. Навыки программирования HTML и ASP существенно помогают при создании приложений WAP. Очевидно, в ближайшие месяцы компании будут писать две различные версии приложений для Интернет: одну для Web, а другую для WAP. Другая проблема – совместимость броузеров для WAP.Это напоминает создание страниц под Microsoft Internet Explorer и Netscape Navigator.

WAP и ASP - Часть I
WAP и ASP - Часть II
WAP и ASP - Часть III

Автор: Wei Meng Lee · Добавлена: 2002-09-09
Источник статьи · Просмотров: 2937 · Рейтинг: 0.0

Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Категории раздела
Flash
Apache
WWW
PhotoShop
Веб-дизайн
Раскрутка и реклама
Базы данных
3D графика
Хостинг
Истории веб-мастеров
Web-технологии
Сетевая безопасность
Программирование для Web
Операционные системы

Новые статьи
Лучшие статьи
Популярные статьи
Комментируемые статьи
Разделы сайта
Скрипты
Статьи
Шрифты
Флэш исходники
HTML шаблоны
Партнерки
Клипарты
Смайлы
Фоны
Гифы
Иконки
Опрос сайта
Ведете ли вы блог?
Всего ответов: 60032
Наша кнопка
WoWeb.ru - портал для веб-мастера