微信小程序接入微信支付

这篇具有很好参考价值的文章主要介绍了微信小程序接入微信支付。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

开通商户号

微信支付前提是:注册了微信平台后,必须开通企业商户号,需要把工商登记证明,企业银行账户开户证明,组织机构代码等提交上去进行审核https://pay.weixin.qq.com/index.php/apply/applyment_home/guide_normal

微信小程序实现微信支付,支付接入,《uniapp小程序》,微信小程序,微信,小程序
开通商户号之后,我们需要得到密钥,和证书等相关信息,根据如下文档生成:https://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter2_8_1.shtml

小程序绑定微信支付

没有微信小程序的请先开通[企业版才可以],小程序开通微信支付,即申请或复用微信支付商户号,申请完小程序后,登录小程序后台。点击左侧导航栏的微信支付,在页面中进行开通
微信小程序实现微信支付,支付接入,《uniapp小程序》,微信小程序,微信,小程序
绑定APPID : 然后需要添加关联APPID进行绑定,效果如下
微信小程序实现微信支付,支付接入,《uniapp小程序》,微信小程序,微信,小程序
同意授权:回到微信小程序后台 - 在功能中找到:微信支付,去同意授权

接入SDK

微信支付需要准备如下几个参数,参考文档:
https://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter2_8_1.shtml

  • 微信小程序的APPID
  • 微信支付商户号ID :merchantId , 微信支付平台去获取
  • 微信支付证书 :微信支付平台去获取
  • 微信支付商户证书序列号:merchantSerialNumber
  • 微信支付商户APIV3密钥 : apiV3key

微信提供了SDK方便我们接入微信支付:

  • 小程序开发指引:https://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter2_8_2.shtml,

  • 小程序支付文档:https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_5_1.shtml

  • 小程序接口列表:https://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter2_8_3.shtml

  • 小程序,代码案例参考:https://github.com/wechatpay-apiv3/wechatpay-java/blob/main/service/src/example/java/com/wechat/pay/java/service/payments/jsapi/JsapiServiceExtensionExample.java

第一步,我们加入微信提供的Maven包

<dependencies>
    <dependency>
        <groupId>com.github.wechatpay-apiv3</groupId>
        <artifactId>wechatpay-java</artifactId>
        <version>0.2.8</version>
    </dependency>
    <dependency>
        <groupId>com.github.wechatpay-apiv3</groupId>
        <artifactId>wechatpay-apache-httpclient</artifactId>
        <version>0.4.9</version>
    </dependency>
</dependencies>

JSAPI 支付和 APP 支付推荐使用服务拓展类 JsapiServiceExtension 和 AppServiceExtension,两者包含了下单并返回调起支付参数方法。 下面是微信平台提供的快速接入代码案例

/** Native 支付下单为例 */
public class QuickStart {

    public static String appid = "";
    /** 商户号 */
    public static String merchantId = "";
    /** 商户API私钥路径 */
    public static String privateKeyPath = "D:\\itsource\\data\\apiclient_key.pem";
    /** 商户证书序列号 */
    public static String merchantSerialNumber = "";
    /** 商户APIV3密钥 */
    public static String apiV3key = "";

