微信公众号H5支付接口调用方法

作者:来自星星的马 时间:2023-07-02 05:19:04 

本文实例为大家分享了 微信内H5调用支付接口的具体代码,供大家参考,具体内容如下

官方文档地址


<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>微信公众号H5接口调用</title>
 <script src='./js/md5.js'></script>
</head>
<body>
 <script>
   // 判断微信版本是否在5.0以上
   // window.navigator.userAgent 属性包含了浏览器类型,版本,操作系统类型,浏览器引擎等信息
   var ua = window.navigator.userAgent.toLowerCase()
   // 通过正则表达式匹配 ua 中是否含有 MicroMessenger 字符串
   if (ua.match(/MicroMessenger/i) != 'micromessenger') {
     return false
   }

var appId = 'wx123456789'
   // 微信H5接口调用准备
   // 1,时间戳
   var timeStamp = new Date()
   timeStamp = timeStamp.getTime()/1000
   console.log('时间戳', timeStamp)

// 2,生成32位随机字符串
   function randomString(len) {
     len = len || 32
     // 默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1
     var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
     var charsLen = chars.length;
     var pwd = '';
     for (var i=0;i<len;i++) {
       pwd += chars.charAt(Math.floor(Math.random() * charsLen))
     }
     return pwd
   }
   console.log('nonceStr,32位随机字符串', randomString())

// 3,package,统一下单接口返回的prepay_id 参数值

// 4,paySign:微信签名
   function wxSignFunc() {
     // 4.1,将参数改写成 key=value&key2=value2 形式,需要按照参数名ASCII字典序排序
     var stringA = 'appId=' + appId
           +'&nonceStr=' + randomString()
           +'&package=prepay_id=u802345jgfjsdfgsdg888'
           +'&signType=MD5'
           +'&timeStamp=' + timeStamp

///// 4.2,拼接API 密钥
     var stringSignTemp = stringA + '&key=192006250b4c09247ec02edce69f6a2d' //注:key为商户平台设置的密钥key
     var sign = hex_md5(stringSignTemp).toUpperCase()
     return sign
   }

console.log(wxSignFunc())

//////////// 微信接口实例
   function onBridgeReady(){
    WeixinJSBridge.invoke(
       'getBrandWCPayRequest', {
         "appId": appId,   //公众号名称,由商户传入  
         "timeStamp": timeStamp,     //时间戳,自1970年以来的秒数  
         "nonceStr": randomString(), //随机串  
         "package":"prepay_id=u802345jgfjsdfgsdg888",  // 统一下单接口返回的prepay_id 参数值
         "signType":"MD5",     //微信签名方式:  
         "paySign": wxSignFunc() //微信签名
       },
       function(res){
         if(res.err_msg == "get_brand_wcpay_request:ok" ){
           // 使用以上方式判断前端返回,微信团队郑重提示:
           // res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
           console.log(111)
         }
       }
     )
   }

// 调用微信接口
   if (typeof WeixinJSBridge == "undefined"){
    if( document.addEventListener ){
     document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
    } else if (document.attachEvent){
     document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
     document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
    }
   }else{
    onBridgeReady();
   }
 </script>

</body>
</html>

来源:https://blog.csdn.net/M_wolf/article/details/82343480

标签:H5,微信公众号,支付
0
投稿

猜你喜欢

  • python读取目录下所有的jpg文件,并显示第一张图片的示例

    2023-06-21 16:31:58
  • Mootools 1.2教程(16)——排序类和方法简介

    2008-12-10 14:18:00
  • Python列表删除重复元素与图像相似度判断及删除实例代码

    2021-02-21 05:28:58
  • Oracle 随机数

    2009-06-04 10:01:00
  • Python中base64与xml取值结合问题

    2021-08-22 21:15:03
  • Vue自定义Form组件实现方法介绍

    2024-04-28 09:21:14
  • 使用curl命令行模拟登录WordPress的方法

    2022-02-23 17:15:06
  • jQuery 让人恋恋不舍的秘密

    2010-01-20 10:09:00
  • 在Python中将函数作为另一个函数的参数传入并调用的方法

    2023-04-10 07:32:26
  • 如何使用Vue3设计实现一个Model组件浅析

    2024-04-27 15:57:19
  • Python实现提取Excel指定关键词的行数据

    2022-09-01 10:15:59
  • pycharm 2021.3最新激活码有效期至2100年(亲测可用)

    2022-03-23 13:45:03
  • Python如何向SQLServer存储二进制图片

    2021-01-06 08:23:54
  • 用python写测试数据文件过程解析

    2022-03-24 16:54:57
  • Python实现聊天机器人的示例代码

    2022-11-16 18:10:56
  • Django url.py path name同一app下路由别名定义

    2023-01-24 23:46:36
  • 如何实现对整个站点所有页面的操作?

    2010-05-19 21:20:00
  • python数据处理——对pandas进行数据变频或插值实例

    2021-01-05 19:22:01
  • “验证码”等于“流氓软件”

    2007-10-19 18:29:00
  • Python使用迭代器捕获Generator返回值的方法

    2022-11-25 09:40:35
  • asp之家 网络编程 m.aspxhome.com