前言
小方走在热闹的市区中,旁边来来往往的人群陆续走过。手机突然响起,拿起了手机,萤幕上出现了日巴克咖啡的闪烁的Logo,接着出现了一个虚拟店员,亲切的问道:「小方先生,您前方200公尺附近有一家我们的分店,目前正有您喜欢的黑森林蛋糕与拿铁咖啡的优待,要进来坐坐吗?另外,您的好友,小光与小薛也在附近,您要一起邀请他们吗?」小方想了想,接着对着电话说:「好,顺便邀请我的朋友们。」萤幕上的虚拟店员接着说:「谢谢您,请问您要如何付款呢?」小方:「就用我的世界银行信用卡吧。」虚拟店员接着说:「很高兴为您服务,您的消费总金额为250元,我们会在10分钟内准备好您的餐点,这是由您现在的位置到我们分店的地图,它会一步步引导您到我们的分店,再次谢谢您的光临。」
小方的生活,简单的ME(Mobile Electronic)-Life。
看完上面小方的例子后,您是否也很向往未来如此的生活?不用羡慕,不久的将来我们就可以过着如此的生活,一只手机即可闯遍江湖。现在的电脑网页十分泛滥,有个人的网页似乎已经不稀奇,如果可以有个人的WAP(Wireless Application Protocol)网页,那才够ㄅ一ㄤˋ呢!朋友透过手机即可知道您最新的讯息。这样不是人生的一大乐事吗?如果您有此打算,相信本文章可帮您实现您的梦想。
架构个人专属WAP网站
当笔者写此文章时,发现坊间教写网页、架网站的书籍及软体皆不少,但是教写WAP网页、架WAP网站的书籍,却是一本也没有。没办法,这么新的东西,只好到国外网站找资料。不过您也不要因为这样就觉得要架一个WAP网站就需要知道许多新知识,其实如果以前您有写过HTML、JAVAScript程式,架设过HTML的网站,则要架个WAP网站,您会发现实际上您已经驾轻就熟,因为WAP网站所需使用的WML(Wireless Markup Language)及WMLScript两种语言,与电脑网站所需的HTML及JAVAScript语言很类似,甚至更简单。如果您之前没有这方面的经验,只要您循着本文章的说明做下去,您一定可以比您的朋友还早就拥有一个WAP网站。
废话不多说,现在就开始动手。所谓工欲善其事必先利其器,要写WML,就必须有可以处理WML的工具。经过笔者的比较,Nokia Wap Toolkit搭配JRE(Java Runtime Environment)是个不错的选择,取得方法请参考(注一)。程式集--Nokia Wap Toolkit--Toolkit即可看到如(圖一)的畫面:"从网站上将此两种工具下载,按照指示安装完成后,选择:开始--程式集--Nokia Wap Toolkit--Toolkit即可看到如(图一)的画面:
《图一 点选Nokia Wap Toolkit的画面》 |
|
左大半部即是WML的程式,右半部则是一个6150手机的模拟器,意思即为:我们可以在左边写完程式,然后立即在右边的手机看到结果,不需要真的拥有一只WAP手机,再加上支付高额的电话费测试即可完成我们的WAP网站,是不是很方便呢!
让我们来看看左半部WML程式的部分,是不是和HTML很类似?基本上,他们都是属于标签语言(Tag Language)。Open...--選擇位於C:\Program Files\Nokia\ WAP_Toolkit\samples\readme.wml --"现在让我们开启附于Nokia Wap Toolkit中的一个例子来解说,选择左上角File--Open...--选择位于C:\Program Files\Nokia\ WAP_Toolkit\samples\readme.wml -- Open,如下方的程式即会显示于萤幕上:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
'
<p>
"Welcome to WaferTech:
<a href="#apps">Script Examples</a><br/>
<a href="#welcome">Text Examples</a><br/>
</p>
</card>
<card id="apps" title="Script examples">
<p>
<a href="currency.wml">Currency Calc</a><br/>
Mortgage Calc'Mortgage Calc
Weighted Index'Weighted Index
</p>
</card>
<card id="welcome" title="Text examples">
<p>
<a href="Welcome1.wml">Welcome1</a><br/>
<a href="Welcome2.wml">Welcome2</a><br/>
<a href="Welcome2.wml">Welcome3</a><br/>
Timer Example'Timer Example
</p>
</card>
</wml>
我们先跳过程式的部分不看,先来看执行起来的样子。按一下左下方的Show按键,注意看右方手机萤幕中的画面改变成如(图二):
手机萤幕显示的就是左边程式所执行出来的结果。我们先来操作看看:于”Examples”页下,按下卷键,至”Text Examples”反白时,如(图三):
按确定键,此时就切到”Text Examples”页,我们继续下卷至”Welcome1”反白时,如(图四):
按确定键,此时又会切到”Toolkit Demo”页,如(图五):
浏览完此页后,您会发现已经没有其他网页可浏览了,没关系,因为这是个示范程式,因此没有考虑很周详,一般来说,至少要将右可定义键利用程式定义为”Back”,使得使用者,可回到上一页去。如果您想继续浏览刚才其他的网页,只要再按一下左下方的Show按键即可从头再来一遍。
由上面的操作,我们可知,手机上展现的网页内容,无法像电脑网页的内容来的丰富,这是由于受到了现有手机有限的显示萤幕,传输速度,按键,记忆体及运算能力所限制,但是手机随身携带的便利性,却不是笨重的电脑所能及。因此在规划WAP网页时需把握一个原则:一页的长度不要太长,如果真的无法避免,则以如上例的,加以归类,然后以超连结的方式加以串联,另外别忘了定义” Back”。
接下来我们回头来看程式:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
此三行是每一个WML档案一定要出现的档头,第一行说明此档案是以XML(Extensible Markup Language) 1.0版为基础来发展。 XML?我们不是要写WML吗?没错,其实WML就是某一种较简单形式的XML。那么XML又是什么呢? XML是一种运用范围很广的程式语言,它允许您自订标签(Tag),因此您可以架构您想要的文件,相较于HTML只有固定标签可用,架构文件时必须想办法符合现有标签而言,XML多了许多的弹性。例如,WML就是以XML为基础,定义了一些自己会使用的标签。如果您对于XML有兴趣,请参考其他相关书籍,或是到http://www.xml.com/有很详细的说明,本文将只针对WML的部分作介绍。
前面提到了标签不少次,如果不熟悉HTML的人一定会问:标签是什么?我们继续看程式下去,您就可以明白。
<wml> ← 开始标签
.
.
.
← 結束標籤" ← 结束标签
以”<”与”>”所构成的语法,就是一个标签,标签又分为开始标签(如:<tag>)及结束标签(如:</tag>,多一个”/”),而两个标签中间的部分则是内文。如果没有内文,也可以将两个标签合而为一,成为一个单对标签(如:<tag/>,”/”放于尾端)。不论是开始标签与结束标签的组合,或是单对标签,均称为元件(Element)。一个元件内可能包含开始标签,内文,其他元件,结束标签,或是单对标签。
元件:"接着我们继续看元件:
'
<p>
"Welcome to WaferTech:
<a href="#apps">Script Examples</a><br/>
<a href="#welcome">Text Examples</a><br/>
</p>
</card>
这就是我们刚刚看到手机上画面的第一页(如图二及图三),看着图来对应程式,应该就不难理解程式的内容。跟在标签后面的我们称为属性(Attribute),以card为例:
'
id及title即为card的属性。其中id是为了让其他超连结知道如何连结至此页,而title的内含值则是会显示于此页的上方,图二及图三就可看到手机画面上方的”Examples”字样。
<p>
.
.
</p>
<p>及</p>代表着其间的内文是个段落(Paragraph),有着同样的呈现方式,系统预设的方式为向左靠齐,如果您想向右靠齐,可于<p>加入align的属性,如下:
<p align="right">
按一下左下方的Show按键,手机上的字就会向右靠齐,如(图六)。
"Welcome to WaferTech:
及間的,就是要顯示於手機的字。"于及间的,就是要显示于手机的字。 就是剛剛有提到的單對標籤,作用則是於手機上換行(Line Break)。"就是刚刚有提到的单对标签,作用则是于手机上换行(Line Break)。
<a href="#apps">Script Examples</a><br/>
<a>是Anchor的缩写,作用为超连结,当使用者选择其内文(“Script Examples”)时,则连结到其他页去,至于要去那儿,则是由属性href决定,href可设定为其他card的id,其他WML档案,或是别人的WAP网址。在这儿,”#apps”为其他card的id。此行亦可改写为:
<anchor>Script Examples
<go href="#apps"/>
"
我们接着直接跳到最后一个card:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
'
<p>
"Welcome to WaferTech:
<a href="#apps">Script Examples</a><br/>
<a href="#welcome">Text Examples</a><br/>
</p>
</card>
<card id="apps" title="Script examples">
<p>
<a href="currency.wml">Currency Calc</a><br/>
Mortgage Calc'Mortgage Calc
Weighted Index'Weighted Index
</p>
</card>
<card id="welcome" title="Text examples">
<p>
<a href="Welcome1.wml">Welcome1</a><br/>
<a href="Welcome2.wml">Welcome2</a><br/>
<a href="Welcome2.wml">Welcome3</a><br/>
Timer Example'Timer Example
</p>
</card>
</wml>
0
基本上,与前面介绍的都大同小异,只差在这次的<a>是连结到其他的WML档案去。有兴趣的读者,可自行开启相关档案参阅。
由此可得知:一个.wml档案(我们亦可称为一个Deck)内含一个<wml>元件,一个<wml>元件可由多个<card>组合而成,而每个<card>即是一个画面,每一个画面间则以<a>来连结。这样的设计主要是为了配合手机的萤幕尺寸而设计,因此与HTML有些许不同。整个程式的结构如(图七):
结语
如何架构一个自己专属的WAP网站─基础篇,暂时到这里结束,我们将于下一期再对WML作更深一层的探讨。如果读者有兴趣,可先行参考Nokia所附的范例程式,或是Nokia Wap Toolkit附的参考文件,必须有Adobe Acrobat Reader才能开启,请参考(注二),或是到http://www.wapforum .com/查询。
让读者能够轻轻松松赶上科技潮流,创造自己的ME-Life,是威波科技的经营目标,我们希望藉由分享如何架设WAP网站来帮助您提早体验未来科技生活。如果您对这一期的内容有任何的问题,欢迎您到本公司网站http://www.wapertech.com参观,或来信contact@wapertech.com,我们将在下一期的讨论中整理回答您的来信。
备注
注一:要取得Nokia Wap Toolkit,必须先至http://www.forum.nokia.com/中的WAP Developers注册,加入会员后,再进入Nokia WAP Developer Forum即可取得。而在取得Nokia Wap Toolkit之前,有一个download JRE 1.2.2的超连结到Sun的网站,由那儿即可得到Java Runtime Environment。目前最新的版本,同时也是笔者使用的版本为:Nokia Wap Toolkit Version 1.3 Beta,Java Runtime Environment Version 1.2.2。
注二:要取得Adobe Acrobat Reader,可至http://www.adobe.com/products/acrobat/readstep.html中取得。
注三:WAP技术与WML撰写之相关文章请见本刊2000.1月号(68期)第76页「第三代行动电话的WAP技术」,以及2000.2月号(69期)大特写「行动商务」系列之「WML技术探讨与实务操作」(第60页)。
(作者任职于威波科技资深工程师)