1 Web开发技术概述

合集下载

Web前端开发技术 (第3版)储久良1

Web前端开发技术 (第3版)储久良1

3 ftp 4 mailto
文件传输协议 电子邮件地址
5 ldap 6 news 7 file
轻型目录访问协议搜索 Usenet新闻组 当地电脑或网上分享的文件
8 gopher
Internet Gopher Protocol (Internet 查找协议)
教育部高等学校软件工程专业教学指导委员会规划教材
括代码的可维护性、组件的易用性和浏览器兼容性等。
教育部高等学校软件工程专业教学指导委员会规划教材
第1章 Web前端开发技术综述
Page: 11
Web前端开发技术-HTML5、CSS3、JavaScript
1.3 Web前端开发技术
1.3.1 HTML HTML是SGML(Standard Generalized Markup
教育部高等学校软件工程专业教学指导委员会规划教材
第1章 Web前端开发技术综述
Page: 10
1.2 Web前端开发工程师职业需求
Web前端开发技术-HTML5、CSS3、JavaScript
我国互联网行业的发展呈现迅猛的增长势头,对网站开发、 设计制作的人才需求随之大量增加。前端开发和后台开发人员的 比例为1:1,而在我国目前依旧在1:3以下,人才缺口较大。
Language,标准通用标记语言)下的一个应用(也称为一个子集) ,也是一种标准规范,它通过标记符号来标记要显示的网页中的 各个部分。而SGML是一种定义电子文档结构和描述其内容的国 际标准语言,是所有电子文档标记语言的起源。
HTML是构成Web页面(Page)的基础。 HTML文档:用来描述网页,由HTML 标记和纯文本构成文 本文件。不同于纯文本文件(不含HTML标记)。
协议类型://服务器地址(端口号)/ 路径/文件名 http://info.cern.ch/www20/0002 /kexuetansuo_1 2385/index.shtml

第1章_Web数据库技术概述

第1章_Web数据库技术概述

模型1:JSP+JavaBean阶段

把业务处理代码从JSP中提取出来,然后形成 JavaBean;JSP完成输入、输出和控制功能; 需要的时候JSP调用JavaBean的功能。
JSP页面
JavaBean
优点:处理功能从JSP页面中分离出来,由 JavaBean完成,减少了页面中的代码。 缺点:页面中仍然存在用于控制的代码。
Java企业级应用架构
Java Web技术的发展历史

Servlet技术 JSP技术 模型1:JSP+JavaBean 模型2:JSP+JavaBean+Servlet 框架 可视化开发
Servlet技术阶段

Java技术中最早的Web解决方案,页面中的所 有信息需要通过输出语句来生成。
基于Java的Web数据库访问技术 Java Applet:将Java 小程序(Applet)从服务 器端下载到客户端Web浏览器中执行,通过 JDBC驱动程序访问服务器端的数据库。 Java servlet:Java Servlet是运行于Web服务器 端的小程序,其作用类似于CGI程序,但比 CGI程程序的效率更高。利用Java Servlet可以 实现网页中很多交互式效果,在动态网页设计 中具有广泛应用。用户通过Web浏览器访问服 务器端的Java servlet程序,Java servlet负责实 现对数据库的访问,并动态生成HTML格式的 结果文件,交给Web浏览器显示。
--Servlet技术:用于系统流程控制。 -- JavaBean技术:完成核心功能,是一个比较特 殊的Java类,编写方法与普通Java类相同。 --JDBC技术:Java访问数据库的中间件,完成与 数据库的交互。 --XML技术: Java Web应用中的配置文件采用 XML文件的形式,另外JSP页面也可以采用 XML文档的形式。

web-第1章基本概念

web-第1章基本概念

