web应用服务详解

定义：

最流行的互联网应用之一。其使用HTTP/HTTPS协议进行通信。HTTP/HTTPS协议，即超级文本（带超级链接的文本）传输协议，定义了Web浏览器与Web服务器之间的通信规则。

HTTP/HTTPS协议有请求数据包和响应数据包两种：

  • 请求数据包_头部字段：方法 URL 版本；

                                             Accpet  Referer  Accept-Language  User-Agent

                                             Accept-Encoding  Host  Connection

  • 请求数据包_主体格式：POST传递参数
  • 响应数据包_头部字段：版本 状态码 短语；

                                           Server  Data  Content-Type

                                           Transfer-Encoding  Connection  Cache-Control

  • 响应数据包_主体格式：声明 <html> <head> </head> <body> </body> </html>

模型：

浏览器Brower——互联网Internet——web应用服务（中间件负责http协议实现+源代码负责业务功能实现）

web应用服务

中间件做什么？——http协议状态码

HTTP状态码首字母表示的意思大体如下：

1××：消息响应
2××：成功响应
3××：重定响应
4××：客户端错误
5××：服务器端错误

1xx(临时响应)

100: 请求者应当继续提出请求。

101(切换协议) 请求者已要求服务器切换协议，服务器已确认并准备进行切换。

2xx(成功)

200：正确的请求返回正确的结果，如果不想细分正确的请求结果都可以直接返回200。
201：表示资源被正确的创建。比如说，我们 POST 用户名、密码正确创建了一个用户就可以返回 201。
202：请求是正确的，但是结果正在处理中，这时候客户端可以通过轮询等机制继续请求。

203：请求的代理服务器修改了源服务器返回的 200 中的内容，我们通过代理服务器向服务器 A 请求用户信息，服务器 A 正常响应，但代理服务器命中了缓存并返回了自己的缓存内容，这时候它返回 203 告诉我们这部分信息不一定是最新的，我们可以自行判断并处理。

3xx(已重定向)

300：请求成功，但结果有多种选择。
301：请求成功，但是资源被永久转移。比如说，我们下载的东西不在这个地址需要去到新的地址。
303：使用 GET 来访问新的地址来获取资源。
304：请求的资源并没有被修改过。

308：使用原有的地址请求方式来通过新地址获取资源。

4xx(请求错误)

400：请求出现错误，比如请求头不对等。
401：没有提供认证信息。请求的时候没有带上 Token 等。
402：为以后需要所保留的状态码。
403：请求的资源不允许访问。就是说没有权限。
404：请求的内容不存在。
406：请求的资源并不符合要求。
408：客户端请求超时。
413：请求体过大。
415：类型不正确。

416：请求的区间无效。

5xx(服务器错误)

500：服务器错误。
501：请求还没有被实现。
502：网关错误。
503：服务暂时不可用。服务器正好在更新代码重启。
505：请求的 HTTP 版本不支持。

中间件做什么？——http协议请求方法

  • GET：获取一份指定（比如一个包含了一个产品或者一系列产品相关信息的 HTML 文档）。
  • POST：创建一份新的资源（比如给 wiki 增加一片新的文章、给数据库增加一个新的节点）。
  • HEAD: 获取有关指定资源的元数据信息，而不会得到像 GET 的内容部分。例如，您可以使用 HEAD 请求来查找上次更新资源的时间，然后仅使用（更“昂贵”）GET 请求下载资源（如果已更改）。
  • PUT：更新一份已经存在的资源（或者在该资源不存在的情况下创建一份新的）。
  • DELETE：删除指定的资源。
  • TRACE、OPTIONS、CONNECT、PATCH：这些动作是为一些不常见任务设计的，因此我们在这里的讲解不会涉及到它们。

GET 请求/响应举例

你可以通过点击一个链接或者在网站进行一次搜索（比如搜索引擎的首页）做出一次简单的 GET 请求。比如，当你在 MDN 上进行一次对“客户端概览”词条的搜索时，HTTP 请求就被发送出去了，你将会看到正如下面一样被展示出来的文本信息（展示出来的信息不一定是相同的，因为其中一部分信息还取决于你的浏览器）。

请求

每一行请求都包含着相关信息。第一部分被称为header，并且包含着关于这个请求的有用信息，同样地一个HTML head包含着关于 HTML 文档的有用信息（但是却没有自身的实际内容，内容在主体里面）。

GET https://developer.mozilla.org/en-
US/search?q=client+server+overview&topic=apps&topic=html&topic=css&topic=js&topic=api&topic=webdev HTTP/1.1
Host: developer.mozilla.org
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Referer: https://developer.mozilla.org/en-US/
Accept-Encoding: gzip, deflate, sdch, br
Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7
Accept-Language: en-US,en;q=0.8,es;q=0.6
Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _gat=1; _ga=GA1.2.1688886003.1471911953; ffo=true

第一行和第二行包含了我们在上面讨论过的大部分信息

  • 请求类型（GET）。
  • 目标资源的 URL（/en-US/search）。
  • URL 参数（q=client%2Bserver%2Boverview&topic=apps&topic=html&topic=css&topic=js&topic=api&topic=webdev）。
  • 目标网站（developer.mozilla.org）。
  • 第一行的末尾也包含了一个简短的包含了标识协议版本的字符串（HTTP/1.1）。

最后一行包括一些关于客户端 cookies 的信息——你可以看到在这种情况下 cookies 包含一个为处理远程会话准备的 ID（Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; ...）。

