背景：
平时在本地开发调试web项目时候，如果遇到http请求必须是同域的情况，由于本地开发的域名跟请求的域名一般不一致就会容易导致出现跨域的问题，为了能更好在本地调试cgi，下面结合webpack简述几个小技巧。
方法1：
在本地开发模式下，不使用绝对路径来请求cgi，使用相对路径，并且在webpack devServer里面配置好proxy。例如：
// 下面是webpack的部分配置
module.exports = { devServer: {
proxy: {
'/cgi/aaa': {
target: 'http://aa.bb.cc'
}
}
}
}
// 你的js文件里面cgi路径配置
const host = '/cgi/aaa'优点：简单易用，适用于cgi origin跟页面的origin一致的情况。
缺点：如果后台对浏览器发出的ajax请求作了重定向验证，浏览器则会根据当前的重定向url作相同的ajax请求，如果当前的页面orgin跟cgi的origin不一致，则还是会出现跨域的情况。见：docs.newrelic.com/docs/browse…
方法2：
在方法1的基础上改造下，既然方法1的缺点是因为浏览器本身的机制引起的，那么是否可以中间设置一层代理呢？答案是可以的。由于是用webpack开发，相当于本地起了一个node服务，那么在本地服务作一层代理，页面请求的cgi先到本地node服务，然后在由本地node服务发起真正的cgi请求（node端是不存在跨域的），请求到数据后在返回给客户端。例如：
module.exports = {
devServer: {
before: function(app) {
const axios = require('axios')
app.get('/cgi/*', function(req, res) {
axios
.get(`http://aa.bb.cc${req.path}`, {
params: req.query
})
.then(response => {
res.json(response.data)
})
.catch(error => {
console.log(error)
})
})
}
}
}注：
1）axios单纯只是为了在node发起http请求（也可以使用其他http请求库），目前只列出get请求处理方式，post请求同理。
2）webpack devServer before配置的app参数可以拿到本地的node服务实例。
3）如果登录态需要cookie，需要在代理层设置header
{ Cookie: req.headers.cookie }优点：解决复杂的重定向问题，并且可以在开发中自定义cgi操作。
缺点：需要理解webpack配置。
方法3：
如果你的业务不存在上面方法1所说的缺点问题，并且你又不想用webpack，那么有个懒人方法：安装chorme插件Moesif CORS。
总结：
好吧，跨域有关前端处理部分先讲到这里，当然跨域的解决方式不止上面...