    public static void main(String[] args) {
        // 使用自动更新平台证书的RSA配置
        // 一个商户号只能初始化一个配置,否则会因为重复的下载任务报错
        Config config =
                new RSAAutoCertificateConfig.Builder()
                        .merchantId(merchantId)
                        .privateKeyFromPath(privateKeyPath)
                        .merchantSerialNumber(merchantSerialNumber)
                        .apiV3Key(apiV3key)
                        .build();
        // 构建service
        JsapiServiceExtension service = new JsapiServiceExtension.Builder().config(config).build();
        // request.setXxx(val)设置所需参数,具体参数可见Request定义
        PrepayRequest request = new PrepayRequest();
        Amount amount = new Amount();
        amount.setTotal(100);
        request.setAmount(amount);

        Payer payer = new Payer();
        //支付者的微信OpenId
        payer.setOpenid("xxxx");
        request.setPayer(payer);
        request.setAppid(appid);
        request.setMchid(merchantId);
        
    	//分账
        SettleInfo settleInfo = new SettleInfo();
        settleInfo.setProfitSharing(true);
        request.setSettleInfo(settleInfo);
        
        request.setDescription("测试商品标题");
        request.setNotifyUrl("https://notify_url");
        request.setOutTradeNo("out_trade_no_001"+ DateFormatUtils.format(new Date(),"HHmmss"));
        // 调用下单方法,得到应答
        PrepayWithRequestPaymentResponse response = service.prepayWithRequestPayment(request);
        System.out.println(response);

    }
}

我们需要根据上面的代码案例,分装自己的微信支付逻辑,编写支付Controller接口。小程序端需要请求支付接口。并把返回值相应给APP端,PrepayWithRequestPaymentResponse结果中保护了如下几个结果值
● “timeStamp”: 时间搓
● “nonceStr”: 随机字符串,不长于32位
● “package”: 小程序下单接口返回的prepay_id参数值,“prepay_id=xxxx”
● “signType”: 签名类型,默认为RSA,仅支持RSA
● “paySign”:签名,使用字段appId、timeStamp、nonceStr、package计算得出的签名值

小程序调起支付

小程序端拿到后台返回的支付参数,然后调用wx.requestPayment 调用微信在支付组件完成支付

wx.requestPayment({
      timeStamp: result.timeStamp,
      nonceStr: result.nonceStr,
      package: result.packageVal,
      signType: result.signType,//'MD5',
      paySign: result.paySign,
      success (payRes) { 
          console.log(res);
      },
      fail (error) {
          console.log(error);
      }
})

微信支付结果回调

微信支付结果通知:https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_5_5.shtml

微信支付平台通过notify_url 回调我们的接口来通知我们支付结果,因为我们的项目是在内网部署,如果是线上环境就不存在这个问题,所以这个请求是调不通的,我们需要做内网穿透把我们的应用映射到外网,这样的话支付平台才能回调我们。

Natapp内网穿透教程地址:https://natapp.cn/article/natapp_newbie ,最终效果如下:微信小程序实现微信支付,支付接入,《uniapp小程序》,微信小程序,微信,小程序
当访问该域名相当于在访问:127.0.0.1:10010 ,只不过该域名可以外网访问

我们需要把构建支付请求的参数中的notify_url 修改为该域名地址:比如:

request.setNotifyUrl("http://5qsems.natappfree.cc/pay/wx/notify");

那么该地址对应了 支付服务的controller接口。我们需要去编写对应的notify的controller接口,参考文档小程序支付通知:https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_5_5.shtml 。 根据文档所述,微信通过指定的notify__url来进行支付结果通知,支付结果通知是以POST 方法访问商户设置的通知url,通知的数据以JSON 格式通过请求主体(BODY)传输,通知的数据包括了加密的支付结果详情。我们需要对结果进行签名验证以及参数解密后再进行业务处理。

对于结果应答,接收成功:HTTP应答状态码需返回200或204,无需返回应答报文。接收失败:HTTP应答状态码需返回5XX或4XX,同时需返回应答报文,格式如下:

{  
    "code": "FAIL",
    "message": "失败"
}