剩余几行包含着所使用的浏览器以及浏览器所能处理的回应类型等信息。比如，你可以在下面看到这些相关信息：

  • 我的浏览器上 (User-Agent) 是火狐 (Mozilla/5.0).
  • 它可以接收 gzip 压缩信息 (Accept-Encoding: gzip).
  • 它可以接收的具体编码类型 (Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7) 和语言 (Accept-Language: de,en;q=0.7,en-us;q=0.3).
  • The Referer line 提示包含资源链接的网络地址 (或者说请求的来源是 https://developer.mozilla.org/en-US/).

请求也可以有一个请求体，不过在这个例子中请求的请求体是空的。

回应

针对这个请求的回应的第一部分内容展示如下。The header 包含了如下信息：

  • 第一行包括了回应状态码 200 OK，这告诉我们请求是成功的。
  • 我们可以看到回应是文本 html 格式的（Content-Type）。
  • 我们也可以看到它使用的是 UTF-8 字符集 (Content-Type: text/html; charset=utf-8).
  • The head 也告诉我们它有多大 (Content-Length: 41823).

在消息的末尾我们可以看到主体内容——包含了针对请求返回的真实的 HTML。

HTTP/1.1 200 OK
Server: Apache
X-Backend-Server: developer1.webapp.scl3.mozilla.com
Vary: Accept,Cookie, Accept-Encoding
Content-Type: text/html; charset=utf-8
Date: Wed, 07 Sep 2016 00:11:31 GMT
Keep-Alive: timeout=5, max=999
Connection: Keep-Alive
X-Frame-Options: DENY
Allow: GET
X-Cache-Info: caching
Content-Length: 41823



<!DOCTYPE html>
<html lang="en-US" dir="ltr" class="redesign no-js"  data-ffo-opensanslight=false data-ffo-opensans=false >
<head prefix="og: http://ogp.me/ns#">
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge">
  <script>(function(d) { d.className = d.className.replace(/\bno-js/, ''); })(document.documentElement);</script>
  ...

header 的剩余部分还包括一些回应的其他信息（比如回应在什么时候生成的），有关服务器的信息，还有它期望浏览器如何处理这个包（比如， X-Frame-Options: DENY 告诉浏览器不允许这个网页嵌入在其他网站的 HTML 元素<iframe>上。

POST 请求/响应举例

当你提交一个表单，并且希望表单所包含的信息存储到服务器的时候，你就生成了一次 HTTP POST 请求。

请求

下面的文本展示了当用户在网站上提交新的文件的时候，生成的一个 HTTP 请求的格式和之前展示的 GET 请求是非常相似的，只是第一行标识这个请求为 POST。 

POST https://developer.mozilla.org/en-US/profiles/hamishwillee/edit HTTP/1.1
Host: developer.mozilla.org
Connection: keep-alive
Content-Length: 432
Pragma: no-cache
Cache-Control: no-cache
Origin: https://developer.mozilla.org
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
Content-Type: application/x-www-form-urlencoded
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Referer: https://developer.mozilla.org/en-US/profiles/hamishwillee/edit
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.8,es;q=0.6
Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; _gat=1; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _ga=GA1.2.1688886003.1471911953; ffo=true

csrfmiddlewaretoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT&user-username=hamishwillee&user-fullname=Hamish+Willee&user-title=&user-organization=&user-location=Australia&user-locale=en-US&user-timezone=Australia%2FMelbourne&user-irc_nickname=&user-interests=&user-expertise=&user-twitter_url=&user-stackoverflow_url=&user-linkedin_url=&user-mozillians_url=&user-facebook_url=

最主要的不同在于 URL 不再包含任何参数。正如你所见，表单提交的信息被编码后放入消息主体中了。(比如：使用以下命令设置新的用户全名：&user-fullname=Hamish+Willee)

响应

请求的响应如下。状态码"302 FOUND"告知浏览器，服务端已收到它提交的 post 请求，它必须再发出第二个 HTTP 请求来加载Location字段中指定的页面。对于其他方面的信息含义，则与GET请求的响应信息类似。

HTTP/1.1 302 FOUND
Server: Apache
X-Backend-Server: developer3.webapp.scl3.mozilla.com
Vary: Cookie
Vary: Accept-Encoding
Content-Type: text/html; charset=utf-8
Date: Wed, 07 Sep 2016 00:38:13 GMT
Location: https://developer.mozilla.org/en-US/profiles/hamishwillee
Keep-Alive: timeout=5, max=1000
Connection: Keep-Alive
X-Frame-Options: DENY
X-Cache-Info: not cacheable; request wasn't a GET or HEAD
Content-Length: 0

中间件做什么？——加密传输：ssl证书

待更...

源代码做什么？

源代码通常由以下文件构成：

  • 多个前端文件（HTML、CSS、JavaScript）
  • 多个后端文件：.php或.py
  • 一个数据库链接文件：inc.conn或config.yml
  • 建库脚本：.sql文件

源代码通常提供以下功能：

  • 身份认证：注册登录
  • 业务流程：
  • 后台管理：

源代码通常使用到的技术栈：

  • 前端：react  jquery css html
  • 后端：java  php  python

浏览器Brower

定义：

解析和渲染HTML、CSS、JS等。

分类：

命令行：curl 命令

curl  www.bing.com

图形界面：Chrome浏览器、Firefox浏览器、搜狗浏览器等等。

基本用法：

 

扩展插件：

 

互联网Internet

DNS域名解析

根域名 .
顶级域名 .com  .cn  .net  .org  .io  .gov  .edu等等
二级域名 qq  sohu  sina  taobao  jd  baidu  google等等，须注册。
三级域名（子域名） www  ftp  mail  bbs  v等等，免费使用。

域名注册商

阿里万网

CDN

cloudflare

 

附录

Firefox全历史版本下载：

http://ftp.mozilla.org/pub/mozilla.org//firefox/releases/
posted @ 2022-10-22 18:33  dustfree  阅读(18)  评论(0)  编辑  收藏  举报