美文网首页支付组件的研究微信生态的相关开发
浅析微信支付:微信支付简单介绍(小程序、公众号、App、H5)

浅析微信支付:微信支付简单介绍(小程序、公众号、App、H5)

作者: YClimb | 来源:发表于2018-11-01 10:58 被阅读325次

    浅析微信支付:微信支付简单介绍(小程序、公众号、App、H5)

    本文是【浅析微信支付】系列文章的第二篇,主要讲解一下普通商户接入的支付方式以及其中的不同之处。


    上篇文章讲了本系列的大纲,没有看过的朋友们可以看一下。

    浅析微信支付:前篇大纲

    微信支付是集成在微信客户端的支付功能,用户可以通过手机完成快速的支付流程。微信支付以余额、绑定银行卡的快捷支付为基础,向用户提供安全、快捷、高效的支付服务。

    微信支付开通需要申请商户平台功能,所以,个人的订阅号是不能开通微信支付的,只有服务号可以开通,申请成为公众账号支付商户必须满足以下条件:

    1)拥有公众帐号,且为服务号;
    2)公众帐号须通过微信认证;
    

    微信认证资质审核通过后,即可申请微信支付功能。

    这里就不演示如何开通微信支付了,百度有现成的例子。

    下面讲开通微信支付后的开发选择。

    1、支付方式

    从微信支付商户平台的首页 https://pay.weixin.qq.com/wiki/doc/api/index.html 进入,选择 普通商户 版本的支付方式,主要分为以下六种:

    1.刷卡支付:用户打开微信钱包的刷卡的界面,商户扫码后提交完成支付
    2.公众号支付:用户在微信内进入商家H5页面,页面内调用JSSDK完成支付
    3.扫码支付:用户打开"微信扫一扫“,扫描商户的二维码后完成支付
    4.APP支付:商户APP中集成微信SDK,用户点击后跳转到微信内完成支付
    5.H5支付:用户在微信以外的手机浏览器请求微信支付的场景唤起微信支付
    6.小程序支付:用户在微信小程序中使用微信支付的场景
    

    以上六种支付方式,比较常用的是 2、4、6 这三种,刷卡、扫码、H5现在相对来说用的比较少,本文就主要讲 2、4、6 这三种支付方式了。

    1.1.公众号支付

    公众号支付用途非常广泛,主要用于商家在微信服务号中自建网页商城网站,用户通过链接或者二维码进入微信内部网页浏览器时,进行购买下单等支付操作时调用的流程。

    开发前准备:

    https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3

    一、设置支付目录
    请确保实际支付时的请求目录与后台配置的目录一致(现在已经支持配置根目录,配置后有一定的生效时间,一般5分钟内生效),否则将无法成功唤起微信支付。

    在微信商户平台(pay.weixin.qq.com)设置您的公众号支付支付目录,设置路径:商户平台-->产品中心-->开发配置。公众号支付在请求支付的时候会校验请求来源是否有在商户平台做了配置,所以必须确保支付目录已经正确的被配置,否则将验证失败,请求支付不成功。

    二、设置授权域名
    开发公众号支付时,在统一下单接口中要求必传用户openid,而获取openid则需要您在公众平台设置获取openid的域名,只有被设置过的域名才是一个有效的获取openid的域名,否则将获取失败。

    PS:简单讲就是需要填写一个微信认证通过的域名,这个域名就是咋们访问的页面链接,需要注意的一点是,请尽量认证绝对域名,比如使用 www.yclimb.com,不使用 www.yclimb.com/blog 这样,认证成功后就可以使用微信的网页授权接口来获取用户信息了。

    如果需要本地测试,则需要去申请一下测试号来测试本地的用户信息,详情见如下链接:
    https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login

    注意:测试号不支持微信支付!!!

    官方场景介绍如下:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_1

    开发流程:

    1.用户通过链接或二维码进入网页 -> 
    2.调用微信网页授权接口[官方接口] -> 
    3.用户授权后获取用户信息[官方接口] -> 
    4.封装商品信息并下单 -> 
    5.调用微信统一下单接口[官方接口] -> 
    6.根据统一下单接口返回信息组装前端需要的支付参数[官方验证] -> 
    7.前端使用支付参数唤起微信支付界面[官方接口] -> 
    8.支付成功后微信异步调用统一下单时传入的回调接口[官方接口] -> 
    9.更新商户订单信息
    

    基本流程就如上所述,详细介绍见下一章。

    1.2.APP支付

    APP支付适用于商户在移动端APP中集成微信支付功能。
    商户APP调用微信提供的SDK调用微信支付模块,商户APP会跳转到微信中完成支付,支付完后跳回到商户APP内,最后展示支付结果。
    目前微信支付支持手机系统有:IOS(苹果)、Android(安卓)和WP(Windows Phone)。

    官方场景介绍如下:https://pay.weixin.qq.com/wiki/doc/api/app/app.php?chapter=8_1

    开发流程:

    1.用户进入商户APP,选择商品下单、确认购买,进入支付环节。商户服务后台生成支付订单,签名后将数据传输到APP端。
    2.用户点击后发起支付操作,进入到微信界面,调起微信支付,出现确认支付界面。
    3.用户确认收款方和金额,点击立即支付后出现输入密码界面,可选择零钱或银行卡支付。
    4.输入正确密码后,支付完成,用户端微信出现支付详情页面。
    5.回跳到商户APP中,商户APP根据支付结果个性化展示订单处理结果。
    

    PS:APP支付和公众号支付有几个不同的点:

    1.公众号支付需要进行用户授权获取用户信息,统一下单接口需要用户的openid
    2.APP支付不需要用户授权,也不需要用户的openid
    3.APP支付依赖于平台,如iOS、Android,需要前端小伙伴配合SDK开发,公众号直接调取http/https接口即可
    4.统一下单时类型不同,开发时注意个别字段的值变化
    

    1.3.小程序支付

    小程序支付开发步骤:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_3&index=1

    如果开发者已做过JSAPI(公众号支付)或JSSDK(H5)调起微信支付,接入小程序支付非常相似,以下是三种接入方式的对比:

    对比栏目 JSAPI JSSDK 小程序
    统一下单 都需要先获取到Openid,调用相同的API
    调起数据签名 五个字段参与签名(区分大小写):appId,nonceStr,package,signType,timeStamp
    调起支付页面协议 HTTP或HTTPS HTTP或HTTPS HTTPS
    支付目录
    授权域名
    回调函数 success回调 complete、fail、success回调函数

    PS:小程序访问商户服务都是通过HTTPS,开发部署的时候需要安装HTTPS服务器

    商户系统和微信支付系统主要交互:

    1、小程序内调用登录接口,获取到用户的openid,api参见公共api【小程序登录API】
    2、商户server调用支付统一下单,api参见公共api【统一下单API】
    3、商户server调用再次签名,api参见公共api【再次签名】
    4、商户server接收支付通知,api参见公共api【支付结果通知API】
    5、商户server查询支付结果,api参见公共api【查询订单API】
    

    2、支付工具

    普通商户 版本的支付工具,主要分为以下三种:

    1.代金券或立减优惠:商户营销和运营的能力,给用户发放代金券或立减优惠的相关说明
    2.现金红包:提供给商户营销的能力,商户给用户派发现金红包相关说明
    3.企业付款:企业付款至用户微信支付零钱或银行卡
    

    支付工具待将支付接口讲完之后,会单独拿几章来讲一下,这里就不细讲了!

    3、注意事项

    上面主要讲了小程序、公众号、APP这三种支付方式,我们需要注意的是,无论哪种支付方式,最终都会去调取 统一下单接口,这个接口主要是将咋们商户中的订单信息拼接为支付信息传入到微信平台,微信平台会返回一个 预支付单 信息,我们对这个信息进行再次加密后拼接为实际支付所需的参数(五个字段参与签名(区分大小写):appId,nonceStr,package,signType,timeStamp),给到微信提供的官方接口中即可调起支付页面了;

    关于上面的步骤这里不细讲,后面几章会着重说明调取微信支付的前期准备,以公众号支付为例子,讲一下如何获取授权、拉取用户信息,生产支付信息、调起微信支付等...

    结语

    前面几章都是一些比较琐碎的概念型文章,从下一章开始进入实操代码环节,下一章会讲 进入微信支付的前期准备 尽情期待!

    ​如果想要提前一览源码的小伙伴,可以先看看我的 github,地址如下: https://github.com/YClimb/wxpay-sdk/blob/master/README.md

    加作者私人微信,作者微信号如下 yclimb,标明 微信支付 可拉入微信支付讨论群与小伙伴一起探讨哦,一定要标明 微信支付 哦~

    到此本文就结束了,关注公众号查看更多推送!!!


    关注公众号

    相关文章

      网友评论

        本文标题:浅析微信支付:微信支付简单介绍(小程序、公众号、App、H5)

        本文链接:https://www.haomeiwen.com/subject/evitxqtx.html