最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • 前端跨域请求的处理

    正文概述 掘金(多喝热水__)   2021-08-04   438

    这是我参与8月更文挑战的第4天,活动详情查看:8月更文挑战

    同源策略

    • 同源策略是由浏览器给的

    • 浏览器不允许我们向别人发送请求,只能向自己的服务器发送请求

    • 当我们想向别人的服务器发送请求的时候,就会被浏览器阻止了

    • 什么是 “别人的服务器” 呢?

      • 当 请求协议/域名/端口号 有任意一个不同的时候,那么就算是别人的服务器
      • 这个时候就会触发同源策略
    • 我们管触发了 同源策略 的请求叫做跨域请求

    实现一个跨域请求

    • 有的时候我们是需要实现跨域请求的
    • 我们需要多个服务器给一个页面提供数据
    • 那么这个时候我们就要想办法解决跨域问题

    JSONP

    • jsonp 是我们实现跨域请求的手段,是把我们之前的东西组合在一起使用的技术手段而已
    • 利用的是 script 标签来实现

    script 标签的本质

    • 浏览器给我们提供了一个 script 标签

    • 它的本质就是请求一个外部资源,是不受到同源策略的影响的

    • 同时 script 标签的 src 属性,也是一种请求,也能被服务器接收到

    • 并且:

      • script 标签的 src 属性请求回来的东西是一个字符串,浏览器会把这个字符串当作 js 代码来执行
    • 所以我们就可以利用这个 script 标签的 src 属性来进行跨域请求了

    CORS 实现跨域请求

    <?php
    header("Access-Control-Allow-Origin:*");
    header("Access-Control-Request-Methods:GET, POST, PUT, DELETE, OPTIONS");
    header('Access-Control-Allow-Headers:x-requested-with,content-type,test-token,test-sessid');
    ?>
    

    配置代理

    • 代理,分成两种,正向代理和反向代理

    正向代理

    • 有一个客户端需要向一个非同源的服务器B发送请求
    • 我们搭建一个和客户端同源的服务器A
    • 当客户端发送请求的时候,由服务器A来接受
    • 再由服务器A向服务器B发送请求,因为 同源策略是由浏览器给的,服务器之间没有
    • 服务器B接受到请求以后,会处理请求,并把响应返回给服务器A
    • 再由服务器A把响应给到客户端就可以了
    • 我们就可以用这个方式来进行跨域请求了

    反向代理

    • 反向代理一般是用来做负载均衡的
    • 当我请求一个服务器的时候,其实请求的是服务器端设置的代理服务器
    • 由代理服务器把若干大量的请求分发给不同的服务器进行处理
    • 再由服务器把响应给到代理服务器
    • 代理服务器返回给客户端

    起源地下载网 » 前端跨域请求的处理

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元