vue+express 开发环境跨域问题总结

其实以前遇到过这个问题，当时对跨域很陌生，也不知道为什么会存在这个跨域的问题，记得当时找了很多资料，虽然最后根据网上的资料照葫芦画瓢的解决了，但是这事在我心底留下了很难的印象，现在做大论文项目，准备前后端联调接口的时候，又出现了这个问题，找出以前的vue项目配置照葫芦画瓢发现居然行不通，甚是烦恼。目前猜想可能还是我对配置文件理解不够深透导致的，所以在这里开个帖子，记录一下自己自己解决这个问题的过程，把这个瓜彻底的啃透！！！fighting！！！

ps:此贴目前着重针对开发环境哈，生产环境不细究

一、跨域问题存在的原因 

当你看到浏览器报类似的错，那就是跨域了，但其实如果你看后端日志，是有调用记录的：

 由此看出，这个错是浏览器报的错，报错的原因在于浏览器的同源策略，虽然我前端和后端项目都在本地，但是由于端口号不同，所以才会引起跨域的问题。

同源：协议、域名、端口号均需相同。                                                                                                                                                                                                                                                   

二、解决

 目前我所了解到的开发环境主要有两种解决方案：一种是从前端着手，采用代理去访问后端，绕开浏览器的同源策略，另一种是从后端着手，在后端项目中配置头部，允许跨域。

一开始我按照网上的教程去配置了vue cli的配置文件

然后重新跑一下npm run serve，结果还是一直报错，让我一度以为是自己哪里设置的不对。

之后抱着试一试的想法改了一下后端

发现这样居然就可以了！！

看来是要前后端都去设置一下 。

虽然最后发现解决起来很简单，但是解决的过程还是很折磨人的。。。。