Web开发的基本技术.ppt

1,第四章Web开发的基本技术,主要内容：WWW（WorldWideWeb）HTMLFrontpage交互网页的制作ASP（动态服务主页）Web数据库ASP的安装,2,1WWW（WorldWideWeb）,本节内容：1.1Internet服务1.2Internet提供的服务1.3www服务1.4网页和超文本,3,1.1Internet服务,Internet地址Internet地址唯一地确定Internet上每台计算机与每个用户的位置。Internet地址有两种表示形式IP地址像电话有电话号码那样，接入Internet的计算机也有一个由授权机构分配的号码，即IP地址。IP地址分前后两部分，前面部分叫网络号，后面叫主机号。184.117.143.112,4,1.1Internet服务,Internet地址域名由于IP地址的数字地址很难记忆，通常使用一个文字IP地址来表示，把它叫做域名。例如：,其中：cn代表中国，edu表示教育机构，hit指哈尔滨工业大学。,5,1.2Internet提供的服务,电子邮件即E-maill服务。文件传输服务即FTP服务：filetransferprotocolFTP服务执行TCP/IP中的FTP传输协议，允许在计算机之间传送文件。；FTP服务器；是提供FTP服务的计算机。上传：从客户将文件传到FTP服务器的过程。下载：从FTP服务器将文件传到客户机的过程。,6,1.2Internet提供的服务,万维网服务（WorldWideWeb服务，简称www服务）将在下一节详细介绍新闻公告类服务提供针对某问题展开讨论的服务，如BBS（电子公告牌）、网络新闻组等。USENET是规模最大的网络新闻组，它拥有数以千计的讨论组，在网上讨论各种专题。,7,1.3www服务（万维网服务）,万维网上不仅可以看到文字、图片,而且可听到声音、看到动画。www服务是通过客户机上的Web浏览器和Web站点上的Web服务器之间的通信来实现的。信息以网页的形式存放在Web服务器上，用户在客户机上通过Web浏览器（是一个软件）向Web服务器发出请求，Web服务器按此请求将需要的页面发送给用户。这些页面实际上都是一个个文件。用户直接看到的是文本信息本身，在浏览文本信息的同时，随时可以选中其中的“热字”。热字往往是与上下文关联的单词，通过选择热字就可以链接到另外一个地址并看到其他文本的信息。,8,1.3www服务,9,1.4网页和超文本,网页（Webpage）网页是我们在网上用浏览器（如InternetExplorer，简称IE）看到的那些页面。在www系统中，信息是按超文本方式组织的。页面实际上都是一个个文件。由若干互连的文本块组成的文本就是超文本（HyperText）。超文本方式是实现www的关键技术。,10,1.4网页和超文本,网页（Webpage）这些页面实际上都是一个个文件。如果用鼠标点击页面（文本）上的热字（高亮度或带下划线的条目），就可以链接并打开另一个你希望看到的页面。这种由若干互连的文本块组成的文本就是超文本（HyperText）。页面上看到的信息单元可以是一屏文字，也可能是一个窗口，或者是一个图象。我们把每个信息单元称作一个节点（node）。节点又有文字节点、图形节点、按钮节点之分。按钮节点用于执行一个过程，这些节点之间都是用链来连接的。,11,1.4网页和超文本,HTML文件（HyperTextMarkupLanguage）是用超文本标语言（HTML，HyperTextMarkupLanguage）写的，它存放在WEB服务器上。http协议（HyperTextTransferProtocol）即超文本传输协议，www服务是执行http协议进行传输的。,12,1.4网页和超文本,www浏览器通过它可以去找到并浏览Internet上各种WWW服务器上的主页。常用的浏览器软件有InternetExplorer和Netscape公司Navigator等搜索引擎搜索引擎是Internet上的一种www服务器，它能在Internet中主动搜索其他www服务器中的信息并对其索引，将索引内容存储在大型数据库中。使用搜索引擎时，用户输入关键字后，搜索引擎能返回包含该关键字信息的URL，并提供通向该站点的链接，使用户获得所需要的信息。,13,2HTML,主要内容：2.1用HTML做简单的网页2.2HTML文档的一般结构2.3常用的HTML标记元素2.4在网页中插入图片2.5用HTML定义表格,14,2.1用HTML做简单的网页,超文本文件是由超文本标记语言写成。其文件的格式采用ASCII格式。ASCII格式的文件本身其实是一种没格式的文件。为了在浏览时能看到带有格式的文件，办法是把文档中各种不同的内容用不同的标记元素对其属性做上标记。所以，超文本是由标记和文本内容两者组成的。例如为了显示“网络营销”四个大字，可按以下写出：,15,2.1用HTML做简单的网页,这里：和是一对标记元素，用来改变字体大小。SIZE和FACE是标记元素的属性，又称参数。SIZE说明字的大小，从1到7，数愈大，字愈大；FACE说明字体。如果把这一句写到记事本上做成.txt文件，再将其后缀.txt改成.HTML,就做成了一个HTML超文本文件。鼠标双击此文件，就能在屏幕上显示出“网络营销”四个大字。,16,2.1用HTML做简单的网页,超文本文件ASCII格式双标记方式（用一对标记来标记）,单标记方式（用一个标记来表示）,17,2.2HTML文档的一般结构,网上手机市场你想要买手机吗?你可以访问手机网站了解有关信息。,18,2.3常用的HTML标记元素,19,2.3常用的HTML标记元素,20,2.3常用的HTML标记元素,21,2.3常用的HTML标记元素,22,2.4在网页中插入图片,如果想在方才显示的屏幕上增加一个名为gxkj.gif的图形，只要在上述HTML文档中增加：IMGSRC=“gxkj.gif”width“20”height“15”,23,2.5用HTML定义表格,浏览器上显示的表格,表格名称,24,2.5用HTML定义表格,系统的特征：可以显示上页图中所示表格的HTML文本：表格名称第一标题列第二标题列第三标题列,25,3FrontPage,使用微软公司的FrontPageWEB编程工具可以做到在几乎不需要编写HTML代码的情况下，完成网页的制作，同时自动地生成HTML文件。,26,3FrontPage,用FrontPage制作页面,主页面,网上手机商场产品价格表见正按八折销售,欢迎选购,动态字幕后,27,3FrontPage,用FrontPage制作页面,被连接的页面,产品价格表,28,3FrontPage,用FrontPage制作页面,29,4交互网页的制作,本节内容：4.1交互性标记元素4.2FORM标记元素,30,4.1交互性标记元素,人机对话的表单接口界面,为了在浏览器上看到这个表单界面，就需要使用FORM标记元素。FORM可译作“表单”。,31,4.2FORM标记元素,32,4.2FORM标记元素,当表单提交后，在Web服务器端被处理后将此页面返回给用户。应当指出，HTML的交互性标记元素FORM和INPUT仅仅提供了一个接口界面,要全部实现交互功能，仅靠HTML是不够的。还必须有ASP环境来进行处理(将在下面讲述)。,33,5ASP（动态服务主页）,本节内容：5.1什么是ASP？5.2ASP的工作原理5.3ASP脚本编程,34,5.1什么是ASP？,ASP（ActiveServerPages）是微软公司为它的WEB服务器（互联网信息服务器，简称IIS）开发的一个组件（软件）。它是一种实现动态网页开发技术的服务器端的开发环境。以前面讲的为例:提交后的表单在Web服务器端被处理后页面被返回给用户的过程必须由ASP环境来进行处理。,35,5.1什么是ASP？,通过ASP，我们能够将HTML页面、脚本命令、ASP内置对象和ActiveX组件结合起来，建立动态、交互而又高效的Web应用程序。ASP可利用ADO（ActiveDataObject）方便地访问数据库。,36,5.2ASP的工作原理,ASP文件可以由以下几个部分组成：文本HTML标记ASP脚本命令等。其中ASP脚本命令可以包含：ASP对象ActiveX组件任何脚本语言（如VB脚本所言、JAVA脚本语言等）。ASP脚本命令写在“%”和“%”两个符号之间。,37,5.2ASP的工作原理,ASP文件实例：VB-SCR-EXM.ASP（在两者之间是脚本文件）htmlheadtitle手机市场标题/title/headbody%fori=3to7%Fontsize=%=i%这里是手机市场！BR%next%/body/html,38,5.2ASP的工作原理,运行结果,这里是手机市场！这里是手机市场！这里是手机市场！这里是手机市场！这里是手机市场！,浏览屏幕,39,5.2ASP的工作原理,ASP文件的运行过程,40,5.2ASP的工作原理,怎样做ASP文件？ASP文件的后缀名为ASP，它以文件的形式存放在WEB服务器上。ASP实际是一个纯文本文件，只是它的扩展名固定为.ASP。ASP文件可以使用文本编辑器（如记事本）进行编辑。即将.TXT改为.ASP。ASP文件也可以用WEB编程工具FrontPage来做。,41,5.3ASP脚本编程,ASP脚本命令的内容包括：1.脚本语言可用VBScript写，也可用JAVAScript作为脚本语言。2.ASP内置对象如Request.。3.ActiveX组件ASP支持的ActiveX组件包括ASP服务器本身附带的内置组件和用户自己创建的ASP组件。用户与WEB服务器之间的信息交互通过HTML中的FORM（表单）来实现。,42,5.3ASP脚本编程,ASP环境下处理数据实例(提交)Tijiao.htm请提供以下信息，然后单击提交。姓名：密码：,43,5.3ASP脚本编程,ASP环境下处理数据实例(返回)Fanhui.asp对不起！您的密码不对。,44,6Web数据库,本节内容：6.1数据库管理信息系统6.2Web数据库,45,6.1数据库管理信息系统,数据库管理系统的功能:建立数据库管理数据库实现数据的传送等,46,6.2Web数据库,ASP可利用ADO（ActiveDataObject）方便地访问数据库。Web数据库系统是指以HTML为代表的Web页面（即网页）与位于底层的数据库的集成。数据库管理系统解决Web页面和数据库之间的通信问题开放式数据库连接器ODBCODBC是一种编程接口，它能使应用程序访问支持SQL查询语言的数据库管理系统，实现与各种数据库的通信。SQL查询语言本书第三章已有介绍,47,6.2Web数据库,Web数据库的应用现在有一客户在已知新书代码后希望知道该书的单价和是否有书。客户向WEB服务器发出HTTP请求首先是客户向WEB服务器发出http请求，CX-SEND.ASP程序产生页面用户在屏幕上看到的如图所示,查询输入屏幕,48,6.2Web数据库,从浏览器上调用下列CX-SEND.ASP程序产生的页面，并输入新书代码后提交。欢迎查看新书价格和库存量欢迎查看新书价格和库存量请输入新书代码,49,6.2Web数据库,Web服务器上的ASP软件对此程序进行解释并执行另外一个名为cx-back.asp的程序。欢迎查看新书价格和库存量您查询的新书详单新书代码新书名称,51,6.2Web数据库,单价（元）库存量对不起，没有您要查找的书籍数据！,52,6.2Web数据库,53,6.2Web数据库,查询结果输出屏幕,您查询的新书单价和库存量,54,6.2Web数据库,Web服务器上的ASP软件对程序的解释和执行过程取得用户传来的新书代码（见程序第6行）Web页面与数据库Text.mdb相边接（见程序8-11行）第89行，创建一个Connection对象第10行，是打开连接。第11行，是创建一个记录集对象。用SQL查询数据库（见第1215行）在浏览器上显示出查询结果,55,7ASP的安装,安装IIS若操作系统中还未安装IIS服务器，可打开“控制面板”，然后单击启动“添加/删除程序”，在弹出的对话框中选择“添加/删除Windows组件”，在Windows组件向导对话框中选中“Internet信息服务（IIS）”，然后单击“下一步”，按向导指示，完成对IIS的安装。,56,7ASP的安装,启动和配置Internet信息服务（IIS）如系统中已安装过IIS，则只需重新配置一下：单击Windows开始菜单-程序-管理工具-Internet信息服务（IIS）管理器，即可启动“Internet信息服务”管理工具IIS安装后，系统自动创建了一个默认的Web站点，该站点的主目录默认为C:Inetpubwww.root。用鼠标右键单击“默认Web站点”，在弹出的快捷菜单中选择“属性”，此时就可以打开站点属性设置对话框，在该对话框中，可完成对站点的全部配置。,57,7ASP的安装,设置主页文档单击“文档”标签，可切换到对主页文档的设置页面，主页文档是在浏览器中键入网站域名，而未制定所要访问的网页文件时，系统默认访问的页面文件。IIS默认的主页文档只有default.htm和default.asp，根据需要，利用“添加”和“删除”按钮，可为站点设置所能解析的主页文档。启动与停止IIS服务在Internet信息服务的工具栏中提供有启动与停止服务的功能。单击可启动IIS服务器；单击则停止IIS服务器。,58,本章小结,