从头走前端-百度前端技术学院（1）

记录自己在网上自学加复习的前端笔记，当然还有一些其他涉及的相关知识。

问题：在web建站技术中，HTML、HTML5、XHTML、CSS、JavaScript、PHP、SQL、web services是什么？

答：

首先知道网站的访问过程：

（1）输入URL或者点击链接，请求访问。

（2）浏览器发送http请求，连接服务器。

（3）服务器通过接收到的客户端的信息（如登录信息），去数据库进行查询。

（4）数据库将数据返回给服务器，服务器将HTML页面发给客户端。服务器响应。

HTML，CSS，JavaScript可以这样形容：HTML是名词，CSS是形容词，JavaScript是动词。

HTML是一种标记语言。会显示基本你想要显示的内容。

CSS是一种样式。CSS和HTML关联起来，就可以将内容展示为一个基本符合审美的页面了。

js是一种事件。js可以将内容动起来，实现一些动态效果。还可以ajax，不用刷新就可以加载数据。更好的用户体验。

HTML和HTML5：

网页中的HTML代码不一定是标准的，有些浏览器支持一些标签，有些又不支持，在混乱的情况下，对HTML建立一个新的标准，HTML5就是一个新的标准。

HTML5加了很多新的标签和属性，实现了很多效果，轻松简单了很多。当然新标准不是完美的。

XHTML对语法的要求更为严格，并且兼容XML，在语法上和HTML有些不同。

web server和web services：

浏览器给服务器发送一个请求，它们之间要通过一个协议，常用的是http协议。

服务器的响应有状态码200 OK，还有content-type表示服务器发过来的文件类型是什么，还有一些其他的属性，告诉浏览器怎么展示给用户看。服务器怎么知道要写什么东西发给浏览器呢？这就需要web server了。

浏览器和服务器之间的请求响应，请求头和响应头长这样。

这些就是web server生成的。（服务器可以做一些改动）

还比如，访问一个网站，没有写明具体要请求的页面，这时，服务器则会返回一个HTML给你，要找到对应的HTML给浏览器，也是web server的事。

要在形形色色的机器上能够提供网络进行交互，需要指明一种协议（如http/https），和一种数据封装格式（如HTML/XML）。

web server提供的web service，指的是协议+格式的交流体系。不过，web service的生态系统和HTML的标准不一样，用户可以选择协议和数据封装格式更多，http+html是一种，封闭系统的内部交互可以是自定义的协议和格式（如QQ）。

除了web service，web server还兼顾很多功能，包括提供缓存，平衡负载，可以在访问量很大的时候很好的处理。

常用的现成的web server有Apache，NGINX和iis，还可以用nodejs自己定制一个。因为web server需要很好的性能，所以投产时用的web server通常是c/c++/java写的，其他语言都可以，而且配合上语言底层的优化和好的模型，其他语言的web server也可以有不错的表现。

PHP，服务器脚本：

服务器不可能只会“接请求-发文件”这么简单的操作，还可以处理上传来的文件，可以接受各种请求，去操作服务器或数据库。要实现这些，服务器这边少不了代码了，就是服务器脚本。

web service传输的数据，主要也是由服务器脚本生成，再交由web server，按照某种协议套好整个响应的格式，返回给客户端的。

同一个网址，每个人看到的页面不一定是一样的，登录和没登录看到的也是不一样的，服务器脚本可以对这些不同的状态，生成不同的页面，交给web server返回给浏览器。

PHP是常用的服务器脚本语言，还有java/python等，为了方便，在写服务器脚本的时候，通常还会用同语言写的web framework来处理各种细节，防御一些常见的攻击，提供跨站认证的接口，利用cookie处理登录状态和用户设置之类的。

一个普通网站访问的过程：（涉及到的技术）

1，用户操作浏览器访问，浏览器向服务器发出衣蛾http请求。

2，服务器接收到http请求，web server进行相应的初步处理，使用服务器脚本生成页面。

3，服务器脚本（利用web framework）调用本地和客户端传来的数据，生成页面。

4，web server将生成的页面作为http响应的body，根据不同的处理结果生成http header，发回给客户端。

5，客户端（浏览器）接收到http响应，通常第一个请求得到的http响应的body里是HTML代码，于是对HTML代码开始解析；

6，解析过程中遇到引用的服务器上的资源（CSS，js，图片，附件等），再向web server发送请求，web server找到对应的文件，发送回来。

7，浏览器解析HTML包含的内容，用得到的CSS代码进行外观上的进一步渲染，js代码也可能会对外观进行一定的处理。

8，用户与页面交互时，js代码对此作为一定的反应，添加特效和动画。

9，交互的过程中可能需要想服务器索取或提交额外的数据（局部刷新），一般不是跳转就是通过js代码向web server发送请求，web server再用服务器加班进行处理，把资源返回给客户端，客户端用得到的资源来实现动态效果或其他改变。

现在在这方面的应用热起来的语言有：

Python，对应常见的framework，Tornado（自带的），社区成熟的Django等。

Ruby，framework，一般用Rails，用户包括github，早期的Twitter等。

JavaScript，有了node.js这个平台，服务器和浏览器脚本都可以实现，nodejs最常用的framework是express。

微软跟着ASP.Net转移到了C#或Visual Basic。

Erlang，擅长大规模的开发，不少游戏公司用来写服务器，WhatsApp也是用这个。

几种常见的架构包括：

• LAMP = Linux+Apache+MySQL+PHP。（还有可能是Python，l也可以是windows）。
• J2EE，java世界的架构，通常是企业用的。比较常见的还会搭配一种UNIX做操作系统，Apache做web server，Tomcat转换jsp到java给服务器程序用等等。常常用来提供企业里的各种需要用到的网络的业务。
• ASP.NET，微软的架构，通常搭配Windows server操作系统，SQL server数据库，IIS做web server。
• MEAN，MongoDB数据库，Express做web framework，angular做前端的js框架，nodejs写web server。神奇之处在于语言都是JavaScript（MongoDB实现不是，与外界沟通是）。

一般来说，重点不在技术而在乎成本的新网站比较喜欢用LAMP，重视安全稳定和速度的企业和机构喜欢用J2EE，想省事的网站用ASP.NET。