第章Web开发的基本技术ppt课件.ppt

1 第四章Web开发的基本技术 主要内容 WWW WorldWideWeb HTMLFrontpageASP 动态服务主页 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服务 protocolFTP服务执行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协议进行传输的 其中 http 是协议类型 这里是检索文挡的超文本传输协议 是服务器的主机域名 的后面是路径或文件名 hit是哈工大的代号 我们把称为是哈工大的www服务器的URL 统一资源定位器 其英文形式是UniformResourceLocators 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制作页面 主页面 网上手机商场产品价格表见http 正按八折销售 欢迎选购 动态字幕后 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 在两者之间是脚本文件 html head title 手机市场标题 title head body 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的程序 欢迎查看新书价格和库存量 Setconn Server CreateObject ADODB Connection DBPath Server MapPath tsxt mdb 50 6 2Web数据库 conn Open driver MicrosoftAccessDriver mdb dbq DBPathSetrs Server CreateObject ADODB Recordset sql select fromtsxt sql sql whereidlike id conn executesqlrs opensql conn 1 3 您查询的新书详单新书代码新书名称 51 6 2Web数据库 单价 元 库存量对不起 没有您要查找的书籍数据 52 6 2Web数据库 53 6 2Web数据库 查询结果输出屏幕 您查询的新书单价和库存量 54 6 2Web数据库 Web服务器上的ASP软件对程序的解释和执行过程取得用户传来的新书代码 见程序第6行 Web页面与数据库Text mdb相边接 见程序8 11行 第8 9行 创建一个Connection对象第10行 是打开连接 第11行 是创建一个记录集对象 用SQL查询数据库 见第12 15行 在浏览器上显示出查询结果 55 7ASP的安装 安装IIS若操作系统中还未安装IIS服务器 可打开 控制面板 然后单击启动 添加 删除程序 在弹出的对话框中选择 添加 删除Windows组件 在Windows组件向导对话框中选中 Internet信息服务 IIS 然后单击 下一步 按向导指示 完成对IIS的安装 56 7ASP的安装 启动和配置Internet信息服务 IIS 如系统中已安装过IIS 则只需重新配置一下 单击Windows开始菜单 程序 管理工具 Internet信息服务 IIS 管理器 即可启动 Internet信息服务 管理工具IIS安装后 系统自动创建了一个默认的Web站点 该站点的主目录默认为C Inetpub 用鼠标右键单击 默认Web站点 在弹出的快捷菜单中选择 属性