Ant Design Pro 使用代理服务器

前端小白最近使用antd pro脚手架开发一个项目,开始项目前对dva进行了简单的了解。由于我使用的是第二个版本,网上的介绍都是针对第一个版本的,因此熟悉项目的时候是一头雾水,前期的开发阶段在构建界面时是真的方便,封装好的组件可以直接拿来用,但是要与后台数据进行交互时就遇到了难题。antd pro2.0使用了umi的知识,对于我这个小白来说简直就是天书了。

项目中默认会读出mock的模拟的数据,网上的介绍都是对roadhog,webpackrc文件进行修改,2.0对这两个文件进行了修改,整合到了config目录下的config.js文件中,根据这个线索,将proxy代理服务器的地址直接放在config.js文件中就可以了。

Ant Design Pro 使用代理服务器_第1张图片

这样修改后能取到后台接口的数据,但是在浏览器调试工具Network中现实的路径任然是默认的localhost。不要慌,我因为这个问题一直觉得是自己写错了,检查了半天后发现,断掉后台的服务器会报服务器断开的错误,描述如下:

[HPM] Error occurred while trying to proxy request /loginapi/login from localhost:8000 to(代理服务器的路径,就不贴出来了)(ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)

说明在获取信息的时候会转到代理路径中,之前的写法是正确的。还有就是在package.json文件中有两种启动的方式,直接使用第一种npm start即可。我在之前一直用第二个no-mock,发现没什么变化,可能是我不懂这里的原理吧,哈哈哈哈。

这个问题就这样完美的解决了

你可能感兴趣的:(Ant Design Pro 使用代理服务器)