ant-design-pro 如何使用本地服务器api，不使用mock_JavaScript_论坛

ant-design-pro 如何使用本地服务器api，不使用mock

kg***25 分类：JavaScript 人气：1091 回帖：2 发布于6年前收藏

ant-design-pro中使用了mock，我想不使用mock，测试我本地用nodejs起的api服务器。

我在.roadhogrc.mock.js中禁掉了mock

// 是否禁用代理
// const noProxy = process.env.NO_PROXY === 'true';
const noProxy = true

保存并刷新网页，发现mock的数据确实没了。然后我在ant-design-pro的package.json中加入了

"proxy": "http://localhost:9000",

以前我用create-react-app也是这么做的，只要node起一个监听9000端口的服务器就可以调试api了，但是在ant-design-pro中这么做好像行不通，fetch的时候总是404。

正常情况如下，这是我用create-react-app访问的，create-react-app监听的3000，使用proxy访问的本地9000端口：

可以看出是create-react-app访问成功了

ant-design-pro的情况如下，ant-design-pro监听的8001端口，也使用proxy访问的本地9000端口：

ant-design-pro请求失败了，我保证api没错，api测试如下。

请问我该如何使用本地服务器api，而不使用mock。
感谢大神们帮忙！！！

标签：css html html5 javascript

讨论这个帖子（2）垃圾回帖将一律封号处理……

Lv4 码徒

那***n 产品经理 6年前#1

直接把package.json里的proxy去掉，把你要访问的api地址写成localhost:9000/url

Lv3 码奴

起***劲页面重构设计 6年前#2

还是让老子自己来回答吧，ant-design-pro的官方文档里有

不过文档是有问题的，官方guihub的issue里也有很多人踩了这个坑，解决方法如下：

官方文档说这样修改就可以了
// .roadhogrc.mock.js
export default {
  'GET /api/*': 'https://your.server.com/api/',
};
测试后行不通，应改为如下
export default {
  'GET /api/*': 'https://your.server.com/',
};
api可能路径不一定这么单一，进一步修改如下
export default {
  '/*': 'https://your.server.com/',
};

直接这么写有些粗暴，万一以后想用mock还得手动改回来，实际上官方已经做了启动命令了。

// .roadhogrc.mock.js
const noProxy = (process.env.NO_PROXY === 'true');
...
export default noProxy ? {} : delay(proxy, 1000);
意思是如果环境变量NO_PROXY是true，那么就不实用代理

如果直接启动项目：npm start，那么NO_PROXY就是false，这样启动就可以了：npm start:no-proxy

可以看到package.json中有如下启动脚本：
"start": "roadhog server",
"start:no-proxy": "cross-env NO_PROXY=true roadhog server"

那么上面那句三目运算就导出了{},只要把重定向的域名写进去就好了，如下：

export default (noProxy
  ? { "/*": "https://your.server.com/" }
  : delay(proxy, 1000));

文明上网，理性发言！ 😉 阿里云幸运券，戳我领取