HTTP 协议详解JS基础: HTTP 协议的工作方式 HTTP 请求和响应的内容服务返回状态码详解 GET 请求和

1. HTTP 协议详解

1.1. HTTP 协议工作方式

HTTP 协议工作方式: 请求响应方式

客户端浏览器发送请求给 Web 服务器 -> 请求
- 如何发起:
  - GET:
    1. 浏览器地址栏输入地址回车
    2. 标签: href / src
    3. 超链接跳转
    4. 表单 GET 提交
    5. AJAX -> GET
  - POST
    1. AJAX -> POST
    2. 表单 POST 提交
Web 服务器接收请求, 处理数据并将结果返回客户浏览器 -> 响应

1.2. HTTP 请求和响应的内容

IIS: Internet Information Services, 互联网消息服务
- IIS 是由微软公司提供的基于运行 Microsoft Windows 的互联网基本服务
- IIS 是一种 Web ( 网页 )服务组件, 其中包括 Web 服务器, FTP 服务器, NNTP 服务器, SMTP 服务器, 分别用于网页浏览, 文件传输, 新闻服务和邮件发送等方面, 它使得在网络( 包括互联网和局域网 )上发送信息成了一件很容易的事
HTTP 协议的具体内容, 规定了如下两种消息的格式
1. 请求消息: 客户端发送给服务器的
  - 请求起始行: 请求方法 + 空格 + 请求 URL + 空格 + 协议版本
    - 请求方法包括: GET / POST / PUT / DELETE / HEAD / CONNECT / TRACE / OPTIONS
  - 请求头 Headers:
    1. 请求消息专用:
      - Host: tmooc.cn: 告诉服务器请求是哪个虚拟主机
      - Accept: text/html: 告诉服务器自己可以接受的响应内容
      - Origin: 来源, 告诉服务器当前请求来源于哪个域名
      - User-Agent: Mozilla: 客户端告诉服务器自己的类型
      - Accept-Encoding: gzip: 浏览器告诉服务器自己可以接受的压缩类型
      - Accept-Language: zh-CN: 告诉服务器自己可以接受的自然语言( CN: 表示中国, zh: 表示简化汉字 -> Ex: en-US )
      - Referer: http://tmooc.cn: 告诉服务器当前请求来自哪个页面( 盗链事例 )
    2. 请求 / 响应通用头
      - Connection: keep-alive: 告诉对方启用持久连接
      - Cache-Control: no-cache: 告诉对方如何( 缓存 )当前消息主体中的数据
      - Pragma: no-cache: HTTP / 1.0 完成缓存
      - Date: 日期
    3. 请求主体描述头
      - Content-Length: num: 主体消息长度
      - Content-Type: 描述请求主体的内容类型
        
        text/plain: 请求数据是普通文本
        
        application/x-www-form-urlencoded: 请求主体经过编码的
        
        multipart/form-data: 表单中包含上传文件数据
    4. 客户端自定义头部
  - 请求主体内容
