url带#号，微信支付那些坑

最新推荐文章于 2024-01-03 19:09:55 发布
最新推荐文章于 2024-01-03 19:09:55 发布
阅读量875 收藏
点赞数
分类专栏： 微信公众号 微信支付

现在前端很多框架的前端路由都带#号，主要为了做到无刷新跳转页面。

在微信公众号做微信支付时，配置的支付路径比如是http://www.eee.com/#/order，在调微信支付的方法时错误信息是‘URL未注册’。

我的解决方案是，写一个专门做为微信支付的页面，ajax请求后台返回需要调取微信支付的数据（签名等信息），然后把这些信息暂存起来（可以用h5的缓存，记得支付完清掉，如果用node，可以用node的缓存，以自己的实际项目方便）。跳转到支付的页面

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body></body>
<script type="text/javascript">
document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
var request = {};
if (sessionStorage && sessionStorage.wechatPayRequest) {
request = JSON.parse(sessionStorage.wechatPayRequest);
}
WeixinJSBridge.invoke("getBrandWCPayRequest", {
appId : request.appId,
timeStamp : request.timeStamp,
nonceStr : request.nonceStr,
"package" : request.packageInfo,
signType : request.signType,
paySign : request.paySign
}, function(res) {
sessionStorage.wechatPayRequest = ''
if ("get_brand_wcpay_request:ok" == res.err_msg) {
// 支付成功
}else {
// 支付失败
}
});
})
</script>
</html>

一个空的页面即可，此处package是关键字，所以需要后台返回一个新的字段代替package。

然后处理支付成功和支付失败的回调

再把这个页面在当前域名下配一个路径，比如当前项目域名是http://www.eeeee.com,就把页面域名指定为http://www.eeeee.com/pay/wechat

然后在微信公众号的后台把支付路径配置为http://www.eeeee.com/pay/

这个方法有个缺点，就是调取支付要跳转页面，用户体验不好，支付完成还要再跳转到相应的页面。