④ XML (Extensible Markup Language,可扩展的标记语言) 是一套定义语义标记的规则,描述的是数据的实际内容,不描述数据显示方式。 应用XML制作页面的基本思想是:将内容与内容的显示方式分别定义,以使内容组织人员将精力集中于内 容本身。
⑤ XHTML (The Extensible Hyper Text Markup Language,可扩展超文本标记语言) 实际上是HTML向XML过渡过程中产生的一种标签语言。结合了HTML和XML的优点,由于它和HTML 很相似,所以可以很容易把以前的HTML进行简化和改装,形成新的XHTML文档,这要比直接重新构建 XML文档简单的多。
2. 获取动态网页过程
① 客户端动态网页
JavaScript+DOM+CSS实现动态网页 微软的ActiveX技术 Sun的Java Applet技术 MicroMedia Flash技术
② 服务器端动态页面
• 简单的讲是服务器需要执行相关代码才能返回的页面。 • 动态内容能够为单个用户的每次访问量身定制的内容。 • 动态网页允许双向的交流。
JavaScript是由 Netscape公司开发的一种脚本语言,借助JavaScript等脚本语言,可以在Web页面实现客户 端与服务器的动态交互。
JavaScript短小精悍,又是在客户机上执行,大大提高了网页的浏览速度和交互能力。它是专门为制作Web 页面而量身定做的一种简单的编程语言,如今JavaScript越来越广泛地使用于Web开发上。Jquery是辅助 JavaScript开发的库。
Java
Java是Sun Microsystems公司于1995年5月推出的程序设计语言(Java语言)和Java平台的总称。它最初 的名字是Oak,被设计用来在嵌入式系统中运行,后来被用做了基于Web的技术。

JAVA教案(WEB)1

JAVA教案(WEB)1

