时我们经常看到各种容器名称:Servlet容器、WEB容器、Java WEB容器、Java EE容器等,还有各种服务器名称:应用服务器、WEB服务器、WEB应用服务器、JavaWEB应用服务器、Java EE服务器等,这么多相似名称,难以弄明白它们之间的区别与联系。
1、容器与服务器的联系
容器是位于应用程序/组件和服务器平台之间的接口集合,使得应用程序/组件可以方便部署到服务器上运行。
2、各种容器的区别/联系
2-1、容器(Containers)
容器通常理解就是装东西的,我们这里说技术上的容器就是可以部署应用程序,并在上面运行的环境。
一般来说,它处理屏蔽了服务器平台的复杂性,使得应用程序在它的基础上可以方便快捷的部署;而对于应用程序来说,它就是位于应用程序和平台之间的接口集合。
容器管理组件的生命周期,向应用程序组件分派请求,并提供与上下文数据(如关于当前请求的信息)的接口。
2-2、Servlet容器
Servlet:属于Java EE重要技术规范,构建了"接收请求--调用servlet程序处理--返回响应"基本模型。
Servlet程序:Java提供了开发Servlet程序的API,该API可以说Servlet容器的一部分,它对接应用程序与Servlet容器;
Servlet容器:就是实现了Servlet技术规范的部署环境,它可以部署运行Servlet程序。
2-3、Java WEB容器
WEB容器:可以部署多个WEB应用程序的环境。
Java WEB容器:实现了Java EE规定的WEB应用技术规范的的部署环境。
Java EE WEB应用技术规范:Servlet、JSP(JavaServer Pages)、Java WebSocket等。
所以,完整的Java WEB容器包含Servlet容器。
2-4、Java EE容器
Java EE容器:实现了Java EE技术规范的部署环境。
Java EE技术规范:除了上面说的Servlet、JSP等Java EE WEB应用技术规范,还包括EJB(Enterprise JavaBeans)等许多技术规范。
所以,完整的Java EE容器包含Java WEB容器(Servlet容器)、EJB容器等。
3、各种服务器的区别/联系
3-1、服务器(Server)
服务器是提供计算服务的设备。由于服务器需要响应服务请求,并进行处理,因此一般来说服务器应具备承担服务并且保障服务的能力。
简单来说,服务器是提供某些服务的设备。
3-2、应用服务器
应用程序:是指为针对使用者的某种应用目的所编写的软件。
应用服务器:就是运行应用程序,提供应用程序所实现服务的设备。
通常来说,服务器端的应用程序实现各种业务逻辑,应用服务器通过各种协议把这些业务逻辑曝露给客户端的程序。它提供了访问商业逻辑的途径,以供客户端应用程序使用。应用服务器使用此业务逻辑就像调用对象的一个方法一样。
3-3、WEB服务器
WEB:现广泛译作网络、互联网等技术领域。表现为三种形式,即超文本(hypertext)、超媒体(hypermedia)、超文本传输协议(HTTP)等。
WEB服务器:一般指网站服务器,可以向浏览器等WEB客户端提供文档浏览、数据文件下载等WEB服务。
简单来说,WEB服务器是提供网上信息浏览等WEB服务的设备。
3-4、WEB应用服务器
上面我们把应用服务器和WEB服务器严格区分:应用服务器通过应用程序接口(通常是网络请求API)把业务逻辑暴露给客户端应用程序。而WEB服务器通过HTTP提供静态内容给浏览器等客户端。
如果不严格区分,应用服务器包含WEB服务器,因为WEB服务器是WEB服务应用程序实现的。
WEB应用服务器:结合应用服务器和WEB服务器,可以说,它是带应用服务器的Web服务器,接收HTTP请求后,既能返回页面等静态内容,又能处理业务逻辑返回数据。
3-5、Java EE服务器
Java EE服务器是实现Java EE技术规范,并提供标准Java EE服务的应用程序服务器。
Java EE服务器有时称为应用服务器,因为它们允许您向客户端提供应用数据,就像Web服务器向Web浏览器提供Web页面一样。
4、举例说明容器以及服务器的联系
4-1、Apache、Nginx、IIS
Apache、Nginx、IIS是目前最主流的三个Web服务器。
但是可以用它们来构建WEB应用服务器,通常它们发现一个请求是动态请求,就通过CGI、ISAPI、特殊管道等协议接口调用后面的应用服务器来协同处理请求。如Nginx通过fastCGI模块来调用ZendEngine执行PHP应用来处理PHP请求。
4-2、Tomcat、Jetty、WebLogic、Websphere、JBoss
Tomcat、Jetty、WebLogic、Websphere、JBoss都是Java(EE) WEB应用服务器。
拿最常用的Tomcat来说,Tomcat是Java Servlet,JavaServerPages,Java Expression Language和JavaWebSocket(Java EE)技术的开源实现。
因为可以通过HTTP提供HTML页面等静态内容的请求访问,所以是一个WEB服务器;
因为实现了Servlet规范,所以也是一个Servlet容器,可以运行Servlet程序;
因为可以通过Servlet容器,调用Servlet处理动态请求,所以也是一个应用服务器;
所以,可以说Tomcat是Java(EE) WEB应用服务器。
4-3、Nginx + Tomcat的WEB应用服务器(集群)
一般在实际应用中,先是通过Nginx反向代理服务器接收请求,匹配分离动态/静态请求(动静分离),如果是静态请求,则转发到另外的Nginx WEB服务器上,返回静态内容;如果是动态请求,则转发到后面的Tomcat应用服务器,处理动态请求的业务逻辑。
互联网时代的今天,各种各样的网页充斥着我们的生活。只要使用浏览器,打开的每一个页面都可以称之为网页。即使使用头条这样的APP,其内容布局、展示的方法也脱胎于网页页面设计的方法与原则。可以说页面的概念已经遍布我们的信息化世界。
作为芸芸众生中的一员,学习网页制作对我们的事业、生活有怎样的帮助呢?
第一,学习网页制作有助于理解网络信息的传播运行机制,即使通过本课程不能全面了解这些核心机制,也能为大家铺垫下继续深入学习的知识基础。即使自己不必亲自制作网页,在使用第三方工具时,比如微信公众号、微信小程序或者其他自动网页或网站生成工具时也会比没有基础的人更快的掌握这些工具。
第二,学好网页制作是制作网站的基础,如果您因为事业需要或者个人爱好打算制作自己的网站或博客,无论是打算使用php还是Java还是Python去构建您的网站,精通网页制作技术是您的第一块技术基石。
第三,如果您打算学习网络爬虫来分析一些网络数据,了解网页页面构成也是必要基础,至少您要知道一个网页页面中每个标签中对应的是哪些信息,才能有的放矢拿到自己想要的信息。
第四,如果您想学习编程,但是缺少相应的基础知识,看不懂复杂的C语言教学,那么从网页制作入手尝试理解编程的语法也是一个很不错的选择。
除此之外,浏览器可以做的事情越来越多,比如webgl的出现,可以让我们通过浏览器构建3d世界,无论是虚拟现实(VR)还是增强现实(AR)都有很多开源免费的解决方案。TensorFlow的JavaScript版本的出现,让我们可以通过结合浏览器学习使用人工智能技术,且非常容易实现。
所以,新的一年里,我打算做网页制作的学习教程,让更多没有基础却对网络技术感兴趣的小伙伴能加入进来。
简单来说学习网页制作需要掌握三门技术。
第一,也是最基础最核心的内容是HTML超文本标记语言。大家不必纠结HTML到底是什么,但是一定要记住它能干什么。HTML通俗来说可以比喻成容器。大家试想,网页里都有哪些内容呢?
一般网页中都会有文字、图片、声音、视频、表格等内容,这些内容就是靠HTML中的标签添加进页面的。
所以说HTML这个工具就是个容器,我们使用HTML标签语言为网页添加所有需要的信息内容。
第二,CSS层叠样式表,这是一个用来装饰页面的工具。如果说HTML是个信息容器,那么如何让这些信息条理清晰的显示出来呢?那就需要CSS来帮忙了。如下图所示,这是一个最简单的页面,只用到了HTML,里面装了一个标题和一个只有六个字的段落。
为了让这个页面看起来美观些,我们为其添加css样式表。添加后如图所示:
我们可以看出来,CSS让标题文字换了颜色,也居中显示了,背景也变成了蓝色。
第三,JavaScript,这个工具相比HTML和CSS来讲是最难学习的,学习JavaScript就是在学习编程了。它虽然只是个脚本语言,但是用到的知识和其他编程语言相差不大。
那JavaScript能干什么呢?
首先,它能为页面中添加很多交互效果。举个例子,我们常见的图片翻页、轮播很多就是基于JavaScript脚本实现的。
其次,JavaScript可以为传统页面扩展出很多新功能,例如结合three.js我们可以很容易的在页面中构建三维空间,或者实现一些3d游戏或其他三维动态演示效果。举个例子(https://renaultespace.littleworkshop.fr/),打开可能略慢。3d展示的汽车广告是不是很酷!
再次,JavaScript可以以网页为基础,实现各种各样的在线小游戏,例如Phaser.js就是目前非常火的一个开源免费网页游戏制作库。phaser官网:http://phaser.io/
JavaScript为网页的功能拓展提供了很多可能性,无论是3d显示还是游戏制作还是未来的人工智能工具,都是由JavaScript都为大家提供了将功能引入到页面的接口,这也是学习难度比较大的原因。不过只要坚持下去一定能学通的!
网页是指我们看到的单个页面。这些页面分为静态页面和动态页面两种。静态页面指的是不能与服务器进行数据交互的页面,顾名思义动态页面指的是可以与服务器进行数据交互的页面,这一点大家不必纠结。
简单来说,静态页面写好后什么样就是什么样,谁打开都是事先编辑好的内容,而动态页面写好后会随着不同的访问变换不同数据,动态页面更像是一个页面模板,随时套用不同信息。
大部分网站中的页面都是动态页面。
如果使用静态页面做网站会出现什么问题呢?如果您有300篇博客文章,那您就要做300个静态页面来显示,大型资讯网站信息量更加庞大,如果都用静态页面来做,占用的服务器空间也是庞大到不可想象。
网站中的动态页面就解决了这个问题,例如一个简单的网站我们只需一个主页、文章页、搜索页基本上就可以了,这些页面中没有具体内容,我们称之为模板。当您打开后,显示的内容都是在数据库中调出的。这样,一个数据库用来存储压缩过的精简信息,这些信息通过不同页面模板显示在用户面前就成为网站的基本运行模式。
例如在静态页面中显示文字字数的代码是这样
<p>300字</p>
如果使用以php编写的WordPress网站框架来动态显示文章字数就是这样
<p><?php echo zm_count_words($text); ?></p>
<?php echo zm_count_words($text); ?>这条语句可以调取数据库中文章字数的记录并显示出来。这也我们通过这一条语句就可以显示不同文章的字数了。
无论是静态页面还是动态页面,他们的核心内容都是一样的,HTML,CSS,JavaScript都是必修知识。只是静态页面在HTML中插入信息,而动态页面插入的是调取数据库信息的语句。
因此,我们这个教程看起来是在做静态页面,但是我们学习的也是制作网站的基础知识。
第一,可以写出静态页面。
第二,有能力读懂他人写好的页面代码。
第三,为继续深入学习网站制作或更为炫酷的页面制作打下基础。
第四,掌握编程基础,至少是基于JavaScript的。
我是大鱼,致力于数字艺术技术分享!欢迎大家关注!祝愿大家2020年学有所成!
HTML是什么?——零基础自学网页制作
第一个HTML页面如何写?——零基础自学网页制作
HTML页面中head标签有啥用?——零基础自学网页制作
初识meta标签与SEO——零基础自学网页制作
HTML中的元素使用方法1——零基础自学网页制作
HTML中的元素使用方法2——零基础自学网页制作
HTML元素中的属性1——零基础自学网页制作
HTML元素中的属性2(路径详解)——零基础自学网页制作
使用HTML添加表格1(基本元素)——零基础自学网页制作
使用HTML添加表格2(表格头部与脚部)——零基础自学网页制作
使用HTML添加表格3(间距与颜色)——零基础自学网页制作
使用HTML添加表格4(行颜色与表格嵌套)——零基础自学网页制作
16进制颜色表示与RGB色彩模型——零基础自学网页制作
HTML中的块级元素与内联元素——零基础自学网页制作
初识HTML中的<div>块元素——零基础自学网页制作
在HTML页面中嵌入其他页面的方法——零基础自学网页制作
封闭在家学网页制作!为页面嵌入PDF文件——零基础自学网页制作
HTML表单元素初识1——零基础自学网页制作
HTML表单元素初识2——零基础自学网页制作
HTML表单3(下拉列表、多行文字输入)——零基础自学网页制作
HTML表单4(form的action、method属性)——零基础自学网页制作
HTML列表制作讲解——零基础自学网页制作
为HTML页面添加视频、音频的方法——零基础自学网页制作
音视频格式转换神器与html视频元素加字幕——零基础自学网页制作
HTML中使用<a>标签实现文本内链接——零基础自学网页制作
这么一段HTML,请挑毛病:
<P> 哥写的不是HTML,是寂寞。<br><br> 我说:<br>不要迷恋哥,哥只是一个传说
这是原来雅虎一道笔试题(文字变了变),用了很多年了,还没有一个人完全答对过。
============== 解答部分 ==============
出这道题的动机是,太多人觉得HTML太简单,但它恰恰又是前端开发中最基础最重要的部分。HTML结构设计的合不合理,直接影响到代码易不易维护,灵不灵活,同时事关网页性能,协作效率。碰到不少人认为前端开发就是javascript开发,大错特错啊。javascript, html, css这三个前端开发的基础支柱,性质完全不同又紧密关联,对它们的正确理解,合理应用是专业与非专业的区别。有些后端工程师可以写出很漂亮的JS,但他们真的不懂怎么合理的把js, html, css结合起来应用。对html的准确把握,不像学一般的编程语言那样,而是建立在丰富实践经验和体会的基础上,是前端的工程师的基本功。
这不是一道较真题或是装逼题,正经一道“画鸡蛋”的题,考的是基本功。代码如其人,对一行代码的理解足以反映出他的前端开发素养。
言归正传。这道题的考点:
这行代码在html 4.01 strict下是完全正确的,在xhtml 1.0 strict下是错误一堆的。所以明显是一个考点。在xhtml下所有标签是闭合的,p,br需要闭合, 标签不允许大写,P要小写。同时nbsp和br必须包含在容器里。html下这些都不是错。p在html里是可选闭合标签,是可以不用闭合的。
这个考点告诉你xhtml是多么苛刻。这是基本考点,答对,你能拿到60分。
用nbsp控制缩进是不合理的。应该用CSS干这事。所以应该删掉nbsp
br是强制折行标签,p是段落。原题用连续的br制造两个段落的效果,效果是达到了,但显然用的不合理,段落间距后期无法再控制。正确的做法是用两个p表现两个段落。“我说”后面是正常的文字折行用br是合理的。
上面全答对,你就能拿到100分。
html 4.01:
<p>哥写的不是HTML,是寂寞。<p>我说:<br> 不要迷恋哥,哥只是一个传说
xhtml 1.0:
<p>哥写的不是HTML,是寂寞。</p><p>我说:<br /> 不要迷恋哥,哥只是一个传说</p>
加分:合理的用语义化标签
在前面的基础上合理的用语义化标签,对内容进行必要的标记,是加分的。但过度的使用标签,就画蛇添足了。如“我说”的话,可以用q标签标注。
<p>哥写的不是HTML,是寂寞。
<p>我说:<br> <q>不要迷恋哥,哥只是一个传说</q>
我觉得这就够了,如果再进一步,“我”用cite标注,“HTML” 用abbr或acronym标注(至于再讨论abbr和acronym的区别就太较真了),也OK。再复杂就没必要了。
<p> 哥写的不是<abbr title=”Hyper Text Markup Language”>HTML</abbr>,是寂寞。
<p><cite> 我</cite>说:<br> <q>不要迷恋哥,哥只是一个传说</q>
本文只是为了提示实战中注意细节和风格,养成统一的规约和习惯。无论何种编程语言,养成一种编程规约和风格习惯,都能给你省很多麻烦,还能节约时间。
*请认真填写需求信息,我们会在24小时内与您取得联系。