解决前端跨域问题方法之一配置Apache反向代理拿接口数据

反向代理的原理图解

1. 由于跨域阻止了我们数据请求，所以转变思路，我们不发送跨域请求了，直接请求当前域名中的内容
2. 服务器在接收到数据请求之后将数据请求转发给接口服务器
3. 接口服务器先将数据返回给web服务器
4. web服务器再将接口服务器返回的数据转发给浏览器
5. 从studyit.com发送请求到api.botue.com浏览器产生了跨域，被浏览器截止了！
   注意：使用反向代理会增加服务器负担，访问量大的话，服务器就容易崩。

原理：
请求数据，不再直接请求接口服务器，而是请求自己的网页服务器，就不会再有跨域问题的产生。
自己的网页服务器上，需要做些许的配置，帮我们转发数据请求到接口服务器！

配置步骤如下：

1. 打开httpd.conf，搜索proxy，将下面两行代码注释去掉

LoadModule proxy_http_module modules/mod_proxy_http.so
LoadModule proxy_module modules/mod_proxy.so

1. 打开httpd-vhosts.conf文件（C:\wamp\bin\apache\Apache2.2.21\conf\extra\httpd-vhosts.conf），在需要跨域的页面域名节点下加入下面两个配置项

<VirtualHost *:80>
ProxyRequests off    #代理服务器正向代理关闭了
ProxyPass /api http://api.botue.com/v3    #代理转发路径；/api是随意写的，只是指定一个名字，让这个名字帮忙拿数据。
#例如：
#http://studyit.com/api/teacher
#http://api.botue.com/v3/teacher
#是完全等价的
</VirtualHost>

3. 重启wamp

作者：pingping_log
链接：https://www.jianshu.com/p/753b914f1d22
來源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。