2. 响应消息: 服务器发送给客户端的
  - 响应起始行( start Line ): 协议版本 + 空格 + 响应状态码
    - 响应状态码包括:
      - 100 ~ 199: 提示信息
        
        100: Continue, 继续, 客户端应继续其请求
        
        101: Switching Protocols, 转换协议, 服务器根据客户端的请求切换协议 -> 只能切换到更高级的协议
      - 200 ~ 299: 成功响应
        
        200: ok, 请求成功
        
        201: Created, 已创建 -> 成功请求并创建了新的资源
        
        202: Accepted, 已接收 -> 已经接受请求, 但未处理完成
        
        203: Non-Authoritative Information, 非授权信息 -> 请求成功, 但返回的 mate 信息不在原始的服务器, 而是一个副本
        
        204: No Content, 无内容 -> 服务器处理成功, 但未返回内容
        
        在未更新内容的情况下, 可确保浏览器继续显示当前文档
        
        205: Reset Content, 重置内容 -> 服务器处理成功, 用户终端( Ex: 浏览器 )应重置文档视图
        
        可通过此返回码清除浏览器的表单域
        
        206: Partical Content, 部分内容 -> 服务器成功处理了部分 GET 请求
      - 300 ~ 399: 需要客户端重定向
        
        300: Multiple Choices, 多种选择 -> 请求的资源可包括多个位置, 相应可返回一个资源特征与地址的列表用于用户终端( Ex: 浏览器 )选择
        
        301: Moved Permanently, 永久移动 -> 请求的资源已经被永久的移动到新 URL, 返回信息会包括新的 URL, 浏览器会自动定向到新的URL
        
        今后任何新的请求都应使用新的 URL 代替
        
        在更换域名时起着不可替代的作用
        
        不仅可以实现网页的批量指定跳转, 还可促进搜索引擎优化效果
        
        302: Found, 临时移动 -> 与 301 类似, 但资源只是临时移动, 客户端应继续使用原有 URL
        
        303: See Other, 查看其他地址 -> 与 301 类似, 使用 GET 和 POST 请求查看
        
        304: Not Modified, 未修改 -> 所请求的资源未修改
        
        服务器返回此状态码时, 不会返回任何资源
        
        客户端通常会缓存访问过的资源, 通过提供一个头信息指出客户端希望只返回在指定日期之后修改的资源
        
        理解: 客户端发送一个请求且该请求已被允许, 而文档的内容( 自上次访问以来或根据请求的条件 )并没有发生改变, 则服务器返回 304 状态码
        
        简单的理解就是: 客户端已经执行了请求, 但文件未发生变化
        
        引擎优化: 一个网站被搜索引擎抓取的次数以及评率越多, 那么就约有利于排名
        
        但是: 如果你的网站出现太多的 304, 那么一定会降低搜索引擎抓取的次数及评率, 从而让自己的排名靠后
        
        305: Use Proxy, 使用代理 -> 所请求的资源必须通过代理访问
        
        307: Temporary Redirect, 临时重定向 -> 与 302 类似, 使用 GET 请求重定向
      - 400 ~ 499: 客户端请求错误
        
        400: Bad Request, 客户端请求的语法错误, 服务器无法理解
        
        401: Unauthorized, 请求要求用户的身份认证
        
        402: Payment Required, 保留, 将来使用
        
        403: Forbidden, 表示资源不可用 -> 服务器理解客户端的请求, 但拒绝处理它
        
        通常由于服务器上下文或目录的权限设置导致 Web 访问错误 -> Ex: IIS / apache 设置访问权限不当
        
        404: Not Found, 服务器无法根据客户端的请求找到资源 / 服务器无法回应且不知道原因
        
        搜索引擎在请求某个 URL 得到 404 状态码回应时, 知道该 URL 无效, 便不再索引该网页, 并向数据中心反馈将该 URL 表示的网页从索引数据库中删除 -> 删除过程有可能需要很长的时间
        
        自定义 404 错误页面是增强用户体验很好的做法
        
        405: Method Not Allowed, 客户端请求中的方法被禁用
        
        406: Not Acceptable, 服务器无法根据客户端请求的内容特性完成请求
        
        407: Proxy Authentication Required, 请求要求代理的身份认证 -> 与 401 类似, 但请求者应当使用代理进行授权
        
        408: Request Time-out, 服务器等待客户端发送的请求时间过长, 超时
        
        409: Conflict, 服务器处理请求时发生了冲突
        
        服务器完成客户端的 PUT 请求时可能返回此代码
        
        410: Gone, 客户端请求的资源已经不存在
        
        410 与 404 不同, 如果资源以前有, 现在被永久删除了, 可使用 410 代码, 网站设计人员可通过 301 代码指定资源的新位置
        
        411: Length Required, 服务器无法处理客户端发送的不带 Content-Length 的请求信息
        
        412: Precondition Failed, 客户端请求信息的先决条件错误
        
        413: Request Entity Too Large, 由于请求的实体过大, 服务器无法处理因此拒绝请求
        
        为防止客户端的连续请求, 服务器可能会关闭连接
        
        如果只是服务器暂时无法处理, 则会包含一个 Retry-After 的响应信息
        
        414: Request-URI Too Large, 请求的 URI 过长( URI 通常为网址 ), 服务器无法处理
        
        415: Unsupported Media Type, 服务器无法处理请求附带的媒体格式
        
        416: Requested range not satisfiable, 客户端请求的范围无效
        
        417: Expactation Failed, 服务器无法满足 Expect 的请求信息
      - 500 ~ 599: 服务器运行错误
        
        500: Internal Server Error, 服务器内部错误, 无法完成请求
        
        501: Not Implemented, 服务器不支持请求的功能, 无法完成请求
        
        502: Bad Gateway, 作为网关或代理工作的服务器尝试执行请求时, 从远程服务器接收到了一个无效的响应
        
        503: Service Unavailable, 由于超载或系统维护, 服务器暂时无法处理客户端的请求
        
        延时的长度可包含在服务器的 Retry-After 头信息中
        
        504: Getway Time-out, 充当网关或代理的服务器, 未及时从远端服务器获取请求
        
        505: HTTP Version not supported, 服务器不支持请求的 HTTP 协议的版本, 无法完成处理
  - 响应消息专用头
    - Server: 告诉客户端服务器的类型
    - Last-Modified: 指定资源上一次修改时间
    - Content-Encoding: gzip: 告诉客户端启用压缩及压缩的格式
  - 请求 / 响应通用头
    - Connection: keep-alive: 告诉对方启用持久连接
    - Cache-Control: no-cache: 告诉对方如何( 缓存 )当前消息主体中的数据
    - Pragma: no-cache: HTTP / 1.0 完成缓存
    - Date: 消息的创建时间
  - 响应主体描述头
    - Content-Length: num: 响应的主体长度
    - Content-Type: 响应的主体内容种类 -> 上百种
      - text/plain: 纯文本
      - text/html: 文本与网页
      - text/css: 文本与样式文件
      - application/javascript: JS 程序
      - application/xml: XML 数据
      - application/json: json 数据
  - 响应主体: 客户端请求 -> 服务器返回的内容