lchu55
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信授权及微信支付跳转回来的路径带有#的hash路径会被忽略
bamboozjy的博客
10-13 2080
使用微信授权和微信h5支付时,需要配置redirect_uri 参数,如果参数里面的路是带有#的hash路径时,#后面的内容会被微信认为是不合法的,然后会被微信忽略掉,比如配置的是 http://www.text.com:8082/index.html#/payResult 微信跳转回来的时候会变成 http://www.text.com:8082/index.html 解决办法: 可以将url进行编码,使用 encodeURIComponent('http://www.text.com:.
公众号微信支付，且报“当前url未注册”的问题解决办法
Max_fzy的博客
03-17 4889
当公众号微信支付，且报“当前url未注册”的问题时候，这里可以明确微信支付配置的授权域名和实际提交的支付地址不一致导致的。
vue-cli公众号调用微信支付（坑）
Z.Dragon 的博客
08-13 2016
id=1（栗子）的形式，而正常的url是https://so.csdn.net/so/search/s.do?通过调试，仔细观察发现，vue的每一个路由访问，路由路径都是index.html#/后面发生路由变化，所以index.html#/就相当于是路由的一级目录，当配置成http://xxx.xxx.com/dist/调用支付，它会认为这不是根目录，怎么解决这个问题？配置url的时候，加上index.html#/：http://xxx.xxx.com/dist/index.html#/
Android—基于微信开放平台v3SDK开发（微信支付填坑）
09-01
在Android平台上进行微信支付开发，通常需要借助微信开放平台提供的v3 SDK来实现。本文将详细介绍如何基于微信开放平台v3SDK进行微信支付的开发，以及解决遇到的一些常见问题。 首先，开发前的准备工作至关重要。你...
微信小程序实战教程：微信支付跳坑流程
03-29
先看一下小程序开发步骤 (此图片来源于网络，如有侵权，请联系删除! ) 步骤 wx.login调用接口获取登录凭证（code） ...URL地址：https://api.mch.weixin.qq.com/pay/unifiedorder post 参数为XML wx.
iOS实现微信支付流程详解
08-29
在Xcode项目中配置app ID是必要的，这涉及到URL Scheme的设置，确保应用能够正确处理微信支付返回的结果。配置完成后，支付流程可以开始。 支付流程通常包括四个主要步骤： 1. **获取订单号**：订单号用于唯一标识...
微信小程序支付开发教程
03-29
微信小程序支付终于踩完坑了，发现里面坑挺大的，现在发个贴，希望以后入坑的同学可以看一下  https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=2  业务流程在这里大家看文档的时候可以...
详解vue项目接入微信JSSDK的坑
01-21
用于记录接入微信JS-SDK的坑，以后方便查询 第一次接入公众号微信支付、分享、定位等等的坑的时候，心里是迷茫而又恐惧。因为，听说坑特别多，后来发现自己的亲身体验到了这一点。 支付的坑 1、当前URL未注册 问题:...
基于vue hash模式微信分享#号的解决
01-19
看代码吧~ // 问题描述在微信中分享到朋友圈或好友时，分享出去的路由被破坏，打开分享的链接，路由中的“#”会被去掉并追加？fromTimeline之类的后缀参数，这就造成了分享出去的链接只能进入首页，无法正常跳转到其他路由。 // 获取签名 this.$ajax.post(this.apiUrl+/api/wxShare/getWxConfig, this.$qs.stringify({url:[removed].href.split('#')[0]})).then((res) => {//有人说要加转译encodeURIComponent本
微信支付 (当前页面URL未注册) 解决方案(angularjs)
weixin_33769207的博客
01-03 1646
微信支付的时候，提示 当前页面URL未注册 ，目前在ios系统中发现，安卓则没有。经过在网上查找资料和验证发现，在ios系统中，当调用微信支付的时候，微信会判断当前页面和微信公众号后台设置的支付授权目录是否一致，他会把页面最后一次刷新的url作为判断依据（如果用户刷新了任何页面，这个页面就是支付页面），这个时候，单页应用的路由中‘#’后面...
H5接入支付流程-微信支付&支付宝支付
最新发布
01-03 7491
业务场景： H5对接微信支付和支付宝支付，app无法发版，需要支持在app内和浏览器内同时使用。 于是借此机会对前端接入对第三方支付进行了调研，本次只讨论微信支付，和支付宝支付。 微信支付 文档地址：微信支付 概述 微信支付方式主要包括，对普通商家主要提供以下7种方式 付款码支付：比如大型连锁店，超市，支付时可以，扫描用户的个人付款码，进行支付，触动场景一般为：用户打开个人付款码-> 收银员扫描仪扫描->门店收银台->商户后台->微信支付系统 JSAPI支付：仅限在微信内使用，可调用
微信网页授权，解决REDIRECT_URL携带#号，微信返回时临时code等参数拼接在URL中间，而不是最后面
qq_37967380的博客
04-12 6147
微信授权获取临时code的URL https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=snsapi_userinfo&state=012#wechat_redirect 授权逻辑代码 通过window.history.pushState({}, 0, jumpURL)解决问题=，其中jumpU.
微信公众号授权链接有#的问题
weixin_45389051的博客
06-13 1852
我们做微信公众号项目的时候，肯定会进行授权，但是这个授权有一个很大很大的bug，就是重定向的时候会默认把#后面的内容给截取掉，然后很容易造成死循环等一系列问题 我们就当需要跳转的链接是这样的： http:22.22.22.22:8080/index.html#/transformAp?Village_id=2 做公众号项目肯定要截取url上的参数对吧，因为这个链接有’#’，所以获取不到Village_id 咋解决呢？ 解决方法一: 把链接换成这样的 http:22.22.22.22:8080/index.
vue 调用共众url_vue+微信公众号开发 网页授权返回url路径中带#不识别，无法授权解决方案...
weixin_35110266的博客
12-23 1858
带个#可真是坑啊！！！第一次开发微信公众号，原本看起来并不复杂，前端负责调接微信接口的地方很少，为了安全起见，大部分接口都是由后端处理，前端只需负责调通后端接口即可，当然还有少部分需要前端来处理。在微信公众号开发中，网页授权第一步需要用户同意授权，获取code ，微信官方提供的获取code接口如下(具体接口介绍请查看微信开发者文档)https://open.weixin.qq.com/conne...
我做微信支付踩过的坑
run 的博客
02-09 3669
刚刚参加实习，很多东西都不懂，微信支付是最近才接触到的，开始去看官方文档的时候，一大堆文字东西说明看的有点蒙圈，好像很难的样子，但是随着慢慢的熟悉，微信支付其实也就那样（事实上我却做了两天微笑，渣渣...），然后这个做了之后我觉得有必要把自己遇到的坑给记一下，再次做到微信支付的开发任务的时候便能够游刃有余了。
调用微信支付api 生成微信支付url
06-07
调用微信支付API生成微信支付URL，需要先进行以下步骤： 1. 获取微信支付的统一下单接口，该接口用于生成预支付订单并返回支付URL； 2. 将生成的预支付订单信息发送给微信支付平台，获得预支付订单号； 3. 通过预支付订单号生成微信支付URL。 下面是一个简单的Java代码示例，用于生成微信支付URL： ```java import java.util.SortedMap; import java.util.TreeMap; import java.util.UUID; import java.security.MessageDigest; import java.security.NoSuchAlgorithmException; public class WechatPay { // 微信支付统一下单接口 private static final String UNIFIED_ORDER_URL = "https://api.mch.weixin.qq.com/pay/unifiedorder"; // 微信支付商户号 private static final String MCH_ID = "your_mch_id"; // 微信支付API密钥 private static final String API_KEY = "your_api_key"; // 微信支付回调URL private static final String NOTIFY_URL = "https://example.com/notify"; /** * 生成微信支付URL * @param body 商品描述 * @param outTradeNo 商户订单号 * @param totalFee 订单总金额，单位为分 * @param spbillCreateIp 终端IP * @return 微信支付URL */ public static String generatePayUrl(String body, String outTradeNo, int totalFee, String spbillCreateIp) throws Exception { SortedMap<String, String> params = new TreeMap<String, String>(); params.put("appid", "your_appid"); params.put("mch_id", MCH_ID); params.put("nonce_str", UUID.randomUUID().toString().replace("-", "")); params.put("body", body); params.put("out_trade_no", outTradeNo); params.put("total_fee", String.valueOf(totalFee)); params.put("spbill_create_ip", spbillCreateIp); params.put("notify_url", NOTIFY_URL); params.put("trade_type", "NATIVE"); // 生成签名 String sign = generateSign(params); params.put("sign", sign); // 发送请求 String xml = HttpUtils.post(UNIFIED_ORDER_URL, XmlUtils.toXml(params)); // 解析响应 SortedMap<String, String> result = XmlUtils.toMap(xml); if (result.get("return_code").equals("SUCCESS")) { String prepayId = result.get("prepay_id"); return generatePayUrl(prepayId); } else { throw new Exception(result.get("return_msg")); } } /** * 生成签名 * @param params 参数列表 * @return 签名 */ private static String generateSign(SortedMap<String, String> params) throws NoSuchAlgorithmException { StringBuilder sb = new StringBuilder(); for (String key : params.keySet()) { String value = params.get(key); if (value != null && !value.isEmpty() && !key.equals("sign")) { sb.append(key).append("=").append(value).append("&"); } } sb.append("key=").append(API_KEY); String str = sb.toString(); MessageDigest md = MessageDigest.getInstance("MD5"); byte[] bytes = md.digest(str.getBytes()); StringBuilder result = new StringBuilder(); for (byte b : bytes) { String hex = Integer.toHexString(0xff & b); if (hex.length() == 1) { result.append('0'); } result.append(hex); } return result.toString().toUpperCase(); } /** * 生成微信支付URL * @param prepayId 预支付订单号 * @return 微信支付URL */ private static String generatePayUrl(String prepayId) { SortedMap<String, String> params = new TreeMap<String, String>(); params.put("appid", "your_appid"); params.put("mch_id", MCH_ID); params.put("time_stamp", String.valueOf(System.currentTimeMillis() / 1000)); params.put("nonce_str", UUID.randomUUID().toString().replace("-", "")); params.put("prepay_id", prepayId); params.put("sign_type", "MD5"); // 生成签名 String sign = generateSign(params); params.put("sign", sign); // 生成支付URL StringBuilder sb = new StringBuilder(); sb.append("weixin://wxpay/bizpayurl?"); for (String key : params.keySet()) { String value = params.get(key); if (value != null && !value.isEmpty()) { sb.append(key).append("=").append(value).append("&"); } } sb.setLength(sb.length() - 1); return sb.toString(); } } ``` 在上述代码中，我们使用了HttpUtils和XmlUtils两个工具类。HttpUtils用于发送HTTP请求，XmlUtils用于将XML格式的字符串转换为SortedMap。你需要根据自己的实际情况实现这两个工具类。 使用该代码，你可以像下面这样生成微信支付URL： ```java String payUrl = WechatPay.generatePayUrl("商品描述", "商户订单号", 100, "终端IP"); System.out.println(payUrl); ``` 其中，参数分别为商品描述、商户订单号、订单总金额（单位为分）和终端IP。执行完上述代码后，你将获得一个微信支付URL，该URL可以用于在微信客户端中打开支付页面。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值