支付结果通知处理可以查考官方给的案例:https://github.com/wechatpay-apiv3/wechatpay-java ,找到 回调通知验签和解密部分:
首先,你需要在你的服务器上创建一个公开的 HTTP 端点,接受来自微信支付的回调通知。 当接收到回调通知,使用 notification 中的 NotificationParser 解析回调通知。具体步骤如下:

  1. 使用回调通知请求的数据,构建 RequestParam。
    ● HTTP 头 Wechatpay-Signature
    ● HTTP 头 Wechatpay-Nonce
    ● HTTP 头 Wechatpay-Timestamp
    ● HTTP 头 Wechatpay-Serial
    ● HTTP 头 Wechatpay-Signature-Type
    ● HTTP 请求体 body。切记使用原始报文,不要用 JSON 对象序列化后的字符串,避免验签的 body 和原文不一致。
  2. 初始化 RSAAutoCertificateConfig。微信支付平台证书由 SDK 的自动更新平台能力提供,也可以使用本地证书。
  3. 初始化 NotificationParser。
  4. 调用 NotificationParser.parse() 验签、解密并将 JSON 转换成具体的通知回调对象。

根据官方案例,我们编写我们自己的notify接口代码 ,如下:
● @RequestHeader Map<String, String> headers :注入请求头
● HttpServletRequest :通过请求对象获取body

//支付回调
@PostMapping("/wx/notify")
public WxPayNotifyResult notifyHandler(@RequestHeader Map<String, String> headers,
                                       HttpServletRequest request,
                                       HttpServletResponse response){
    try{
    	//1.拿到body中的内容
        BufferedReader reader = request.getReader();
        StringBuilder stringBuilder = new StringBuilder();
        String line;
        while ((line = reader.readLine()) != null) {
            stringBuilder.append(line);
        }
        String body = stringBuilder.toString();
        log.info("支付结果通知 {}",body);
        //2.调用微信支付结果处理逻辑
        wxPayService.notifyHandler(body,headers);

        //3.响应码:200代表接受成功,5xx代表代表接受失败
        response.setStatus(HttpServletResponse.SC_OK);
        return WxPayNotifyResult.builder().code("SUCCESS").message("成功").build();
    }catch (Exception e){
        e.printStackTrace();
        //响应码:200代表接受成功,5xx代表代表接受失败
        response.setStatus(HttpServletResponse.SC_INTERNAL_SERVER_ERROR);
        return WxPayNotifyResult.builder().code("FAIL").message("失败").build();
    }

}

下面是根据官方案例编写的验证前面和参数解密的代码逻辑
● Transaction :他是解密出来的支付结果参数,包括支付状态,订单号,支付金额等等

public Transaction notify2Transaction(String body, Map<String, String> headers) {
    	
    //从请求头拿到相关参数
    String nonce = headers.get("wechatpay-nonce");
    String signature = headers.get("wechatpay-signature");
    String timestamp = headers.get("wechatpay-timestamp");
    String signaturetype = headers.get("wechatpay-signature-type");
    String  serial = headers.get("wechatpay-serial");

    //构建请求参数对象
    RequestParam requestParam = new RequestParam.Builder()
            .serialNumber(serial)
            .nonce(nonce)
            .signature(signature)
            .timestamp(timestamp)
            .signType(signaturetype)
            .body(body)
            .build();

    // 初始化 NotificationParser , 这里的config是RSAAutoCertificateConfig
    NotificationParser parser = new NotificationParser(config);

    // 以支付通知回调为例,验签、解密并转换成 Transaction
        return parser.parse(requestParam, Transaction.class);

    }

剩下就是根据 Transaction 处理相应的业务结果了。

文章结束,希望对你有所帮助文章来源地址https://www.toymoban.com/news/detail-633733.html

