前端基础

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、 

posted on 2017-02-23 16:04  萌动  阅读(90)  评论(0编辑  收藏  举报