梳理ajax跨域常用4种解决方案(简单易懂)
发布网友
共1个回答
热心网友
自动接触前端，跨域这个概念就一直萦绕在耳畔。跨域需要理解同源策略，这个策略是浏览器为了安全考虑实施的重要机制。默认情况下，Ajax只能获取到同源的数据，对于非同源的数据是无法获取的。同源的概念包括协议相同、域名相同以及端口相同。例如，http://www.example.com/dir/page.html中的协议是http://，域名是www.example.com，端口是80（默认端口可以省略）。如果这个地址中要去访问其他服务器的数据，那么就需要使用跨域来解决。
跨域的实现方式包括反向代理、JSONP、WebSocket和CORS（根本解决方案）。反向代理是使用自己的服务器，请求目标服务器的数据，然后返回给客户端。例如，使用Nginx或Node.js搭建反向代理服务器。反向代理服务器最常用的就是Nginx。以Node.js服务为例，要实现反向代理，前提条件是前端开发环境必须运行在Node.js服务中。通常情况下，前端开发环境的运行环境满足这个条件。例如，有一个后端接口：http://39.105.136.190:3000/daotin/goods/getList，可以获取一些商品列表数据，但运行的Node.js项目是在localhost:3000下的，形成了跨域问题。使用Node.js + express + http-proxy-middleware插件可以解决这个问题。对于使用webpack作为前端自动化构建工具的项目，可以使用webpack-dev-server进行跨域配置，其原理是基于http-proxy-middleware来实现代理请求。
JSONP的实现思路是通过添加一个`
