微信公众号整合JSAPI支付方式入门基础步骤

A001
2,544 阅读3分钟

这是我参与8月更文挑战的第6天，活动详情查看：8月更文挑战

前置清单

  • 公众号：APPID
  • 商户号：MCHID
  • 安全操作证书：apiclient_cert
  • API密钥：apiclient_key
  • APIv3密钥：在商户平台所设置的密钥
  • 域名：HTTPS协议(443)

微信平台端配置

商户平台

  • 支付目录授权(授权可访问目录)：商户平台 > 产品中心 > 开发配置 > 支付配置 > JSAPI支付 > 添加目录

公众号平台

  • 网页授权域名(获取用户openid)：公众号设置 > 功能设置 > 网页授权域名 > 设置
  • 授权回调页面域名(限制可回调页面)：设置与开发 > 开发 > 接口授权 > 网页服务 > 网页授权 > 修改 > 网页授权域名 > 设置

相关配置详情可移步到官网进行查看：pay.weixin.qq.com/wiki/doc/ap…

进入开发

业务流程图

微信JSAPI支付流程图

前端

  1. 拉取用户信息基本步骤

    • 通过用户授权，获取code

      • 引导关注者打开链接： https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redire

      • APPID：公众号的唯一标识

      • REDIRECT_URI：授权后重定向的回调链接地址， 请使用 urlEncode 对链接进行处理

      • SCOPE:

        • snsapi_base：静默授权，只能获取用户openid
        • snsapi_userino：弹窗授权，获取用户基本信息

      • STATE：重定向后会带上state参数，开发者可以填写a-zA-Z0-9的参数值，最多128字节

    • 通过code换取网页授权access_token
      • 请求地址： https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
    • 拉取用户信息

      • 请求地址： https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN

  2. JSAPI下单

    • 调用后端接口生成预付单，得到prepay_id(预支付交易会话标识。用于后续接口调用中使用，该值有效期为2小时)。
    • 请求示例
    { 
    "mchid": "1900006XXX",
    "out_trade_no": "1217752501201407033233368318",
    "appid": "wxdace645e0bc2cXXX",
    "description": "Image形象店-深圳腾大-QQ公仔",
    "notify_url": "https://weixin.qq.com/",
    "amount": { "total": 1, "currency": "CNY" },
    "payer": { "openid": "o4GgauInH_RCEdvrrNGrntXDuXXX" }
}

  3. JSAPI调起支付

    • 成功取得prepay_id后，需要再次通过JSAPI来调起微信支付收银台(该操作使用的是微信浏览器内置对象，只能通过微信浏览器来触发)。

后端

  1. 添加依赖

    • gradle
    implementation 'com.github.wechatpay-apiv3:wechatpay-apache-httpclient:0.2.2'
    • maven
    <dependency>
 <groupId>com.github.wechatpay-apiv3</groupId>
 <artifactId>wechatpay-apache-httpclient</artifactId>
 <version>0.2.2</version>
</dependency>

  2. 初始化httpClient

// 加载商户私钥]（privateKey：私钥字符串） 
PrivateKey merchantPrivateKey = PemUtil .loadPrivateKey(
new ByteArrayInputStream(privateKey.getBytes("utf-8"))); 

// 加载平台证书（mchId：商户号,mchSerialNo：商户证书序列号,apiV3Key：V3密钥）
AutoUpdateCertificatesVerifier verifier = new AutoUpdateCertificatesVerifier(
new WechatPay2Credentials(mchId, 
new PrivateKeySigner(mchSerialNo, merchantPrivateKey)),apiV3Key.getBytes("utf-8")); 

// 初始化httpClient
httpClient = WechatPayHttpClientBuilder.create()
.withMerchant(mchId, mchSerialNo, merchantPrivateKey)
.withValidator(new WechatPay2Validator(verifier)).build();

  1. 接收下单请求，生成预付单

    • 请求地址：https://api.mch.weixin.qq.com/v3/pay/transactions/jsapi
    • 相关参数及错误码：https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_1_1.shtml

  2. 接收支付结果通知

    • 请求地址：https://api.mch.weixin.qq.com/v3/pay/transactions/id/{transaction_id}
    • 相关参数及错误码：https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_1_2.shtml

  3. 关闭订单

    • 请求地址：https://api.mch.weixin.qq.com/v3/pay/transactions/out-trade-no/{out_trade_no}/close
    • 相关参数及错误码：https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_1_3.shtml

小结

在前端部分，需要通过微信提供的链接进行重定向，同时拿到code，再通过code得到access_koken,最终得到用户openid以及预付单号prepay_id。这时就可以通过微信浏览器内置对象唤醒微信支付，从而发出支付请求。

后端这边则是要提供

  • 给前端获取预付单prepay_id的接口
  • 接收支付成功(notify_url)通知的接口
  • 查询订单状态
  • 关闭订单

其他的例如扫码支付等方式方式与JSAPI类似，可到官网查看相关参数说明进行修改 pay.weixin.qq.com/wiki/doc/ap…

avatar
文章
阅读
粉丝