到了这里,关于微信小程序接入微信支付的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信公众号程序或微信小程序接入微信支付流程(前后端程序示例)

      微信公众号程序或微信小程序项目中基本都要有微信支付。支付场景基本就是点击支付,然后手机底部拉起输入微信支付密码弹窗,密码输入正确后,支付完成。但是无论是微信小程序或微信公众号程序都是在后端调用微信api接口进行统一下单,将接口返回数据回传前端

    2024年02月09日
    浏览(47)
  • uniapp微信小程序JSAPI支付前端生成签名,并调起微信支付

    签名方式使用的是SHA256withRSA 插件 npm install jsrsasign 使用

    2024年01月17日
    浏览(46)
  • uniapp - [微信小程序平台] 实现输入支付密码键盘弹框,uniapp小程序端底部弹起密码输入键盘组件效果,类似电商平台支付密码、弹出支付密码输入框、交易密码(详细示例源码,一键复制开箱即用!)

    在uniapp微信小程序端平台,详细实现底部弹出输入支付密码框组件,自定义密码输入框键盘功能(密码自动带星号、黑点保护隐私,自定义数字键盘),类似电商在付款时输入支付密码的组件。 直接复制组件源码,改下样式就能用了。 复制运行即可查看效果。

    2024年02月03日
    浏览(51)
  • uniapp微信小程序接入echarts(踩坑无数)

    因为本次小程序开发使用到了echarts 发现接入有点麻烦,记录一下 使用了uniapp插件市场的 echarts-for-wx插件 导入到自己的项目会多出以下文件夹,真正有用的是红框内的三个文件,可以将其移入到components下,具体哪个页面/组件使用了就引入 这里我是把uni-ec-canvas移入到compone

    2024年02月12日
    浏览(31)
  • uniapp兼容微信小程序和支付宝小程序遇到的坑

    改为v-if。 App端和H5端支持 v-html ,微信小程序会被转为 rich-text,其他端不支持 v-html。 解决方法:去插件市场找一个支持跨端的富文本组件。 兼容微信小程序和支付宝小程序  pages.json: 给支付宝的导航栏设置 透明 agent页面: 支付宝加上 my.setNavigationBar 设置标题文字即可,

    2024年02月15日
    浏览(64)
  • 【uniapp】将微信小程序的代码兼容支付宝小程序(持续更新)

    目前本身就有一套完善的微信小程序(兼容h5)的代码,现在的需求是将它编译成支付宝小程序,做好兼容的处理,以便后续接入支付宝服务商,在这里简单记录一下目前发现的把微信小程序编译成支付宝小程序的问题和解决方案。 建议配合其他人的记录一起看,这里只是我

    2024年02月09日
    浏览(108)
  • 使用uniapp开发微信小程序的微信支付流程

    在我们做一些购物车的结算功能时是一定会有支付功能的,那我们如何去做微信支付这个功能呢,首先我们先要理清思路,并且要了解到接口需要哪些数据以及会返回哪些数据 注意:一定要先看接口文档! 创建订单。 ○ 请求创建订单的 API 接口:把(订单金额、收货地址、

    2024年02月09日
    浏览(45)
  • uniapp接入萤石微信小程序插件 可播放 可云台控制

    萤石官方提供了一些适用于uniapp / 小程序的方案 如 小程序半屏  hls  rtmp  等 都有坑 截止到2023.11.7 hls不支持H265  rtmp需要在小程序申请直播类目  所以都不适合项目使用  故选用小程序插件方式 uniapp引入使用  该方式仅需在小程序后台申请插件即可  审核时间大约3天左右

    2024年02月05日
    浏览(32)
  • uniapp开发APP跳转微信小程序和支付宝小程序(安卓版)

    开发APP时需要支付时跳转微信或者支付宝去支付,但是因为银行合作问题不能直接跳转,所以选择跳转到小程序页面进行支付,微信小程序和支付宝小程序写法不同 APP跳转微信小程序 (需要manifest.json中APP模块配置Share中微信分享保持开启) 微信小程序原始id在微信开放平台查

    2024年02月06日
    浏览(37)
  • uniapp 之 微信小程序、支付宝小程序 对于自定义导航栏的不同

    目录 前言  微信小程序 代码  支付宝小程序 首页配置文件 二级菜单页面  配置 总结  不同 相同  小程序都是 uni-app 写的 不是原生 pages.json文件中配置 重点: \\\"navigationStyle\\\": \\\"custom\\\",  // 导航栏样式  首页 vue文件 template  script  备注:  height:是胶囊的高度 首页配置文件

    2024年02月15日
    浏览(31)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包