使用Apache反向代理解决js跨域请求的一个方案

作为一个对后台知识一知半解的小白，你让我配置后段代码，说实话是真的难为我了，所以，找一个好的解决方案对我这种后台知识一知半解的小白来说是很有必要的，这个方案就是反向代理，这是解决js跨域请求的一种解决方案。我们百度一下跨域请求的解决方案会发现有很多解决方案，在一种简便、高效、常用的解决方案很重要，尤其是着一种适合自己并适合团队开发的案例很重要。好的废话有点多了，我就说一下对于团队开发来说很重要的开发方式服务器（Apache）的反向代理。

什么是反向代理

说道反向代理，我们就会想到，会不会有正向代理，答案是肯定的。我们知道反向代理是可以解决js跨域请求的问题的，在请求时会隐藏服务器端，用户不用管服务器端是那个服务器像我们提供了资源，那么正向代理呢，正向代理就是隐藏客户端，这种方式可以解决 墙的问题，如我们不能访问Google，我们可以在国外搭建一个服务器，使用正向代理就可以实现翻墙，我们使用的翻墙软件就是用这种方式解决的。

反向代理的优势

总结为一条就是节约时间。怎么讲呢，前端开发需要掉用接口，如果要从 服务器下载代码到本地需要花费时间内吧，下载完毕，配置本地环境需要时间吧，如果遇到像我这样的小白不会配置，就要浪费时间和浪费人力了，与此同时大家都知道，配置服务器环境有一点不一致将会发生api接口就会发生错误。

方案介绍

我最近的一个项目仿照了中国林业产权交易所的echarts图，要实现如下图的效果。

效果图

第1步，你需要搭建一个本地的服务器，我是用的是wampserver这样一个集成软件，安装简单，操作方便。
第2步，找到文件httpd.conf（文件在 wamp64\bin\apache\apache2.4.18\conf\ 目录下）

LoadModule proxy_module modules/mod_proxy.so wapserver3.04 144行

LoadModule proxy_http_module modules/mod_proxy_http.so wapserver3.04 152行

去掉这两列前的‘#’，
第3步，找到httpd-vhosts.conf()

#
# Virtual Hosts
#

<VirtualHost *:80>
 ProxyRequests off
 <Proxy *>
     Order deny,allow
    Allow from all
</Proxy>
ProxyPass /news http://www.chinaforest.com.cn/forest-main/news
</VirtualHost>

其中，ProxyRequests off，就是反向代理的意思，而 ProxyPass /本地服务器的URL空间 远端的服务器，配置完成后，就可以使用http://localhost/news/ 代替http://chinaforest.com.cn/forest-main/news的访问

第4步，当你调用接口你会发现在chrome浏览器中提示如下图的[Provisional headers are shown]，
你可以在服务器端 添加 echo header("Access-Control-Allow-Origin:*");

[Provisional headers are shown](http://blog.csdn.net/wyfhist/article/details/38511319)

最终结果，在控制台中查看代理xhr如下图：

结果