Web服务器 Web服务器
WebLogic下载地址 下载地址 8.X 英文版 /pub/platform/81/platform815_win32.exe /pub/platform/81/platform815_linux32.bin (linux) 中文版 /pub/platform/81/platform812_zh_CN_win32.exe /pub/platform/81/platform814_zh_CN_win32.exe /pub/platform/81/platform815_zh_CN_win32.exe /pub/platform/81/platform815_zh_CN_hpux32.bin (hp_unix) 9.X 英文版 /pub/platform/90/server900_win32.exe /pub/platform/90/server900_linux32.bin 中文版 /pub/platform/90/server900_zh_CN_win32.exe /pub/platform/90/server900_zh_CN_hpux32.bin (hp_uxix /pub/platform/90/server900_zh_CN_solaris32.bin (Solaris(8\9\ 10)版) 版 /pub/platform/91/server910_win32.exe /pub/platform/91/server910_linux32.bin (linux) /pub/platform/91/server910_hpux32.bin (hpux) /pub/platform/91/server910_solaris32.bin (solaris)
WEB应用开发 第一章 WEB基础和Servlet

第一章Web技术概述

第一章Web技术概述

13.通道(Tunnel):是作为两个连接中继的中介程序。一旦激活,通道 便被认为不属于HTTP通讯,尽管通道可能是被一个HTTP请求初始化的。 当被中继的连接两端关闭时,通道便消失。当一个门户(Portal)必须存 在或中介(Intermediary)不能解释中继的通讯时通道被经常使用。
14.缓存(Cache):反应信息的局域存储。
Internet(Inter Network)译为“因特网”, 也称国际互 联网,简称互联网。因特网是一个把世界范围内的众多计算 机、人、数据库、软件和文件连接在一起的,通过一个共同 的通信协议(TCP/IP协议)相互会话的网络。
14
Web技术基础
Internet主要技术: ·采用标准协议——TCP/IP协议,使网上各种不同的 计算机进行通信 ·通过路由器将不同网络互连 ·建立在TCP/IP协议基础之上的WWW浏览服务 ·应用DNS域名解析系统完成计算机和用户之间的地 址解析工作
网络病毒、保密、黑客(Huckman)
16
路由器 路由器
R
校园网子网
校园网
R
路由器 路由器
电子商务网站
R R
路由器
路由器
Internet
具有上网功能的手机 PDA掌上电脑 卫星接收系统
路由器
路由器
ISP网络
R R
路由器
路由器
企业子网
路由器
路由器
R
企业网
R
个人电脑
17
WWW的核心-HTTP
HTTP协议简介
20
10.源服务器(Originserver):是一个给定资源可以在其上驻留或被创 建的服务器。
11.代理(Proxy):一个中间程序,它可以充当一个服务器,也可以充当 一个客户机,为其它客户机建立请求。请求是通过可能的翻译在内部或 经过传递到其它的服务器中。一个代理在发送请求信息之前,必须解释 并且如果可能重写它。

1-1 ASP简介

1-1 ASP简介
WEB开发技术 WEB开发技术 第一章
信息工程系
本章内容与教学安排
1.1 Web的基本概念及相关知识 1.2 ASP运行与开发环境 1.3 简单的ASP程序
课程引入与回顾
• HTML • 静态页面
目标
• • • • • • • 了解静态页面与动态页面的工作原理 了解表单及控件的用法 了解目前几中动态网页技术 开发运行环境 制作一个简单的ASP网页 ASP的简单语法 ASP的注意事项
总结
• • • • • 了解静态页面与动态页面的工作原理 ASP的开发、运行环境 制作一个简单的ASP网页 ASP的简单语法 ASP的注意事项
习题与作业
• 调试成功ASP的运行环境。 • 编写一个简单页面,在其中显示来访日期 和时间
– (提示:日期date() 时间time())
ASP的运行环境 的运行环境
• • • • 服务器端 Windows 2000 +IIS(Internet服务管理器) Windows XP +IIS(Internet服务管理器) Windows 98 + PWS4.0(个人WEB服务器)
• 对于普通学习者,可以将自己的计算机当作服务 器。
安装IIS--1 安装
EditPlus
• 下载地址,我的网络课堂。 • 解压缩后运行安装程序 • 启动程序
制作一个简单的ASP文件 文件 制作一个简单的
• • • • 新建ASP文件 保存ASP文件 浏览ASP文件 修改ASP文件
新建ASP文件 文件 新建
• 打开EditPlus或者记事本,输入以下内容
保存ASP文件 文件 保存
C/S模式与 模式与B/S模式 模式与 模式
B/S模式与 B/S模式与C/S模式比较 模式与C/S模式比较

1 Web开发技术概述

1 Web开发技术概述
24-32
网页制作工具
Fireworks也是由Macromedia公司开发的一种工 具。它以处理网页图片为特长,并可以轻松创作 GIF动画。它的出现使Web作图发生了革命性的变 化。Fireworks是专为网络图像设计而开发,内 建丰富的支持网络出版功能,比如Fireworks能 够自动切图、生成鼠标动态感应的javascript。 而且Fireworks 具有十分强大的动画功能和一个 几乎完美的网络图像生成器(Export功能)。它增 强了与Dreamweaver的联系,可以导出为配合CSS 式样的网页及图片。
B/S模式是一种基于Web的协同计算模式,是一种 三层架构的瘦客户机/肥服务器的计算模式。第 一层为客户端表示层,与C/S结构中的“肥”客 户端不同,三层架构中的客户层只保留一个Web 浏览器,不存放任何应用程序,其运行代码可以 从位于第二层Web服务器下载到本地的浏览器中 执行,几乎不需要任何管理工作。第二层是应用 服务器层,由一台或多台服务器(Web服务器也 位于这一层)组成,处理应用中的所有业务逻辑 ,包括对数据库的访问等工作,该层具有良好的 可扩充性,可以随着应用的需要任意增加服务的 数目。第三层是数据中心层,主要由数据库系统 组成。
2-32
第1章 Web开发技术概述
1.掌握Web的基本概念和基础知识。 2.熟悉C/S模式与B/S模式的结构。 3.了解常用的Web开发工具。 4.了解Web开发的基本技术。 5. 了解Web 2.0的特点及相关技术。
3-32
Web开发技术概述
互联网的快速发展对人们的工作、学习和生活带 来了重大影响。人们利用互联网的主要方式就是 通过浏览器访问网站,以便处理数据、获取信息 。当人们通过浏览器打开各式各样的网站进行信 息处理、享受互联网带给人们巨大便利的同时, 好奇的读者也许非常想知道其背后所隐藏的所有 实现技术。涉及到的技术是多方面的,包括网络 技术、数据库技术、面向对象技术、图形图像处 理技术、多媒体技术、网络和信息安全技术、互 联网技术、Web开发技术等等。其中Web开发技术 是互联网应用中最为关键技术之一。

第1章 Web前端开发基础-Web前端开发-刘敏娜-清华大学出版社

第1章 Web前端开发基础-Web前端开发-刘敏娜-清华大学出版社

1.4 Web页面在地址栏中输入要访问的网 页的url,通过http协议向url 所在的服务器发起服务请求
服务处理请求
根据浏览器发起的请求,把 url地址转换成网页所在服务 器上的实际路径,找到相应 的网页文件
3
反馈网页
网页中仅包含html标记,服 务器直接通过http协议将文 档发送到客户端,如果还包 括jsp程序或者其他动态网站 程序,则通过服务器执行后 将运行结果发送给客户端
3
1.1 web介绍
Web起源
WWW的开发阶段 WWW的发展阶段 WWW商业化阶段 无所不在的WWW
Web版本
Web 1.0 Web 2.0 Web 3.0
4
Web前端开发基础 Contents
1 Web介绍 2 Web开发 3 Web基本概念 4 Web页面浏览过程 5 Web前端开发技术 6 主流Web浏览器 7 Web前端开发流程 8 Web前端开发工具 9 Web前端工程师从业要求 10 网站鉴赏能力培养
Web也称万维网。Web的英文全称是“World Wide Web”,简称 WWW。 Web是基于“超文本”的信息查询和发布系统。万维网将Internet 上众多的Web服务器提供的资源连接起来,组成一个海量的信 息网。 Web是英国的TimBerners-Lee 1980年在欧洲共同体的一个大型 科研机构任职时发明的。 通过Web平台,互联网上的资源在一个网页里展示出来,而且 资源之间可以建立链接。
4
客户端显示网页
浏览器解释html文档,将结 果显示在客户端浏览器
1
2
3
4
10
Web前端开发基础 Contents
1 Web介绍
2 Web开发 3 Web基本概念 4 Web页面浏览过程 5 Web前端开发技术 6 主流Web浏览器 7 Web前端开发流程 8 Web前端开发工具 9 Web前端工程师从业要求 10 网站鉴赏能力培养
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

什么是Web页面?
统一资源定位符URL

信息资源放在Web服务器之后,需要将它的地址 告诉给用户,以便让用户来访问,这就是统一资 源定位符URL(Uniform Resource Locators) 的功能,俗称为网址。URL字串分成三个部分: 协议名称、主机名和文件名(包含路径)。协议 名称通常为http、Ftp、File等,例如: /index.htm为一 个URL地址,其中http指的是采用的传输协议是 http;为主机名; index.htm为文件名。
什么是Web ?



Internet是一个网络上的网络,或者说是一个全球 范围的网间网。在Internet中分布了成千上万的计 算机,这些计算机扮演的角色和所起的作用各不相 同。 有的计算机可以收发电子邮件,有的可以为用户传 输文件,有的负责对域名进行解析,更多的机器则 用于组织并展示相关的信息资源,方便用户的获取。 所有这些承担服务任务的计算机统称为服务器。 根据服务的特点,又可分为邮件服务器、文件传输 服务器、域名服务器(DNS)和Web服务器等。 Web就由互联网上的上述各种各样的服务器相互连 接组成。
C/S模式与B/S模式


C/S(Client/Server)结构,即大家熟知的客户 机和服务器结构。它是软件系统体系结构,通过 它可以充分利用两端硬件环境的优势,将任务合 理分配到Client端和Server端来实现,降低了系 统的通讯开销。 传统的C/S体系结构虽然采用的是开放模式,但 这只是系统开发一级的开放性,在特定的应用中 无论是Client端还是Server端都还需要特定的软 件支持。由于没能提供用户真正期望的开放环境, C/S结构的软件需要针对不同的操作系统系统开 发不同版本的软件,加之产品的更新换代十分快, 已经很难适应百台电脑以上局域网用户同时使用。 而且代价高,效率低。
C/S模式与B/S模式


Hale Waihona Puke 以目前的技术看,局域网建立B/S结构的网络应 用,并通过Internet/Intranet模式下数据库应用, 相对易于把握、成本也是较低的。 它是一次性到位的开发,能实现不同的人员,从 不同的地点,以不同的接入方式(比如 LAN,WAN,Internet/Intranet等)访问和操作 共同的数据库; 它能有效地保护数据平台和管理访问权限,服务 器数据库也很安全。特别是在C#、JAVA这样的 跨平台语言出现之后,B/S架构管理软件更是方 便、快捷、高效。
WEB系统开发
管理与经济学院 齐峰 Email:qfgljjxy@ QQ:85483586
第1章 Web开发技术概述
学习要点


1.掌握Web的基本概念和基础知识。 2.熟悉C/S模式与B/S模式的结构。 3.了解常用的Web开发工具。 4.了解Web开发的基本技术。
Web开发技术概述



互联网的快速发展对人们的工作、学习和生活带来 了重大影响。人们利用互联网的主要方式就是通过 浏览器访问网站,以便处理数据、获取信息。 当人们通过浏览器打开各式各样的网站进行信息处 理、享受互联网带给人们巨大便利的同时,好奇的 读者也许非常想知道其背后所隐藏的所有实现技术。 涉及到的技术是多方面的,包括网络技术、数据库 技术、面向对象技术、图形图像处理技术、多媒体 技术、网络和信息安全技术、互联网技术、Web开 发技术等等。其中Web开发技术是互联网应用中最 为关键技术之一。
网页制作工具

Fireworks也是由Macromedia公司开发的一种 工具。它以处理网页图片为特长,并可以轻松创 作GIF动画。它的出现使Web作图发生了革命性 的变化。Fireworks是专为网络图像设计而开发, 内建丰富的支持网络出版功能,比如Fireworks 能够自动切图、生成鼠标动态感应的javascript。 而且Fireworks 具有十分强大的动画功能和一个 几乎完美的网络图像生成器(Export功能)。它增 强了与Dreamweaver的联系,可以导出为配合 CSS式样的网页及图片。
Web开发平台的组成

Java EE开发平台 Java EE(Java ENTERPRISE EDITION)是纯 粹基于Java的解决方案,之前较低版本叫做J2EE。 1998年SUN发布了EJB 1.0标准,EJB为企业级 应用中必不可少的数据封装、事务处理、交易控 制等功能提供了良好的技术基础。J2EE平台的三 大核心技术SERVLET、JSP和EJB都已先后问世。 1999年,SUN正式发布了J2EE的第一个版本。 紧接着,遵循J2EE标准,为企业级应用提供支撑 平台的各类应用服务软件争先恐后地涌现了出来。 IBM的WebSphere、BEA的WebLogic都是这一 领域里最为成功的商业软件平台。
C/S模式与B/S模式



第一层为客户端表示层,与C/S结构中的“肥”客 户端不同,三层架构中的客户层只保留一个Web浏 览器,不存放任何应用程序,其运行代码可以从 位于第二层Web服务器下载到本地的浏览器中执行, 几乎不需要任何管理工作。 第二层是应用服务器层,由一台或多台服务器 (Web服务器也位于这一层)组成,处理应用中的 所有业务逻辑,包括对数据库的访问等工作,该 层具有良好的可扩充性,可以随着应用的需要任 意增加服务的数目。 第三层是数据中心层,主要由数据库系统组成。
什么是Web服务器?


Web服务器又称WWW服务器、网站服务器、站点 服务器,就是将本地的信息用超文本(Hypertext) 组织,为用户在Internet上搜索和浏览信息提供服 务。 从本质上来说Web服务器实际上就是一个软件系统。 一台计算机可以充当多个Web服务器,为提高用户 的访问效率,一般情况下一台计算机只充当一个 Web服务器;为提供大量用户的访问,多台计算机 可以形成集群,只提供一个Web服务。平常,我们 将只充当一个Web服务器的一台计算机就叫做Web 服务器。
C/S模式与B/S模式

B/S模式的结构如图1-4所示。
图1-4 B/S模式结构
C/S模式与B/S模式


C/S和B/S是当今世界开发模式技术架构的 两大主流技术。C/S是美国Borland公司最 早研发,B/S是美国微软公司研发。 目前,这两项技术以被世界各国所掌握,国 内公司以C/S和B/S技术开发出产品也很多。 这两种技术都有自己一定的市场份额和客户 群,各家企业都说自己的管理软件架构技术 功能强大、先进、方便,都能举出各自的客 户群体,都有一大群文人墨客为自己摇旗呐 喊,广告满天飞,可谓仁者见仁,智者见智。
统一资源定位符URL


URL地址有相对地址和绝对地址之分。用浏览器进 行浏览页面内容时,手工输入的URL地址只能为绝 对地址,相对地址用于网页文档内部的链接地址。 假定Web服务器的主目录为d:\jfhb,存在文件 index.htm,其下有一个子目录web,存在文件 a.htm 则“/web/a.htm”表示相对URL地址,等 同于“http://219.153.14.22/web/a.htm”; a.htm文档中若存在“../index.htm”,则表示链 接上一级目录下的文件index.htm,也是URL相对 地址。
网页制作工具
1.Sausage HotDog Professional HotDog是较早基于代码的网页设计工具, 支持最新的Web标准和扩展,其最具特色 的是提供了许多向导工具,能帮助设计者 制作页面中的复杂部分。 HotDog是个功能强大的软件,对于那些希 望在网页中加入CSS、Java、RealVideo 等复杂技术的高级设计者,是个很好的选 择。
浏览器的工作机理及种类


当用户要通过浏览器访问某一个网站,用户必须首 先在浏览器的地址栏中输入相应的网址——我们称 之为URL地址,接着浏览器将向域名服务器询问该网 址对应的IP地址,并根据返回的结果直接定位到目 标服务器; 服务器与浏览器双方完成通讯握手之后,该网站对 应的图文数据便被送到浏览器中。如果收到的是 HTML代码和图片,浏览器对其进行解释之后形成页 面显示,而如果遇到扩展名为ASP、CGI之类的脚本 程序,解释工作就必须由服务器来完成,浏览器只 能被动接收解释的结果并加以显示;当然,如果在 结果中遇到HTML标记,浏览器就会启动解释程序, 然后按HTML标记的要求将网页的内容显示在用户面 前。
C/S模式与B/S模式

C/S模式的结构如图1-3所示 :
C/S模式与B/S模式

B/S(Browser/Server)结构即浏览器和服务 器结构。它是随着Internet技术的兴起,对 C/S结构的一种变化或者改进的结构。在这种 结构下,用户工作界面是通过WWW浏览器来实 现,极少部分事务逻辑在前端(Browser)实 现,但是主要事务逻辑在服务器端(Server) 实现,形成所谓三层结构。这样就大大简化 了客户端电脑载荷,减轻了系统维护与升级 的成本和工作量,降低了用户的总体成本 (TCO)
第1章 Web开发技术概述

1.1 Web技术基础知识

1.2 Web基本技术介绍
1.1 Web技术基础知识



1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.6 1.1.7 1.1.8 1.1.9
什么是Web? 什么是Web服务器? 什么是Web页面? 统一资源定位符URL 浏览器的工作机理及种类 C/S模式与B/S模式 Web访问的机理 Web开发平台的组成 常用Web开发工具
浏览器的工作机理及种类
浏览器的工作机理及种类
浏览器主要分成两类: 一类是以Lynx为代表基于字符的Web客户端程序, 纯文字网页浏览器。主要在不具备图形图像功能的 计算机上使用。 另一类是以NCSA(National Center of Supercomputing Application国家超级计算机应 用中心 )开发的Mosaic为代表的、面向多媒体计 算机的Web客户端程序,它可以在各种类型的小型 机上运行,也可以在IBM PC机、Macintosh机以 及UNIX操作系统平台上运行。
相关文档
最新文档