跨域几种解决方案(一)

一、JSONP:

利用script标签可跨域的特点,在跨域脚本中可以直接回调当前脚本的函数


1)jsonp出现背景简介:

1、出现跨域的原因:浏览器同源策略导致


2、浏览器同源场景:同一协议、同一域名、同一个端口


3、类比正常使用场景:script、img、a 的src hrep 标签属性a、举一例分析:img src 获取一张图片 get请求 获取文件流展示到页面上


4、josnp利用该原理而产生:
a、仅get请求 传参里面包含js函数名称
b、接口返回内容里面包含一个js 函数名称c、页面上解析返回内容并调用该js函数


5、代码:

跨域几种解决方案(一)

跨域几种解决方案(一)

二、CORS:服务器设置HTTP响应头中Access-Control-Allow-Origin值,解除跨域限制1、代码

跨域几种解决方案(一)


三、通过中间接口转发 避免前端页面出现跨域问题

跨域几种解决方案(一)

四、搭建API网关 跨域几种解决方案(一)

五、正向代理和反向代理比较


  • 从用途上来讲:
    • 正向代理的典型用途是为在防火墙内的局域网客户端提供访问Internet的途径。正向代理还可以使用缓冲特性减少网络使用率。
    • 反向代理的典型用途是为后端的多台服务器提供负载平衡,或为后端较慢的服务器提供缓冲服务。


  • 从安全性来讲:
    • 正向代理允许客户端通过它访问任意网站并且隐藏客户端自身,因此你必须采取安全措施以确保仅为经过授权的客户端提供服务。
    • 反向代理对外都是透明的,访问者并不知道自己访问的是一个代理。


  • 从使用方来看:
    • 正向代理是浏览器端进行配置的,与服务器端无关,甚至可以对服务端隐藏。
    • 反向代理是服务器端配置的,对浏览器端是透明的。


上一篇:Prometheus原理简介


下一篇:docker nginx 部署 vue项目