1.3. 常见的 HTTP 请求方式有哪些, 各表示客户端的何种意图?

GET: 表示客户端想获取服务端上的资源
POST: 表示客户端想传递数据给服务器端
PUT: 表示客户端想放置文件到服务器上
DELETE: 表示客户端想删除服务器上的文件
HEAD: 表示客户端想获取服务器端资源相应头部, 不要资源
CONNECT: 连接测试
TRACE: 追踪请求路径
OPTIONS: 选项, 保留以后使用

1.4. GET 请求和 POST 请求的区别

	GET	POST
语义	客户端想获取服务器端的资源	客户端想传递数据给服务器端
如何发起	1. 浏览器中输入 `URL` 回车 2. 超链接跳转 3. `JS` 跳转 4. `src` / `href` 属性请求 5. `GET` 方式提交表单 6. `AJAX`-`GET`	1. `JAAX`-`POST` 2. `POST` 方式提交表单
请求数据的位置	追加在 `URL` 后, 作为查询字符串, 以 `?` 开头	放在请求主体中
请求的数据类型	只能是文本字符	可以使任意类型, Ex: 图片, 视频等
能否用于上传文件	否	能
请求数据长度限制	有, 浏览器 / 服务器对请求 `URL` 长度有限制 -> 2 `KB`	请求主题没有长度限制
请求数据是否需要编码	需要, 一个 `UTF-8` 汉字编码为 3 个字节	需要, 一个 `UTF-8` 汉字编码为 3 个字节
安全级	不安全	安全

1.5. 如何修改响应消息的头部

修改 Web 服务器的配置文件
- 比较复杂, 有些情况无法修改 -> Ex: 新浪云服务器
若响应文件是 HTML, 可以声明 <meta http-equiv="响应头部" />
- 仅适用于 HTML 文件, 且只是"等价物", 并非真正的响应头部
使用动态语言代码来控制响应头部
- Ex: PHP -> header('Cache-Control: no-cache'), header('Content-Type: image/png')

1.6. 根据 HTTP 协议进行网站访问优化

域名解析
- 尽可能减少域名解析次数 -> 减少跨站外部资源的引用
创建连接
- 努力减少连接创建次数 -> 启用持久连接避免重复连接
发送请求
- 尽力减少请求次数 -> 合理设置缓存, 资源合并
等待响应
- 提高服务器端运行速度 -> 提高数据运算及查询速度
接受响应
- 尽可能减少相应数据的长度 -> 启用压缩