前端基础

1、HTTP

  • 常见HTTP状态码（200成功类，300重定向类，400客户端类，500服务器端类）：
    • 200：请求成功，一般用于Get和Post。                                                     OK
    • 301：资源移动。所请求资源自动到新的URL，浏览器自动跳转到新的URL。        Moved Permanently
    • 304：未修改。所请求资源未修改，浏览器读取缓存数据。                              Not Modified
    • 400：请求语法错误，服务器无法理解。                                                    Bad Request
    • 404：未找到资源。                                                                             Not Found
    • 500：服务器内部错误。                                                                       Internal Server Error
    • 502：前面代理服务器联系不到后端的服务器                                              Bad GateWay
    • 504：前面代理服务器能联系到后端的服务器，但是后端的服务器在规定的时间内没有给代理服务器响应     GateWay Timeout
  • 常用HTTP方法：
    • GET（从服务器端获取）：从服务器获取一份文档
    • POST（向服务器端发送）：向服务器发送需要处理的数据
    • PUT（向服务器端新增）：将请求的主体部分存储到服务器上
    • DELETE（在服务器端删除）：从服务器上删除一份文档　
  • HTTP请求/响应信息的组成部分：头行、头部（键值对构成）、主体
    • 请求报文
      • 头行：请求的方法、请求的url（主机地址）、请求使用的协议（HTTP版本）
      • 头部：包括浏览器可以接受的媒体类型、语言类型、浏览器的版本...
      • 主体：
    • 响应报文
      • 头行：HTTP协议的版本、HTTP状态码、HTTP状态码描述
      • 头部：Expires指定缓存的有效时间
      • 主体：如果访问的是一个页面，主体就是一个完整的html文件。　
  • HTTP事务的完整过程（请参考http://www.cnblogs.com/LIUYANZUO/p/5428185.html）

　　        在浏览器地址栏输入url，按下回车，这一瞬间页面发生了什么？

    1. 域名解析
      • 搜索浏览器的DNS缓存、操作系统的DNS缓存、读取hosts文件，看有没有该域名对应的IP地址、向DNS服务器发起域名解析请求，按顺序，找到且没有过期则解析结束，不再执行后续的。　　
    2. 发起TCP的三次握手
    3. 建立TCP连接后发起http请求
    4. 服务器端响应http请求，浏览器得到HTML代码
    5. 浏览器解析HTML代码，并请求HTML代码中的资源
    6. 浏览器渲染页面呈现给用户　　

             

2、同源策略：属于同一个源的几个页面拥有相同的协议（http、https）、主机（合法的Internet主机域名或IP地址）和端口（为空则使用默认端口80）。eg：https://i.cnblogs.com:8080/EditPosts.aspx?opt=1#news,这个url的协议为https、主机（hostname）为i.cnblogs.com、端口为8080。host为i.cnblogs.com:8080，pathname为EditPosts.aspx（路径），search（查询字符串）为opt=1，hash（表示当前文档的一个片段）为news。port、pathname、search、hash都是不必须的。

3、跨域资源访问

  • 概念：当不满足同源策略的访问时，称为跨域资源的访问。
  • js跨域请求的方式有哪些？
    • W3C定义的CORS　
    • JSONP（Json with padding）：利用了html里面的<script>标签可以跨域的原理
    • Frame代理
    • Web Sockets
    • Comet
    • ...

4、数据存储（客户端存储数据）的方式

  • cookie：由键值对构成的小型文本文件，键值对之间用分号和空格分隔，大小为4kb左右。
    • cookie由六部分组成：
      • Name：作用为：名
      • Value：作用为：值
      • Domain：默认值为：当前文档域，作用为：作用域
      • Path：默认值为：当前文档路径，作用为：作用路径
      • Expires/Max-Age：默认值为：浏览器会话时间，作用为：失效时间
      • Secure：默认值为：false，为https协议时生效，值为true
    • 虽然cookie存储在浏览器端，但是经常在服务器端对cookie进行设置，可以在http返回体里通过设置Set-Cookie这个头部来告诉浏览器端需要存储的cookie。
    • 删除cookie：指定name、path、domain，这是唯一标识一个cookie的，然后将max-age属性的值设为0，就可以立即删除cookie了。
    • 设置cookie的值，需要程序员自己写一个setCookie()方法。
    • 读取cookie的值，需要程序员自己写一个getCookie()方法。
    • cookie的缺陷：
      • （url）只要满足cookie的作用域和作用路径，都会带上cookie信息，会产生巨大流量代价（每次请求新页面都会发送cookie，浪费了带宽；cokie还需要指定作用域，不可以跨域调用）
      • 安全性问题：cookie是明文传递的
      • 存储在浏览器端，有大小限制（4kb左右）　　
  • web storage
    • session storage
      • 有效期默认为浏览器的会话时间，浏览器会话结束时，sessionStorage就消亡了
      • 作用域由协议、主机名、端口、窗口来决定
    • local storage
      • 有效期默认为永久，如果客户不删除的话
      • 作用域由协议、主机名、端口来决定
    • web storage的特点：
      • 克服cookie带来的一些限制，当数据需要被严格控制在客户端时，无需持续地将数据发回服务器。
      • 大部分在5MB左右，不同浏览器对storage的实现不同。只要满足有效期和作用域，每次访问浏览器的时候都会将storage载入到内存里，会对内存造成压力，建议不要给storage设置过大的数据。（提供一种存储大量可以跨会话存在的数据的机制）
      • W3C定义了专门的API来对storage进行增删查改。　　　　

5、　

【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/liyan22/p/6433186.html