react中做proxy代理解决options的问题

在日常的开发中，为了快速开发，一般都是前后端分离，那么在开发过程中联合调试就成了必不可少的事情了。

在做react项目时，为了方便快捷的开发，一般不会将前端代码编译后再放到服务器上同后台一起调试。常用的方式就是在本地就可以直接调试对接接口，那么使用create-react-app做react快速开发下，就会出现本地起了一个服务，然后通过这个服务区访问服务器上的资源，这样就会产生跨域的问题，时如果不绕过options就会出现后面的请求无法在ajax请求时就会发出两个请求，一个options，一个post/get这种简单的请求。这发送。

我查询了一下网上的介绍，options的出现一般是跨域下产生的，ajax/http会发生两个请求，一个是options，这个请求会去服务端确认一下是否支持跨域操作，如果后台放行，那么你后来的请求就可以正常的发送。

当然这种情况只会出现在跨域操作中，也就是我现在的本地起了一个服务，然后去访问另外一个服务。在实际生产环境中，前后端都是在同一台服务器上的，所以不存在跨域的问题。

那么怎么在本地开发的环境中解决这个问题呢？

使用create-react-app去创建react项目时，我们只需要在package.json中设置代理的参数即可：

"proxy": "http://172.16.101.192:8082",

注意是在package.json的一级节点中进行配置

那么我么在使用npm start 或者yarn start时，本地会起一个http://localhost:3000/的端口，此时再通过代理访问服务器时就可以正常的请求了

更多跨域信息参考：

https://blog.csdn.net/hant1991/article/details/74931158

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS