人机交互与界面设计_第2章资料

《人机交互与界面设计》第2章Web应用基础2020/2/251《人机交互与界面设计》内容2.1什么是Web2.2Web的工作原理2.3Internet网络协议2.4IP地址、域名和URL2.5动态网页设计技术简介2020/2/252《人机交互与界面设计》2.1什么是Web•Web–全称为WorldWideWeb，缩写为。也称环球网、万维网、全球信息网等。•Web是一种体系结构，通过它可以访问分布于Internet主机上的链接文档。它有如下几层含义：–Web是Internet提供的一种服务。–Web不是Internet，Web是基于Internet、采用Internet协议的一种体系结构。–Web是存储在全世界Internet计算机中、数量巨大的文档的集合。–Web上的海量信息是由彼此关联的页面（Page）组成的。2020/2/253《人机交互与界面设计》2.1什么是Web–Web的内容保存在Web站点（Web服务器）中，用户可通过浏览器访问Web站点。–Web以一些简单的操作方式（如单击鼠标）连接全球范围的超媒体信息。2020/2/254《人机交互与界面设计》2.1什么是Web•几个概念：–超链接（hyperlink）：是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。–超文本（hypertext）：用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本。–超媒体（hypermedia）：超媒体是超文本和多媒体在信息浏览环境下的结合。用户可以通过链接激活一段声音，显示一个图形，甚至播放一段动画。2020/2/255《人机交互与界面设计》2.1什么是WebWeb的特点:（1）Web是一种超文本信息系统。（2）Web是图形化的和易于导航的。（3）Web与平台无关。（4）Web是分布式的。（5）Web具有新闻性。（6）Web是动态的、交互的。2020/2/256《人机交互与界面设计》2.2Web的工作原理•浏览器/服务器（Browser/Server，B/S）结构–客户端浏览器–浏览器是一种特定格式的文档阅读器，能根据网页内容对网页中的标记进行解释显示，并执行网页中包含的客户端脚本程序。–Web服务器–指安装了Web服务程序的计算机；–指Web服务器程序，可以管理各种Web文件，并为提出HTTP请求的浏览器提供响应。–数据库服务器2020/2/257Web的基本工作原理图《人机交互与界面设计》2.2Web的工作原理•客户机/服务器（Client/Server，C/S）结构–客户机–服务器•Web服务器的配置–配置服务器操作系统UNIX、WindowsServer、Linux等网络操作系统–安装专门的信息服务器程序IIS（InternetInformationServer）、Apache等2020/2/258《人机交互与界面设计》Web服务器提供服务的过程：用户在浏览器中输入一个网址，浏览器便向该网址所指向的Web服务器发出请求。Web服务器接到浏览器的请求后，把网址转换成页面所在服务器的文件路径名。如果网址指向的是普通的HTML文档，Web服务器将直接把它传送给浏览器。HTML文档中可能包含用Java、JavaScript、ActiveX、VBScript等编写的程序，服务器也将它们随HTML文档一起传送到浏览器，在浏览器所在的机器上执行。如果HTML文档中嵌有ASP程序，那么Web服务器就运行ASP程序，并将结果返回给浏览器。2020/2/2592.2Web的工作原理《人机交互与界面设计》•客户端编程–客户端编程就是客户端浏览器下载服务器上的程序来执行有关动态服务工作。–程序员把客户端代码编写到HTML文件中。–当用户提出对某个网页的请求时，这些客户端代码和HTML文件代码一起返回提出请求的浏览器。–程序在客户端浏览器上执行。•常见的客户端编程技术–VBScript–JavaScript–Javaapplet等。2020/2/25102.2Web的工作原理《人机交互与界面设计》•服务器端编程–程序员将编写的代码保存在服务器上。–当用户提出对某个网页的请求时，这个请求所要访问的页面代码都在服务器端执行，并把执行结果以HTML文件代码的形式传回浏览器，这样浏览器接收的只是程序执行的结果。•常见的服务器端编程技术–PHP–JSP–ASP–ASP.NET2020/2/25112.2Web的工作原理《人机交互与界面设计》2.3Internet网络协议TCP/IP协议•TCP/IP协议是一个协议集，其中最重要的是TCP（TransmissionControlProtocol）协议和IP（InternetProtocol）协议。•TCP/IP参考模型与OSI参考模型的对照2020/2/2512《人机交互与界面设计》2.3Internet网络协议TCP/IP协议采用的通信方式是分包交换方式。所谓分包交换即是数据在传输时要分成若干段，每个数据段称为一个分包（packet）。TCP/IP的基本传输单位是数据报（datagram）。可以把数据看成是一封长信，分装在几个信封中邮寄出去。TCP/IP协议实际上主要包括两个最主要的协议，即TCP协议和IP协议。13《人机交互与界面设计》2.3Internet网络协议TCP/IP协议的数据传输过程：首先由TCP协议把数据分成若干数据报，给每个数据报加上一个TCP信封（即报头），上面写着数据报的编号，以便在接收端把数据还原成原来的格式。IP协议把每个TCP信封再套上一个IP信封，在上面写上接收主机的地址。一旦准备好IP信封就可以在物理网上传送数据了。14《人机交互与界面设计》2.3Internet网络协议这些IP信封可以通过不同的传输途径（路由）进行传输。由于路径不同，再加上其他以外的原因，可能出现顺序颠倒、数据丢失、数据失真等现象。这些问题都由TCP协议来处理，它具有检查和处理错误的功能，必要时还可以请求发送方重发。简言之，IP协议负责数据的传输，而TCP协议负责数据传输的可靠传输。15《人机交互与界面设计》2.3Internet网络协议HTTP协议•HTTP（HyperTextTransferProtocol）–专门为Web设计的协议–应用层协议–以TCP/IP协议集中的其他协议为基础–Web浏览器和服务器用HTTP协议来传输Web文档–HTTP基于客户端请求、服务器响应的工作模式•Web事务处理的步骤–客户端与服务器建立连接；–客户端向服务器提出请求；–如果请求被接受，则服务器送回响应，在响应中包括状态码和所需的文件；–客户端和服务器断开连接。2020/2/2516《人机交互与界面设计》•作用：使用户主机连入Internet上的Telnet服务器（称为远程主机）。•连接成功后，用户主机就成为该远程主机的一个终端，可以访问远程主机上的信息或运行远程主机上的程序。•用户使用远程主机的两种情况：•需要账号才能登录•不需要账号即可登录（开放式的）远程登录协议Telnet2.3Internet网络协议2020/2/2517《人机交互与界面设计》文件传输协议FTP•FTP（FileTransferProtocol）是一个客户-服务器协议，用于在两台计算机之间传输文件。•FTP既是一种文件传输协议，也是一种服务。提供FTP服务的设施叫做FTP服务器。•匿名FTP服务器−用户无须拥有口令和用户名就能与匿名FTP服务器实现连接并复制文件。2.3Internet网络协议2020/2/2518《人机交互与界面设计》2.4IP地址、域名和URL2.4.1IP地址•IP地址是识别Internet中主机及网络设备的唯一标识。•每个IP地址长度为4B（字节），共32位•IP地址由两部分组成：−网络地址−主机地址•点分十进制记法：−由4个用“.”分隔的十进制数组成−每个数不大于255−如20219.106.2532020/2/2519《人机交互与界面设计》•IP地址可分成5类，其中常用的是如下3类：•A类：用于规模很大、主机数目非常多的网络。A类地址允许组成126个网络，每个网络可包含1700万台主机。•B类：用于中型和大型网络。B类地址允许组成16384个网络，每个网络可包含65000台主机。•C类：用于小型本地网络（LAN）。2.4.1IP地址2.4IP地址、域名和URL2020/2/2520《人机交互与界面设计》net-id24位host-id24位net-id16位net-id8位IP地址中的网络号字段和主机号字段0A类地址host-id16位B类地址C类地址011host-id8位D类地址1110多播地址E类地址保留为今后使用111101《人机交互与界面设计》•TCP/IP协议中提供了域名服务系统（DNS），允许为主机分配字符名称，即域名。•域名不仅便于记忆，而且即使在IP地址发生变化的情况下，通过改变解析对应关系，域名仍可保持不变。•在网络通信时由DNS自动实现域名与IP地址的转换。•域是名字空间中一个可被管理的划分，域还可以继续划分为子域，如二级域、三级域等。•Internet中的域名采用分级命名，其基本结构如下：….三级域名.二级域名.顶级域名2.4.2域名2.4IP地址、域名和URL2020/2/2522《人机交互与界面设计》2.4IP地址、域名和URL域名的命名机制一个域名可由几个部分（子域名）组成，按照从自身向上至顶层域的路径命名，中间用圆点“.”分隔。每个子域名都有其特定的含义。其中最重要的顶级域在右边，最左边是主机名，中间为子域名。从右到左，子域名分别表示不同地区或国家名称、组织类型、组织名称、分组织名称和计算机名称等。如：ncti.nwpu.edu.cn其中：cn：中国edu：教育机构nwpu：一个学校的名称ncti：该学校中一个系或研究所的名称《人机交互与界面设计》2.4IP地址、域名和URL域名的定义:域名是层次化的，成树状结构（倒挂树），名称的最右边节点在树的上层，左边节点则在下层。其结构为：根在根下的顶级（top）域名在某个顶级域名下的第二级域名在某个第二级域名下的第三级域名叶：主机域名robotyalecsenglindaai根一般域名国家域名intcomedugovmilorgnetjp……uscnsunengeduuestcmail《人机交互与界面设计》常用根区域名称及说明根区域名称所属组织或单位EDU教育学术及研究机构COM商业团体与组织GOV官方政府单位MIL国防军事单位ORG财团法人、基金会等非官方机构NET网络管理服务机构INT国际性组织《人机交互与界面设计》2.4IP地址、域名和URL2.4.3统一资源定位器URL定义：统一资源定位器URL（UniformResourceLocator）就是我们常说的“网址”或URL地址。URL可以看成是一个指针，用来指定因特网上的一个具体的网络空间，使得用户可以用一个统一的方法去寻找和存取Web上的信息资源。包括的信息：①怎样去检索文档；②从哪台计算机上检索；③在哪台计算机上哪个文件夹（路径）可找到需要的文档；《人机交互与界面设计》•统一资源定位器URL的格式如下：信息服务类型://信息资源地址/文件路径–信息服务类型是指Internet的协议名，包括ftp（文件传输协议）、http（超文本传输协议）等。–信息资源地址指定一个网络主机的域名或IP地址。–在有些情况下，主机域名后还要加上端口号，域名与端口号之间用冒号（:）隔开。–一般情况下，服务器程序采用标准的保留端口号，因此在URL输入中可省略它们。2.4.3统一资源定位器URL2.4IP地址、域名和URL2020/2/2527《人机交互与界面设计》以下是一些URL的例子：://odysseus.circe