记一次跨域问题的解决方案

用Vue.js写了个页面，显示开发、测试环境下各项目正在运行的分支情况（相对QA较为有用）。

原理：调用Jenkins提供的API，
限制：Jenkins的API只返回了最近100条记录，在没有数据库保存历史数据的情况下，并不能真正实现查看所有项目的当前运行分支情况（例如一些低频发布的应用就可能不在这100条记录里面），但对于发布频繁的测试环境来说，100条记录足够了；

代码本身没什么技术含量，但由于是一个纯前端页面，所以不可避免地遇到了跨域这个问题。

看了一下解决跨域问题的文章，主流的解决方法基本基于JSONP和CORS，然而这两种方法都需要后端配合，not BIGGER；

然后参考了一下main-static上的nginx配置，发现用的CORS方案，not BIGGER；

然后突然想到我们用的是nginx反向代理，是否可以通过nginx来欺骗浏览器以为是同源访问呢？（灵感来自于文末的插件）

往这方面搜了一下，果然有这方面的文章，而且综合对比了几种解决方案，这种方案是成本最低的，不涉及代码改造，只需要nginx配置一下即可；

遂找运维说明了一下情况，然后运维以迅雷不及掩耳盗铃之势加上了以下的配置：

location /devjob/ {
    proxy_pass http://dev.jenkins.***.net/job/;
}
location /testjob/ {
    proxy_pass http://test.jenkins.***.net/job/;
}

这样，只要代码里的调用地址改为…/devjob/就能访问到对应域名了；

感谢运维帮忙解决这个问题。

另外安利一个chrome插件Allow-Control-Allow-Origin: *，可以在本地浏览器解决跨域问题，方便调试。