商务表达层技术基础电子商务技术基础邮电部培训中心苟娟琼PPT课件

1 第2章商务表达层技术基础 电子商务信息分享架构静态页面表达及其技术基础动态页面表达及其技术基础用户界面体系结构的选择 2 电子商务信息分享架构 万维网 观念与技术商务表达信息的组织商务表达平台的实现 3 万维网 观念与技术 WEB到底是什么 对信息的存储和获取进行组织的一种思维方式 两项重要的创造发挥了关键的作用超文本 hypertext 图形化用户界面 GUI 4 WEB的历史及意义 起源 让处于不同地点的科学家可以共享文件 1989年 欧洲粒子物理实验室 CERN 的蒂姆 伯纳斯一李和罗伯特 卡利奥开始着手改进实验室的研究档案处理程序 他们俩各自提出了一个超文本开发计划 在接下来的两年 伯纳斯一李开发出了超文本服务器程序代码 并使之适用于因特网 1993年 伊利诺斯大学的马克 安德列森领着一群学生写出了Mosaic 1994年 安德列森和伊利诺斯大学Mosaic小组的其他成员同SGI公司的詹姆斯 克拉克合作成立了网景 NetscapeCommunications 公司 超文本技术和浏览器技术的结合 带来了全球性的网络热 WEB也很快变成了浏览 信息出版及在因特网中执行交易的业界标准 WWW网站数目的增长速度甚至超过了因特网自身的发展速度 5 WEB 信息分享架构 6 WEB的特征与意义 与传统的信息形式相比 超文本的含义有两层 一是信息的形式不再限于简单的字符或数值型数据 而是可以包含多媒体信息 超文本可以实现网络上信息之间的相互链接 成功的主要原因简易的导览和使用 新的分送模式实现了一个网络集中式的模式 WEB是网络集中式计算的缩影 网络即电脑 7 WEB的技术架构 万维网已经成为含盖广泛的观念以及科技全球超文本出版概念 统一界面的概念以及主从架构概念 万维网所依赖的各种概念和技术超文本传送协议 Hyper TextTransferProtocol HTTP 统一资源标示 UniformResourceLocator URL 超文本标式语言 Hyper TextMakeupLanguage HTML WEB服务器WEB浏览器 8 WEB应用的特点 广泛的传播面和极强的时效性突破线性限制的超链接方式灵活多变的传播模式 支持更广泛的客户端设备 WEB应用服务器能集成对资源 如数据库 的存取 从而简化应用的设计 增强可伸缩性 并提供对资源的更好保护 运行在服务器端的商务逻辑容易得到保护 更新和维护 运行在服务器端的商务逻辑使得用户的应用环境得到集中管理并能在不同的客户机上重建 9 传统客户端与WEB模式之比较 传统客户 服务器模式的优势和缺陷结果集返回给客户端 从而使网络负担大大减轻所有对数据库的查询操作都由充当数据库服务器的计算机来进行 需求集中 数据一致性控制安装 升级 维护困难 使用不方便 培训费用高 软件建设周期长 适应性差系统生命周期短 移植困难 升级麻烦 系统建设质量难以保证 10 浏览器 服务器模式的优势 是一种瘦客户机模式易于管理和维护 无需开发客户端软件开发效率高 开发周期短 见效快 平台无关性开放性 可使已有的软硬件投资得到良好的保护 从原有系统平滑地升级到Internet 优点应从结构上理解 应用程序从结构上一般分为四层 形式逻辑 业务逻辑 数据逻辑 数据存储 11 商务表达信息的组织与分享 商务表达信息的特征电子商务网站与电子商务系统网站的基本组成与访问网站内容与功能的设计 12 电子商务网站与电子商务系统 13 网站的基本组成 网页网页空间网址与域名 14 网站的访问 标准网址 域名 目录名 文件名http www e 15 网站内容与功能的设计 站点设计与策划内容创建或者信息采编页面编程 16 商务表达平台的实现 客户端的技术划分表达层的实现方式 17 商务表达平台三种实现方式 18 小结 理解WEB的观念和技术架构正确区分电子商务网站与电子商务系统了解电子商务平台的三种表现形式 19 静态页面表达及其技术 2 2 1静态页面的体系结构2 2 2标记语言的特征与演变2 2 3网页的制作与发布 20 静态页面的体系结构 21 标记语言的特征与演变 了解SGML简单掌握HTML理解XML 22 标记语言家族谱 23 超文本标记语言 HTML 1 HTML标记 2 HTML链接 3 HTML的版本历史 4 HTML编辑器 5 HTML的缺陷 24 HTML链接 AHREF 地址 可见的链接文本 A AHREF http 北方交通大学 A 同样 也可以链接到同一文档的其他部分 也许是简历中的第三页 AHREF references 参看详细资料 A 25 链接接结构 26 HTML的缺陷 HTML更多地关注WEB浏览器如何在页面上安排文本 图象和按纽等 过多的考虑外观使其缺乏对结构化数据的表示能力 HTML中有限的标记不能满足很多WEB应用的需要 是因为HTML缺乏可扩展性从1996年开始 W3C WorldWideWebConsortium 的一个工作组设计一个超越HTML能力范围的新语言 后来被命名为XML eXtensibleMarkupLanguage 可扩展标记语言 27 XML XML是SGML的一个优化子集 因此也是一种元标记语言 使用者可以按需要创建新标记 XML设计的初衷在于 如果文档中的数据达到结构化 就赋予其明确的语义 这使得它具有革命性的特质和优势 XML最大的特点就是它具有创建标签的能力 HTML中的标签是不可任意创建的 它不传递语义信息 更多情况下是描述显示信息 因此 XML具有更强的扩展性 XML另一突出的特点就是它将数据与数据的显示分开 内容与形式相分离 可以使XML文件的编写者集中精力于数据本身 而不受显示方式的细节所影响 而它所带来的另一个好处 即不同的样式表可以使相同的数据呈现出不同的显示外观 从而适合于不同的应用 可以在不同的显示设备上显示 28 1 XML的结构化文档技术 联想电脑联想联想台式机台式机同禧500P3同禧500P3667MHz64MB66710GB647999元107999 29 用标记表示文档结构 使用表记表达文档的任务有两个 一是正确地表达XML文档所具有的 结构 二是正确的传达按文档所标记的数据的含义 XML文档数据采用树型结构表达 图4 12中XML文档的树结构形式如图4 13所示 计算机 类型 个人机 制造商 联想识别符 品种 台式机型号 同禧500P3主频 667 单位 MHz内存 64 单位 MB硬盘 10 单位 GB单价 7999 单位 元 30 用DTD定义标记含义 XML的文档类型以标记集合来定义 在制定的XML标准中 一个XML文档允许采用多个DTD 其目的是把一般确定的DTD与企业独自的DTD相结合 但含义不能有异 以重新利用原有资源 因此在XML1 0标准中规定了特定DTD的 名称空间 标准 具体做法是把存储DTD的集合名称与标记并存 以防混同 31 XML应用开发 开发XML应用通常涉及四个方面 构造XML标记语言生成XML文档解释XML文档显示XML文档 32 XML的用途 数据交换 XML使得不同计算机应用系统之间数据交换变得容易起来 这是因为它的可扩展性和文档中使用元数据 XML尤其在下列领域有重要应用 EDI EDI被用来在异构系统间进行数据交换而支持事务处理 Agent 智能体 软件设计元素的交换 33 XML的用途 Web应用 XML文档无疑将成为Web资源的重要组成部分 而且基于XML的文档资源使Web搜索引擎的智能化变得容易起来 除此之外 XML能够用来建立HTML所不能达到的多层Web应用 XML在Web应用中有下列用途 集成不同数据源 本地计算 数据的多种显示 支持Web应用的互操作和集成 34 XML与HTML的综合比较 35 小结 HTML 主要标记 链接 表单HTML与XML的本质区别XML的用途 36 2 2 3网页的制作与发布 WEB设计环境WEB综合设计网页制作工具网站 网络信息 的发布 网络出版 37 WEB设计环境 WEB的技术环境从技术为人服务的观念出发 应尽可能从用户的角度来设计 便是如何使网页在不同的浏览器下都能正常显示 如何设计网页以适应不同的分辨率 考虑用户的低带宽连接 WEB的媒体环境计算机屏幕与传统的基于纸张的媒体完全不同 设计者必须考虑超链接的非线性特点 把合适的链接和相关内容有机地结合起来 38 WEB综合设计 先要明确网站的性质 目的 针对不同的类型进行创意 确定最终用户是很关键的一步 确定页面的结构和框架 这往往是和站点总体规划相关的 网页设计者需要提供一些视觉功能性的建议 最后 要强调在不同的机器 浏览器 不同的速度等条件下测试网页 及早查处问题 技术与艺术的结合 39 示例 站点解析 惠普公司中国分部 的网址如下 从另一个视角分析惠普的网站 即看看它是如何处理产品售后服务的 从惠普主页中选择 服务支持 客户服务分成了几个具体的方面 a 软件类 b 硬件类 C 客户培训 d 代理商培训 e 系统集成服务下面我们就深入一点来分析 例如 假设我们遇到的问题比较常见 如果我们遇到的问题比较复杂 小结 通过对惠普站点的分析 可以深切的感受到一个成功企业在售后服务方面所下的苦心 服务种类多 设身处地的为顾客着想 将顾客需求分类 通过不同的方式予以解决 服务合同条款清晰透明等等 这正是许多国内企业应该好好借鉴的地方 40 示例 IBM公司站点解析 IBM公司始终不断的坚持三个基本信念 尊重个人 注重客户服务 精益求精着重看看他们是如何在网上推销他们的产品的 站点解析 中国分公司 小结 从对IBM这种大型跨国企业的电子商务站点的分析中 我们可以得到许多有关如何宣传自己产品的有益的启示 介绍的产品一定要少而精 一定要是拳头产品 不要把公司所有的产品都罗列到站点上 那样反而会让顾客无所适从 可以引用一些知名媒体或者杂志的评价 这样可以从侧面烘托产品性能 不要刻意修饰站点 那样反而会让人觉得 画蛇添足 41 网络信息 网站 的发布 站点发布就是将本地硬盘上的站点通过一定的传输协议传送到远程服务器上的过程 首先 服务器必须可以处理脚本和专有特性 另一个主要的发布问题是超链接 跟踪站点内的超链接索引是具有一定难度的 何时公开站点 发布方法 以HTTP方式发布站点以FTP方式 42 小结 静态网页的基础 标记语言网页的集合 网站网页 网站的设计 技术与艺术 43 商务表达平台技术基础 在WEB发展的早期 WEB服务器只提供静态的HTML页面 随着应用需求的增长和相关技术的发展 业务数据存储与WEB页面的集成变成了现实 从而推动了WEB应用从单一的信息提供发展为电子商务工具 电子商务应用的发展也反过来促进了动态内容生成技术的发展 电子商务信息分享架构静态页面表达及其技术基础动态页面表达及其技术基础用户界面体系结构的选择 44 2 3动态页面表达及其技术 2 3 1动态网页技术基础2 3 2客户端应用体系结构及其技术2 3 3客户端脚本体系结构及其技术2 3 4服务器端逻辑体系结构及其技术 交互功能 45 2 3 1动态网页技术基础 这里的 动态 重点不在于如何获得数据 属数据层技术 更不在于如何构建复杂的业务逻辑 而是实现用户与应用程序的通信 以及如何将所获得的数据显示在网页中 主要目标仍然在网页上 在信息的表达上 特别信息的双向交互上 这种技术上的区别 也正反映的电子商务网站和电子商务系统在系统建设上设计思路与技术基础的不同 CGI 通过用编程语言例如C Perl甚至是VisualBasic开发的应用程序来产生 这对于访问数据库或服务器上其他的大型或不同的信息资源是非常适用的 Script 脚本 嵌入HTML语句中的程序语言 首次引人到Web浏览器时 使用的是Netscape2 0 该脚本语言是由Java的语法派生而来的 故被称作JavaScript Microsoft为了增强客户端脚本的能力 其开发了基于VisualBasic的Script语言 即VBscript 后来 兼容 微软又开发了类似JavaScript的语言 叫做JScript 服务器端脚本 服务器端执行的脚本程序 46 脚本与服务器端脚本 服务器端脚本程序来说 解释的工作是由服务器在将页面发出到浏览器之前完成的 Today sDateToday sDateis Today sDateToday sDateisWednesday June7th2000 47 脚本比较 脚本 使一个站点中的网页对终端的用户响应性更好 来执行基本的逻辑操作和编程 更多的简单操作 例如验证用户在一个字端中输入数据 或者是浏览器端的其他一些交互式的操作 通过服务器的程序来判断并不是一种好的解决方案 服务器端 不存在浏览器兼容的问题 可以访问服务器端的资源 简化了客户端的装载 48 2 3 2客户端应用体系结构及其技术 客户端应用体系结构客户端应用程序JavaAppletsActiveX 49 客户端应用体系结构 传输必要的网络数据 而不需要传输HTML数据内容 50 客户端应用程序 Java应用程序是运行在客户端系统上的独立应用程序 这种客户端系统与浏览器无关 每次站点访问的下载或者将这个应用程序放在用户的高速缓存中 51 JavaApplets JavaApplet是由Java语言编写的包含在网页里的 小应用程序 它不能独立运行 而必须嵌入一个HTML文件之中 由浏览器解释之后作为网页的一部分来执行 52 ActiveX Microsoft将ActiveX定义为一组综合技术 这些技术使得用任何语言写的软件构件在网络环境中都能相互操作 在这些技术当中 ActiveX控件与Web设计的关系最密切 基本上 一个ActiveX控件是一个下载到IE 唯一支持这种技术的浏览器 并在客户端执行的功能完全的程序 ActiveX与Microsoft sWindows操作系统一起工作 这可以提供比Javaapplet更强大的功能 但它只能在Windows环境下工作 不像独立于平台的Java语言 ActiveX控件以二进制代码发放 并且必须针对目标机器的操作系统分别编译 53 小结 WEB应用特征并不明显用户响应快对客户断要求多Applet应用广泛键盘 鼠标响应声音播放及图像显示动画制作读取文件 54 2 3 2客户端脚本体系结构及其技术 客户端脚本体系结构JavaScriptJscriptECMAScriptVBScript 55 客户端脚本体系结构 56 浏览器支持 在这种结构中 程序在浏览器上执行 WEB服务器必须把程序代码传下来给浏览器 而浏览器也要能够执行服务器所传下来的程序代码 57 分析 这种体系结构的好处是 服务器与用户的通信比较少 需要的服务器资源比较少 由于在客户端执行一些业务逻辑 可以对用户动作作更多的响应 如鼠标移动 支持这种体系结构的技术包括 ECMAScript JavaScript Jscript VBScript和DHTML等 58 ECMAScript ECMASCript是一种脚本语言 已经由ECMA 欧洲计算机制造商协会 标准化 并以ECMA 262语言规范的形式发布 这种语言是由BrendanEich在网景公司发明的 并在Navigator2 0浏览器中首次出现 现在 它已经被Netscape和IE3 0以后的浏览器所支持 ECMAScript有许多面向对象编程语言的特点 用来在主机环境内执行计算并操纵计算对象 ECMAScript最初是作为Web脚本语言而设计的 作为基于Web的客户 服务器结构的一部分 它提供了一种机制用来丰富浏览器中的Web页面和执行服务器端的计算 到目前为止 ECMAScript规范没有被完整地实现 Netscape和Microsoft在开发自己的实现时 都对其作了扩充和限制 59 JavaScript 透过它可以做到回应使用者的需求事件 如 form的输入 而不用任何的网路来回传输资料 所以当一位使用者输入一项资料时 它不用经过传给服务器 server 处理 再传回来的过程 而直接可以被客户端 client 的应用程式所处理 也可以想像成有一个可执行程式在自己的客端上执行一样 它是Java与HTML折衷的选择 可以嵌入HTML页的基于对象的解释性脚本语言 60 Javascript在网页的用法 Javascript加入网页有两种方法 直接加入HTML文档 引用方式 如果已经存在一个Javascript源文件 以js为扩展名 则可以采用这种引用的方式 以提高程序代码的利用率 61 JavaScript的基本语法 JavaScript代码由 ScriptLanguage JavaScript Script 说明 在标识之间就可加入JavaScript脚本 通过 一 标识说明 若不认识JavaScript代码的浏览器 则所有在其中的标识均被忽略 若认识 则执行其结果 JavaScript脚本语言同其他语言一样 有它自身的基本数据类型 表达式和算术运算符以及程序的基本框架结构 JavaScript脚本语言的基本构成是由控制语句 函数 对象 方法和属性等来实现编程的 62 JavaScript基本特点 是一种脚本语言 它采用小程序段的方式实现编程 基于对象的语言 简单性 主要体现在 首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计 从而对于学习Java是一种非常好的过渡 其次它的变量类型是采用弱类型 并未使用严格的数据类型 安全性 它不允许访问本地的硬盘 并不能将数据存入到服务器上 不允许对网络文档进行修改和删除 只能通过创览器实现信息测览或动态交互 从而有效地防止数据的丢失 动态性 它可以直接对用户或客户输入做出响应 无须经过Web服务程序 它对用户的反映响应 是采用以事件驱动的方式进行的 跨平台性 63 JavaScript与JAVA的比较 是两个公司开发的不同的两个产品 基于对象和面向对象解释和编译 强变量和弱变量 代码格式不一样 嵌入方式不一样 静态联编和动态联编 64 示例 JavaScriptAppearshere alert 这是第一个JavaScript例子 alert 欢迎你进入JavaScript世界 alert 今后我们将共同学习JavaScript知识 65 Jscript Jscript是Microsoft对ECMAScript语言规范的实现 据Microsoft讲 它是一种完全的实现 并增加了一些可以利用微软IE优点的功能 到现在为止 它的版本是5 0 Jscript只有在MicrosoftIE或MicrosoftIIS的解释器下才能运行 Jscript和Javascript在某种程度上很相似 因为两者都有和ECMAScript语言规范相同的部分 另一方面 它们也有一些重要的差异 这使得开发跨平台的应用相当困难 这些差异体现在 各自附加对象的差异 例如与ActiveX控件的交互或者对客户文件系统的访问 在COM层次结构中的对象访问路径的差异 对象属性的差异 66 VBScript VBScript MicrosoftVisualBasicScriptingEdition 是MicrosoftVisualBasic家族的新成员 VBScript为IE带来了 动态脚本 它同样也被Windows脚本主机和MicrosoftIIS所支持 在基于浏览器技术的Web开发环境中 VBScript与JScript的特征非常的相似 包括与ActiveX的紧密集成 但是它有自己的来自VisualBasic的语法 因此 VBScript除了IE以外不被其他公司的浏览器支持 67 2 3 4服务器端逻辑体系结构及其技术 服务器端逻辑体系结构服务器端技术基础概述 68 1 服务器端逻辑体系结构 这个体系结构完全依靠服务器来提供用户界面内容 它的构造逻辑以及与用户的相互作用如图2 4所示 浏览器 控制逻辑业务逻辑内容构建 用户动作内容和控制的产生 请求响应 69 服务器端的操作 控制逻辑 服务器收到客户端的请求 取出传递的参数并确定相应的 业务对象 并进行适当的 业务动作 业务逻辑 业务逻辑属于应用逻辑的一个部分 对各种特定应用处理的总和 它处理特定业务知识 并且与几乎所有的相关技术代码相分离 这些技术代码包括分析和生成数据格式 数据库和I O处理 或内存和进程处理 内容构建 执行业务逻辑之后的结果会被格式化 并且可以辅之于布局和其他一些客户端显示所需要的信息 这种体系结构的好处是 所需的客户端资源很少 应用逻辑不用装入 启动用户交互所需的网络通信量很少 动态内容完全由服务器端的可执行代码完成 仅仅将HTML页面返回客户端 这样服务器端的应用程序就不必考虑浏览器和客户平台的差异 支持这种体系结构的技术很多 包括 ASP JSP PHP等 70 2 服务器端表达技术基础概述 服务器端的技术从商务表达层的需要来看 就是如何接收用户的输入 并构造传递给客户端的页面代码 构造过程本身 包括了数据接收 业务处理和信息返回 与传统客户 服务器开发不同的是 这里不能只返回结果数据 而必须返回一个能够反映结果的页面 也就是说 服务器端需要完成数据描述的构造工作 在应用开发中 会涉及到程序设计的各类语言和方法 因此 从物理上说 这部分的工作在后台服务器上完成 但从逻辑上讲 它仍旧服务于前台表示 在不同的书里 对这部分的技术讲述有不同的视角 有些在前端的网页制作中讲述 有些在后台的逻辑处理中进行分析 各自都有其合理性 因为象ASP这种应用程序中 它本身在一个程序中就包括了前台表达 后台逻辑处理 以及后端的数据库访问所有功能 对于简单的应用 比如电子商务网站 在技术上进行细致的层次划分是没有多少意义的 但从发展的角度看 随着应用系统复杂性的增强 即使是同一个程序语言 为了不同的逻辑层次的需要 其技术也有一些不同的增长点 比如前台更丰富的表现力 后台逻辑处理的复杂性和灵活性处理 异种平台的互联与访问 本书也以此作为技术讲解中的层次划分标准 比如在对程序语言 如ASP JAVA的讲解中 在表示层主要描述如何构建HTML页面 如何完成与用户的交互 在商务逻辑层介绍如何利用组件技术 微软的ActiveX和SUN的Servlets和EJB 设计扩展的分布式应用系统 完成商务逻辑处理 而在后端数据层 则主要分析不同的数据库访问机制和技术 71 6 服务器端逻辑的深化 随着商务逻辑的复杂 以及三层体系结构的出现 服务器端的处理逻辑进一步丰富和细化 更多的商业逻辑独立于表示逻辑 由应用服务器上的应用程序执行 并将结果返回WEB服务器 组装成最终的显示页面返回客户机 基于JAVA技术的服务器端执行逻辑如图所示 请求响应HTML可执行代码 如Servlet Client 浏览器 WebServer Plug In 后台数据源 AppServer 72 小结 服务器端脚本程序与HTML标记混编 引擎解释程序语句 直接插入HTML文本中 通过一些对象完成通讯 接收请求 发送响应 73 2 4用户界面体系结构的分析 2 4 1商务表达平台体系结构的比较结构 客户端应用 客户端脚本 服务器端脚本指标 易用性 性能 安全性 平台兼容性2 4 2商务表达平台体系结构的综合比较2 4 3跨平台策略Internet平台差异性处理不兼容性测试方法 74 易用性 不需要任何方面的训练就可以使用这些程序 在Internet环境下 隐语的使用 清晰 统一 定位和导航功能 服务器端逻辑体系结构 很简单的用户界面 超链接或表单 而且 每一次与用户的交互都需要与服务器进行交互 另一方面 仅仅通过静态的表现 如图标 而没有相关行为的描述是很难创造出直觉上的隐语 客户端脚本体系结构 提供更加复杂的导航和定位帮助 然而 提供精巧界面单元的脚本语言工具显得有一点点简陋 客户端应用体系结构 更复杂的语言元素和标准库使得客户端应用比脚本支持更复杂的逻辑行为 然而 需要在界面设计方面有相当丰富的经验 仅仅使用大量的GUI控件本身会隐藏着危险 多媒体内容 真正的多媒体应用是在提供隐语 导航及定位方面达到最高境界 75 性能 1 分布在客户端和服务器端的计算及相互间的通信都会对性能产生至关重要的影响 性能瓶颈包括 初始化时间 直到第一个用户交互可以完成 下载时间 客户端处理一个用户交互所需的时间 客户装入 需要与服务器交互的次数 服务器依赖度 从客户端向服务器传输消息及反馈结果所需的时间 网络传输时间 服务器处理用户交互所璧氖奔洌 衿髯叭耄 服务器处理用户交互所需的时间 服务器装入服务器端逻辑体系结构 非常短的初始化下载时间 而且因为客户不承担任何的计算 所以只需要很少的用户资源 所以这对服务器的依赖程度相当高 导致客户同服务器之间的大量信息的传输 最后 服务器不得不自己实现所有的计算 服务器装入 导致了大量的响应时间 一般用于用户交互需要较少的应用中 76 性能 2 2 客户端脚本体系结构通过脚本 用户事件可以获得较快的时间回应 与服务器之间的交互也只要较少的时间 服务器调用只是在不大的程度上得以提高 大量的脚本需要一个相当可观的下载时间一个缺点是对用户资源 例如主存 的需求更大了 3 客户端应用体系结构提供了最好的响应效果 与服务器的交流也就更少了 适度的服务器依赖 仅仅网络数据 无需布局信息 需要在服务器和客户之间进行传送 主要缺点是在在第一次交互前需要比较长的下载时间 比前一个方法需要更多的客户机资源 4 多媒体内容但却需要一个很大的下载时间和一些安装程序 对于音频 视频等多媒体内