React Native微信支付开发爬坑之旅(ErrCode:-1)

       早闻微信支付一直为移动开发者所诟病,这次公司项目新增微信支付需求,一试果然是一把辛酸泪,从配置到与后台调试真是一波三折,整整花了一天的时间才从坑里爬出来,效率也是低。所以有必要做下总结,日后再有微信支付,三两下便可完事。
  因为公司项目是RN写的,我这边选用了目前在RN上使用较广泛的微信支付组件,基本上都封装好了,github直通车:react-native-wechat
       我们只需要实现两步就可以调起微信支付:

  • 在应用启动的时候注册APPID
 WeChat.registerApp('appid');
  • 在跳转到微信支付的点击事件中配置参数:
 wechat.isWXAppInstalled().then( ( isInstalled ) => {
       if ( isInstalled ) {       //判断手机是否有安装微信
           wechat.pay({
                 partnerId: wxinfo.mch_id,  // 商家向财付通申请的商家id
                 prepayId: wxinfo.prepay_id,   // 预支付订单
                 nonceStr: wxinfo.nonce_str,   // 随机串,防重发
                 timeStamp: result.data.time.toString()    ,  // 时间戳,防重发.
                 package: 'Sign=WXPay',    // 商家根据财付通文档填写的数据和签名
                 sign: result.data.sign        // 商家根据微信开放平台文档对数据做的签名
                 }).then((requestJson)=>{
                           //支付成功回调
                           console.log("----微信支付成功----",requestJson);
                           if (requestJson.errCode=="0"){
                            //回调成功处理
                           }
                       }).catch((err)=>{
                           toastShort('支付失败')
                       })
                   } else {
                       toastShort( '没有安装微信软件,请您安装微信之后再试' );
                   }
               } );

       以上就是react native调用微信支付的过程,使用的开源库已经帮我们封装好了其他的一些配置,用起来也是非常的方便。
       接下来就是在手机上跑一遍,鲁迅说过:“新鲜事物第一次尝试就想要成功,几率还是很小的”。当我点击微信支付,期待着跳出熟悉的微信支付界面时,出现了令我失望的结果:屏幕闪了一下,然后,然后就没有然后了,what the f...,好,稳定下情绪,开始我的爬坑之旅。
  首先,我先来到这个开源库的文档中寻找下是否有我遗漏的地方,在最后看到了一句话,仿佛看到了曙光:

在安卓机上测试的同学经常会遇到比如调用微信支付时闪一下就没了的问题,这个问题100%跟签名有关,请检查你的签名。
debug版本和release版本的签名是不同的,请注意

       从这段话中,从100%这个字眼我读出了作者坚定的语气,自信的情感。于是我立马让运营小哥查看当时他申请微信支付用的签名,结果一对证,我c...,好,稳定下情绪,果然真是签名不对,当时给了一个dubug的签名,后面我让他换成release的签名,没换过来。好在微信开放平台是支持修改的,而且即时生效。这下应该没问题了吧。。。
  不可能的,不存在的,前方路漫漫。。这时候我的心态还是很好的。
  依然还是屏幕闪了一下,一只乌鸦带着省略号飞过。。所以说凡事不要说什么100%,接下来,继续我们的爬坑之旅。
  排除了权限问题,包括appid,应用签名这些都确定无误,那么问题应该就出在调用微信支付的那些参数上,首先引起我的注意的是sign这个字段,于是来到了微信支付文档(使用第三方,最主要的还是要回归到文档中来),微信支付文档直通车:微信支付开发文档
       简单描述下调用流程:

  • app端先调用自家后台的支付接口,把金额,支付类型等一些参数传过去
  • 后台收到这些参数,去调用微信服务端统一下单接口,将金额,商户订单号等等这些传给微信服务端,这时候微信服务端返回成功或失败,成功会附带sign,prepay_id等参数给我们后台。
  • 后台再将微信返回的这些参数返给app端,也就是上文配置中传的那些参数。app端再把这些参数传给微信。整个过程是不是一(fei)气(chang)呵(dan)成(teng)

       那么我们推测问题就出现在这些参数里,让我们一个一个来分析:

  • partnerId 商家ID,这个是申请微信支付的时候,微信分配的ID,直接获取后台返回即可,可以与运营小哥那边再核对下。
  • prepayId 预支付订单,微信服务端返给我们后台的订单,app端直接获取后台返回即可。
  • nonceStr 随机数,没什么好说的,直接获取后台返回即可。
  • timeStamp 时间戳,这是个要小心的地方,之前我们后台没给我返回这个字段,我自以为app端自己获取即时时间戳即可,直接
    结果错了,必须使用后台给的时间戳。你说这个锅谁背,55开吧
  • package 文档上说直接写死即可,package: 'Sign=WXPay'
  • sign 这是个大咖,当然计算工作交给后台来做就行,网上看了几篇文章说屏幕一闪,有可能就是sign计算错误,后台小哥跟我讲这个sign是微信返给他的,然后又直接返给我,emmmm,应该有点问题,再去文档看看:微信支付APP端开发步骤,里边第三部有四个字

商户服务器生成支付订单,先调用【统一下单API】生成预付单,获取到prepay_id后将参数再次签名传输给APP发起支付。以下是调起微信支付的

是的,就是这四个字“再次签名”,需要再次签名!!所以我又让后台小哥处理完sign在发给我。
  到此,我们把这些参数都给分析了一遍过去,这次要再闪一下我就...我就再找找其他原因,但是事实上,我的app已经成功调起了微信支付,并且成功回调。
  好了,这波总结进入尾声了,是不是觉得我写技术文章很啰嗦,就是啰嗦咋滴。不过说回来,还是总结下主题要义:

  • 检查你的APPID,应用签名是否正确
  • 检查你的参数传递是否正确(包括字段大小写),更多地与后台进行调试
  • 以上都确认OK了,重装你的微信再试一遍
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,496评论 6 501
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,407评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,632评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,180评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,198评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,165评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,052评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,910评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,324评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,542评论 2 332
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,711评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,424评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,017评论 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,668评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,823评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,722评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,611评论 2 353

推荐阅读更多精彩内容