香菊网

幻雨焉缘

坚持比方法更重要 🥗
😃

CORS 跨域的认识和实现

香菊网 发表于: 2020-07-11 分类: js部分  服务器  

1、什么是跨域

   跨域字面意思理解为跨域名访问,域名不同、端口不同、子域名不同都触发CORS跨域,如果域名端口相同,只是path不同 不属于跨域

 

2、CORS简述

   CORS 简称跨域资源共享,它允许浏览器可以通过跨源服务器,发出xmlHttpRequest的请求,从而解决ajax只能同源请求的限制。CORS需要浏览器和服务器同时支持。

 

3、跨域的方案

   比较常用的跨域解决方案有三种

  • Jsonp
    最原始的解决方案,利用script标签可以跨域的原理实现
    限制
     > 需要服务器支持
     > 而且只能发起GET的请求
  • Nginx
    利用nginx的反向代理将请求的原路径代理到其他服务器
    限制
    > 要在nginx上做配置,语义不是太清晰
  • CORS
    规范化的跨域请求方案
    优点
    > 在服务端进行控制是否允许跨域,可自定义规则
    > 支持所有的请求方式
    缺点
    > 会产生额外的请求

4、CORS解决跨域

浏览器会将请求分为两类:简单请求、预检请求

ajax请求 简单请求 预检请求
 methods

 Head

 Get

 Post

 put
 http

 Accept

 Accept-Language

 Content-Language

 Last-Event-ID

 Content-Type:只限于三个值application/x-www-form- urlencoded、multipart/form-data、text/plain

 Access-Control-Request-Method:接下来会用到的请求方式,比如PUT

 Access-Control-Request-Headers:会额外用到的头信息

  • Access-Control-Allow-Origin:可接受的域,是一个具体域名或者*,代表任意
  • Access-Control-Allow-Credentials:是否允许携带cookie,默认情况下,cors不会携带cookie,除非这个值是true
  • Access-Control-Allow-Methods:允许访问的方式
  • Access-Control-Allow-Headers:允许携带的头
  • Access-Control-Max-Age:本次许可的有效时长,单位是秒,过期之前的ajax请求就无需再次进行预检了

 

 

标签: js部分服务器
Copyright © 2019 幻雨焉缘博客 | 浙ICP备19001843号-1
----------------------------------
种一棵树,最好的培养时间是十年前,其次是现在 加油  (ง •_•)ง。        ──── 前端攻城狮