react如何刷新当前页面_QA如何解决当前页面的 URL 未注册

场景

实际项目中，开发一般有多名，为了方便分别开发和测试，则会部署到不同的域名提测。假设域名有 staging、dev1、dev2…开发提交微信支付相关需求后，经过测试发现 staging 环境域名可支付，而dev1、dev2 环境无法进行微信支付，提示 "当前页面的 URL 未注册"。这就产生了一个问题：既需要在 dev 环境查看页面展示，又需要进行支付操作测试，两者没有兼得。

无法触发微信支付的表现

原因

微信支付对域名有限制，开发会预先在微信公众号中设置支付授权域名。前端在触发支付时微信会校验当前域名是否有在商户平台做了配置，否则将验证失败，支付不成功。上述问题场景就是因为 staging 环境域名做了支付域名的授权，而 dev1、dev2 未做支付域名的授权导致。

解决方法

我们可以使用 charles 绕过微信的域名检测，让微信“误以为”页面的域名在 staging ，实际上页面是从 dev 环境中获取。假设 staging 域名为 http://a.b.com，dev 1 环境域名为 a-dev1.b.com，我们要实现查看 dev1页面并完成支付，需要做如下操作：

1、进入 charles > Tools > Map Remote > Add，填写参数值

charles 配置

2、手机连上代理，在微信内打开链接 http://a.b.com，此时不但可查看 a-dev1.b.com 环境下的页面，还能完成支付。

参考链接

https://pay.weixin.qq.com/wiki/doc/api/external/jsapi.php?chapter=7_3