SpringMVC微信公众号支付

刚写完微信公众号支付,把小问题总结一下,以免再写的时候又忘了。

绑定开发者账号,不然没有权限开发:微信公众平台==>设置==>人员设置


微信公众平台==>安全中心==>设置IP白名单,不然之后会报错IP没有权限。

微信公众平台==>开发==>开发者工具 ,绑定自己的微信号,方便PC上用微信测试



大致流程:在页面上配置JS-SDK的配置信息。调用统一下单,下单成功后在页面上唤起支付。

JS-SDK说明文档地址:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

接下来按照步骤:

第一部分是jsapi的config相关配置:

1.绑定域名,JS接口安全域名没什么坑,下面的网页授权域名是微信授权登录用的

2.引入JS文件,没坑

3.通过config接口注入权限验证配置。所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次)

   写在支付调用的页面(第二步的js需要引入,开发阶段debug可以改为true,会提示错误信息)


 这个timestamp和还有nonceStr和签名用的是相同的值。

 签名方式按照要求用sha1,jsApiList 填 "chooseWXPay"(微信支付)

 这些东西都在Controller中准备好传到页面。

 这个签名跟下单的签名不是一个签名,跟后来的唤起支付也不是一个签名。

        

    这里要先获取access_token:接口地址 
        https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET

我们需要的是jsapi_ticket这个东西,所以需要拿刚获取到的access_token再次调用接口获取jsapi_ticket,接口地址:

    https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=wx_card


取到jsapi_ticket然后tokentimestampjsapi_ticketurl四个参数进行字典序排序,在用sha1加密就得到签名signatrue了

二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二二

 然后是统一下单的接口,这里就不做介绍了,需要注意的是下单用的签名和之后唤起微信支付的签名不是一个签名,参与签名的参数不一样。还有就是需要传openid这个参数。

下单成功后就可以走唤起微信支付的js了,看唤起需要传入的参数


 package需要我们从统一下单成功后接口的返回值中取prepay_id,这里有一个坑。

 paySign:签名(跟config和下单的签名都不是一个签名,也不是下单成功后返回的sign,特别要注意签名的大小写问题)

 signType:MD5

 package在jsp页面上需要的是 prepay_id=XXXXX  这种格式,而不是后面的值:XXXXX

 而且,签名中package用的也是 prepay_id=XXXXX 参与签名的,这个问题不仔细点真的烦啊。

 给页面传值:


    参与签名:


    还有一点也需要特别注意了:


 也就是说除了appIdtimeStampnonceStrpackagesignType这几个参数,还有一个参数

 也要参与签名:key key设置路径:微信商户平台(pay.weixin.qq.com)-->账户设置-->API安全-->密钥设置

  参数设置完后,商户平台上也有需要设置的东西,这里也有个坑,就是JSAPI的支付授权目录。

  设置途径:商户平台==>产品中心==>开发配置


 这里有两个地方需要注意:

1:添加完成后距离正式生效有10分钟左右延迟,这个非常重要,我就是因为这个导致一直提示验签失败。。

2:支付目录的配置,网上有好多支付目录的问题,说的都是页面所在的目录。我用的是SpringMVC,支付页面的访问路径是

  localhost:8081/项目名/order/toOrderh5.html ,所以配置的JSAPI的授权目录是 : localhost:8081/项目名/order/

到此为止,下单成功后可以拿到的参数,加上签名就都有了,直接传给页面就可以唤起公众号微信支付了。

强烈建议测试的时候用苹果手机。提示的错误信息比较全面,安卓的只有一个诡异的信息  chooseWXPay:fail


### 微信公众号集成支付功能并展示资源 为了实现在微信公众号中用户支付成功后自动弹出对应资料的功能,需遵循以下方法: #### 服务器端配置 在服务端采用SpringMVC框架处理来自前端的请求。当接收到用户的支付指令时,应先验证订单状态,并向微信支付平台发起预支付请求获取`prepay_id`参数[^2]。 ```java // 创建统一下单接口对象 WxPayUnifiedOrderRequest orderRequest = new WxPayUnifiedOrderRequest(); orderRequest.setBody("商品描述"); orderRequest.setOutTradeNo(orderId); orderRequest.setTotalFee(totalPrice); orderRequest.setSpbillCreateIp(ipAddress); orderRequest.setNotifyUrl(notifyUrl); // 支付回调通知URL orderRequest.setTradeType("JSAPI"); // H5页面内调用微信支付 orderRequest.setOpenid(openid); // 调用微信支付统一下单接口 WxPayService wxPayService = ...; WxPayUnifiedOrderResponse response = wxPayService.createOrder(orderRequest); String prepayId = response.getPrepayId(); // 获取预支付交易会话标识 ``` #### 前端页面设置 利用uni-app构建移动端应用界面,在准备就绪的情况下执行如下JavaScript代码片段以启动微信内置浏览器中的支付流程。 ```javascript wx.chooseWXPay({ timestamp: '{timeStamp}', // 时间戳 nonceStr: '{nonceStr}', // 随机串 package: 'prepay_id=' + prepayId, signType: 'MD5', paySign: '{sign}', // 签名 success(res){ alert('支付成功!'); window.location.href='/path/to/resource'; // 成功跳转到指定链接 }, fail(err){ console.error('支付失败', err); } }); ``` #### 后台逻辑优化建议 考虑到用户体验以及安全性考量,推荐的做法是在支付成功的回调函数里重定向至特定路径加载所需数据而不是立即呈现敏感信息。这样可以防止因网络延迟或其他异常情况导致的信息泄露风险。 此外,对于每次访问受保护的内容前都应当重新确认当前登录者的身份及其是否有权查看该部分内容,从而进一步保障系统的安全性和稳定性[^1]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值