前端开发过程中跨域问题解决方案

[bytemofan]

前端开发过程中，总是会遇到跨域的问题。解决开发过程中的跨域问题的方式有多种：

• webpack的webpack-dev-server提供的proxy功能
• nginx反向代理
• nodeJS原生实现
• nodeJS的代理模块http-proxy
• windows系统下使用Fiddler
• MacOS系统下使用charles

思路就是把前端的API访问地址代理到对应的服务器地址或文件上去，比如开发时，我们访问的API为： http://localhost:8000/m/user/info 我们要拿到数据，就得代理到服务器或mock服务器： http://xxx.test.com/m/user/info。 也就是访问http://localhost:8000/m/user/info实际上就是在访问http://xxx.test.com/m/user/info。

但我们做前后端分离时，需要在线上环境使用代理服务的时候，在不希望使用nodejs的情况下，nginx就成了我们最好的选择，借助 Nginx 强大的反向代理功能，我就在开发机上轻松的模拟出了真实环境，并且可以愉快的开发和调试了。