1-jsonp 【前端后端实现】

jsonp: 利用

JSONP优点是简单兼容性好，可用于解决主流浏览器的跨域数据访问的问题。缺点是仅支持get方法具有局限性,不安全可能会遭受XSS攻击。

声明一个回调函数，其函数名(如show)当做参数值，要传递给跨域请求数据的服务器，函数形参为要获取目标数据(服务器返回的data)。

创建一个

服务器接收到请求后，需要进行特殊的处理：把传递进来的函数名和它需要给你的数据拼接成一个字符串,例如：传递进去的函数名是show，它准备好的数据是show('我不爱你')。

最后服务器把准备的数据通过HTTP协议返回给客户端，客户端再调用执行之前声明的回调函数（show），对返回的数据进行操作。

2-CORS 【后端实现】

CORS：跨域资源共享（CORS）是一种机制；当一个资源访问到另外一个资源(这个资源放在

不同的域名或者不同的协议或者端口)，资源就会发起一个跨域的HTTP请求需要浏览器和服务器同时支持；

整个CORS通信，都是浏览器自动完成。浏览器发现了AJAX请求跨源，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感觉；
实现CORS的关键是服务器，只要服务器实现了CORS接口，就可以跨源通信
服务器对于不同的请求，处理方式不一样；有简单请求和非简单请求

3-proxy 【前端实现只适用于本地development开发环境】

// 配置反向代理
    proxy: {
      // 当地址中有/api的时候会触发代理机制
      '/api': {
        target: 'http://ihrm-java.itheima.net/', // 要代理的服务器地址  这里不用写 api
        changeOrigin: true // 是否跨域
        // 重写路径
        // pathRewrite: {}
      }
    }

4-nginx 【后端实现】

好了,这边已经给大家介绍到这里,以上是我自己的理解,希望可以帮到大家, 欢迎留言我这边一定会第一时间给大家解答,喜欢的可以点赞收藏
🐣---->🦅 还需努力!大家一起进步!!!

跨域的几种解决方案

1-jsonp 【前端后端实现】

2-CORS 【后端实现】

3-proxy 【前端实现 只适用于本地development开发环境】

3-proxy 【前端实现只适用于本地development开发环境】