Proxy Hoverfly mock未被代理的Axios请求击中

我想使用Hoverfly模拟API响应。它是从命令行工作的，但不是从我的实际应用程序

即使在像新用户示例这样简单的情况下，问题仍然存在。与中一样，我创建了一个日志，其中包含：

hoverctl start
hoverctl mode capture
curl --proxy http://localhost:8500 http://time.jsontest.com
hoverctl export simulation.json
hoverctl stop

然后设置模拟，如中所示：

这工作正常，按预期显示保存的结果。但当我试图从我网站的本地开发环境中点击模拟响应时，失败了。该站点（create react app的稍加修改版本）使用Axios进行请求，我的组件定义中的相关代码为：

state = {
    error: null,
    isLoaded: false,
    apiData: null
};

componentDidMount() {
    let apiUrl = "http://time.jsontest.com";

    axios.get(apiUrl, {
        proxy: {
            host: 'localhost',
            port: 8500
        }
    }).then(
        result => {
            this.setState({
                isLoaded: true,
                apiData: result.data
            });
        }
    );
}

当我在我的开发环境中加载页面时（即在浏览器中加载

localhost:3000

），它会发出一个真实的网络请求，并从实时API获取最新的实际时间，而不是从Hoverfly中保存的模拟时间

我认为这是某种代理问题，因为代码正在工作，而不是没有按预期处理请求。在中似乎没有其他有用的代理选项。如何让我的应用程序使用模拟值

state = {
    error: null,
    isLoaded: false,
    apiData: null
};

componentDidMount() {
    let apiUrl = "http://time.jsontest.com";

    axios.get(apiUrl, {
        proxy: {
            host: 'localhost',
            port: 8500
        }
    }).then(
        result => {
            this.setState({
                isLoaded: true,
                apiData: result.data
            });
        }
    );
}