咨询电话：400-017-1995
请选择发起聊天的方式：
i聚合-专业的聚合支付服务专家
接入客户：
接入支付方式
H5微信支付
H5微信支付
WP微信支付
线下微信支付
微信扫码支付
what can we doi 聚合能为您做什么专业团队优质服务创造价值
免费、快捷天下武功唯快不破，申请个10天半个月，哪来得及！！简化合作流程、提供安卓/Android、苹果/iOS样式/demo及接口文档、安装包/SDK，助您快速上线！
H5微信支付demo展示 H5、H5、微信支付demo展示
H5微信支付应用场景
快速、免费接入各应用类H5微信支付，全程无忧
生活消费类
H5微信支付接入流程
把简单留给客户，把复杂的留给我们
商务接洽，把简单留给客户，把复杂的留给我们，
确认合作及接入类型，提供特约商户信息表
签署移动支付合作协议（协议一式二份）
技术接入（发相应的接口文档及demo）
生成系统商户号，上线并提供售后服务！
H5微信支付接入问题您可能最想知道的H5微信支付接入问题？
1.H5微信支付的费率是多少?
2.H5微信支付的结算周期?
3.H5微信支付接入需要多长时间?
4.什么样的资质可以申请H5微信支付?
5.H5微信支付合作需要什么样的申请资料?
6.接入H5微信支付出现问题如何处理?
7.H5微信支付接入的流程如何?
8.H5微信支付怎样进行技术对接?
9.是否提供H5、H5微信支付的demo?
10.H5微信支付怎样进行分销渠道统计?
11.你们的售后服务机制是什么样的?
12.H5支付可以进行多项目和多渠道管理吗?
13.H5微信支付接入的流程如何?
14.H5微信支付怎样进行技术对接?
15.是否提供H5、H5微信支付的demo?
16.H5微信支付怎样进行分销渠道统计?
17.你们的售后服务机制是什么样的?
18.H5支付可以进行多项目和多渠道管理吗?
心动不如行动 马上行动
H5微信支付
H5微信支付
WP微信支付
兼容微信支付、支付宝支付、手Q支付、线下刷卡支付、PC端扫码支付和H5支付
H5微信支付
H5微信支付
PC网页微信扫码支付
线下微信支付
其他支付方式
他们都选择了我们感恩您的信赖，i聚合为您不断创新进取
全国免费热线400-017-1995
友情链接：
快速链接：
Copyright-上海真扬网络科技有限公司
咨询热线：400-017-1-地址：上海市龙盛国际商业广场都市路ICP:沪ICP备号-3微信支付宝H5技术再次玩出了新高度
网站编辑：好实用
时间： 14:48:32
从互联网了解大，2016年伊始，微信的《2016微信公开课PRO版》和支付宝发布的H5场景——《够胆就来！2015年账单来啦》瞬间又刷爆了整个朋友圈，原来你才是我的第一个！原来人生就是买买买！H5作品的传播根本停不下来！
2015年是H5技术快速成长发展的一年，据业内数据表明，在用H5制作的作品中，心灵鸡汤类型的文章最受欢迎，其次是抽签测试题，再有就是一些社交互 动H5小游戏，还有一些营销型的作品，如大众点评的《这个陌生来电你敢接吗》、腾讯游戏的《吴亦凡即将入伍》、ME的《用图说爱》等等，一度被评为 2015年最经典的十大H5营销案例。但是像微信和支付宝这种对用户盘点类的H5作品却少之又少，能传播刷爆朋友圈、QQ空间的也只有它们了。更多的企业盘点类的还有京东的《任性，看京东这一年干的好事》、blued的《2015blued大数据白皮书》等，显然，用户更愿意去分析使用和分享与自己息息相关的作品。
用户盘点类作品是基于大数据的，通过对用户行为的分析、对用户感兴趣话题的整理，从而输出用户个性化数据报告，这些内容从用户的角度出发、分析和整理用 户的行为数据、满足用户的心理需求、深层次的挖掘用户与产品之间的交互，从而达到传播的目的。但是企业类盘点却是站在企业发展的角度，以记述企业发展的大 事记为基础，行业数据与企业产品数据为支撑，从而形成企业对外的行业报告，带有宣传品牌和推广产品的主观性。
那大家都可以都去做用户盘点类的作品是不是更好呢？
据了解，要想做好用户盘点类作品，首先要探讨四个问题：1.你能像腾讯、阿里那样多维度部署并且获取数据吗？2.你能像微信、支付宝那样让用户数据 实现个性化展示吗？3.你所获取的数据信息满足用户的炫耀心理吗？4.你的这个盘点能实现一些相关行为的转化吗？答案很显然否定的！所以并不是所有的企业 都能像微信和支付宝一样做好这类用户盘点。
不是所有的企业都能像腾讯、阿里做的H5基于大数据分析那样做到令用户疯传；心灵鸡汤类H5 作品用户转过即忘，不具备高传播价值；社交互动类H5小游戏趣味性强、但开发成本大、耗时长；营销类H5作品传播性广、趣味性强、抓住用户的“G点”对于 创意要求较高。基于上述原因，做一份以宣传自身企业和推广品牌为主的H5作品是大部分企业不错的选择。
也正是看到了市场上这方面的空 缺，近两年发展起了一批以提供免费的H5制作的工具，如易企秀，ME、爱分享、maka等等，这些H5制作工具的相似之处在于：提供免费制作H5的平台； 设计精美、版式多样、实用性强的模板；简单的操作步骤；可一键转发的分享功能。部分免费H5制作工具如ME，既有手机移动端APP，也有专业性更强的PC端可以使用，将小白用户与专业设计师群体统统收入囊中。
以笔者曾使用过的ME来说，如果想要制作一份以企业盘点、品牌传播为主的H5，只需登录MEPC端，进入场景创作，选择企业宣传，即有大量质感精美的模板供用户选择。企业只需通过重新编辑宣传文案、替换企业产品图片、选择适合相应的音乐，最后填写相应分享信息即可生成一份炫酷且高大上的企业宣传H5，分分钟做到炸裂式传播。
不管如何，H5的市场已经在打开了，而且被更多的用户所青睐，所以不管是企业盘点类还是用户盘点类的H5作品，适合企业产品就行，比如可口可乐的《分享快乐128年》、豆瓣的《豆瓣2015年度榜单》、滴滴打车的《2015滴滴手札》等H5作品同样露出他们的光芒，传播了品牌的魅力。
在线咨询：
售前咨询：售后服务：
售前咨询：
渠道代理：
售后服务：
微信公众号：heleasy在Web应用中接入微信支付的流程之极简清晰版
在Web应用中接入微信支付，我以为只是调用几个API稍作调试即可。
没想到微信的API和官方文档里隐坑无数，致我抱着怀疑人生的心情悲愤踩遍了丫们布下的所有坑。
简要介绍几个主要大坑：
坑一：关于WeixinJSBridge这个对象
查阅网页端调起支付API的开发文档，此对象即旁若无人的映入眼帘。
然后我们就理所应当的在代码里调用了丫的。
可是，too young too naive……
尽管此对象只在微信浏览器里有效，借此可判断用户是否在微信浏览器里访问应用。
但其实调用了丫之后，你是没有未来的……
此坑所耗时间：1.5天。
坑二：几个签名的混淆
关于签名的调试，网上各种哭嚎，不少人在签名处调试多日无果。
那是因为整个工作流程中，涉及到了至少三个签名，稍不小心就会用错。
在统一下单的接口里，向微信服务器发送请求中的参数有一枚签名；
其返回的参数中，亦有一枚签名，后经观察，发现二者为同一签名。
但在使用JSSDK后所调用的wx.config里所需的参数signature却是另一枚签名。
而在wx.chooseWXPay里所需的支付签名paySign，却又是另另另外的一枚。
此坑所耗时间：2天。
坑三：两个Access_token
查看开发文档可以看到，微信搞了两个Access_token！
即使他们用再多的加粗文字来提醒我们两个token的不同之处，
也难以抚平我们在开发过程中陷入混乱的受伤之身心！
一个是网页授权的access_token，需要用户授权之后才能拿到。
而另一个是普通的access_token，支持公众号的各种基础服务，并非支付独用。
看文档所述的流程，以为用网页授权的token就对了？
恭喜，又进坑了……
最后真正用到的是第二个token。
此坑所耗时间：1.5天。
坑坑相套，防不胜防。最终跑通功能后，心力交瘁矣！
为防以后再次进坑，在此总结一番，供各位参考。
———————— 我是悲愤不已的分割线
————————
准备工作第一弹：
公众号一枚，并开通微信支付功能。
在微信公众平台（mp.）的［微信支付-开发配置］里对支付授权目录做配置。
测试期间，需要配置测试授权目录，以及将参与测试的微信号添加到白名单中。
由于测试必须在线上（测试）环境，debug不太方便，才耗费了辣么多美好的时光。
授权目录，即为调用微信支付控件的页面所在目录。
准备工作第二弹：
还是在公众平台上，进入开发者中心，找到接口权限表。
在其中的网页服务中，找到“网页授权用户基本信息”并填写之。
这里所填的URL必须是用户进入应用的URL，且必须是oauth验证所用的URL里的redirect_uri里的值……
一处不对，都会在坑里苦熬良久。
准备工作第三弹：
还是在公众平台上，进入公众号设置，找到功能设置。
需要对JS接口安全域名做设置。
这里的安全域名就是你的应用相关的域名，改动次数受限制，要注意。
准备工作第四弹：
还是在公众平台上，在开发者中心里找到配置项。
这里需要有APPID和APPSecret的访问权限。
另外，还需要准备的是商户id：mch_id 和 key。
注：secret
和 key 在通信接口里有用到，不允许在前端页面使用！
———————— 我是跃跃欲试的分割线
————————
第一步骤：一个带验证的入口URI
首先引导用户进入应用，这里以H5页面为例。
由于微信支付必须在微信浏览器里进行，因此入口URL链接应当从公众号发布给用户，
这样用户才会在微信客户端中点击链接，进入应用。
（不要问京东为什么可以在纯网页端使用微信支付，那是微信给他的小伙伴京东开的后门好吗）
这个入口URL不是简单的URL，这里需要做oauth的验证，因此我们暂设此URL为entranceURL。
entranceURL的格式为：
https://open./connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
标红的几个变量需要说明：
1. APPID就是公众号的appid
2. REDIRECT_URI很眼熟？就是刚在网页授权里写的URI，要转义哦亲。
3. response_type须填code，理由是这是一个GET请求，微信会返回code然后用code再……blah blah
4. SCOPE，填snsapi_userinfo（需用户手动授权）或snsapi_base（直接进入页面）
5. STATE 会跟随code一起返回，看业务需要自己填。一般格式是有大小写和数字的组合。
第二步骤：用code获取openId
用户点击了这个entranceURL之后会发生什么奇妙的事情咩？
这时候微信会返回给你一个code，并重定向到你在REDIRECT_URI里指定的页面。
你需要在这个页面的URL里拿到code的值，如果拿不到，要提示用户授权失败或未授权。
由于这个entranceURL可能是应用的首页，而需要调用支付控件的是其他页面，
所以可以先将其缓存到例如sessionStorage里，到了需要调用支付控件时再用。
拿到这个code需要做什么咩？
这时候要做的事情就不能在前端页面里继续进行了，这里必须写一个前后端通信的接口，
将这个code传送给后端服务器，然后在服务器里发起对微信的GET请求：
https://api./sns/oauth2/access_token?appid=我的appid&secret=我的secret&code=这个code&grant_type=authorization_
标红的是需要被替换的变量，其中appid和secret都应该保存在服务端文件中。
这个请求返回的Json里的openid就是我们要的。
第三步骤：统一下单接口
接口地址：https://api.mch./pay/unifiedorder
参考文档：https://pay./wiki/doc/api/jsapi.php?chapter=9_1
这个接口在文档里讲得很清楚，在此不赘述。
注意这里有签名sign，它与后面要用的signature和paySign虽然都是签名，但完全不同。
如果你的trade_type是NATIVE就不需要openid，如果是JSAPI就必须要openid。
在统一下单的接口中，你会告诉微信当前这笔交易的一些基本信息，
包括但不限于商户id、交易号、交易金额等等。
微信会将其打包到一个package里，从接口返回的prepay_id里其实就对应了你的交易详情。
注意这个接口返回的状态码有两种，一个标识的是通信是否成功：return_code
另一个标识的是业务是否成功：result_code。详情见文档。
第四步骤：前端配置wx.config
在上一步接口的业务返回成功之后，可以在前端引用JSSDK了。
开发文档在：https://mp./wiki/7/aaa137b55fb2e48dd613f.html
首先注入权限验证配置时，需要用到wx.config。
它有几个参数要格外注意，不然又进坑了：
1. 随机字符串nonceStr，必须使用上一步的统一下单接口返回的nonceStr。
2. 签名signature，不是上步接口里的sign，需在服务端生成，返给前端。（见下一步骤）
3.&jsApiList&里要指定微信支付接口“chooseWXPay”。
4. debug参数设为true时，会在移动端打出alert帮助调试。
第五步骤：服务端生成wx.config所需的signature
首先用appid和secret从微信基础支持接口中获取access_token。
前面提到了两个token：网页授权型token和普通型token。
这里获取的是普通型token。
由于这个token是公众号所有服务都可能用到的，因此要格外注意。
有效期7200s，建议过期之前应当缓存之。
然后用这个token去获取jsapi_ticket，接口地址：
https://api./cgi-bin/ticket/getticket?access_token="
access_token "&type=jsapi
这个ticket同样也要做缓存。
现在可以准备生成signature了，所需的参数有：
1.&jsapi_ticket
2.&nonceStr&即统一下单接口返回的随机字符串
3. 时间戳：秒为单位（后续还会用到时间戳，要保持一致）
4. 当前页面URL，不需转义
注意这个签名是用sha1算法加密，其他的签名是用MD5算法加密的。
第六步骤：终于开始配置chooseWXPay了
wx.config的验证通过之后，就可以在wx.ready的回调里执行wx.chooseWXPay了。
chooseWXPay的几个属性配置说明如下：
1.&timeStamp：刚才用到的那个时间戳，秒为单位。
2.&nonceStr：统一下单接口里的随机字符串
3.&package：值的格式为“prepay_id=”
统一下单接口返回的prepay_id
4.&signType：由于这里的签名是MD5加密，因此这个值就是“MD5”
5.&paySign：呵呵，此处是坑，这个签名也是在服务端生成，返给前端，见下一步骤。
6.&success：支付成功后的回调。
7.&fail： 支付失败后的回调。
8.&cancel：用户取消支付后的回调。
这里注意，由于进入应用时是带着oauth验证的，因此在用户取消支付后，
code可能已过期，因此建议在取消支付的回调里，调用wx.closeWindow()退出Web页返回微信客户端。
因为即使你不退出，再执行支付，code之后的验证也不会通过。
这时只能重新访问一次第一步骤中的entranceURL才行。
第七步骤：生成chooseWXPay所需的签名paySign
这个签名不同于刚才在wx.config里的签名signature，这是用MD5加密的。
生成签名所需参数有appid，nonceStr，package，signType和timeStamp。（字典序排列）
其中nonceStr和package都是前面调用的统一下单的接口返回的。
这里的signType是“MD5”.
另外，这个签名拼合的时候，最后要加一个key，就是app的key。
key的排序在最后，排序不参与字典序。具体规则见官方文档。
第八步骤：线上测试
至此，万事具备，包括东风。可以测试了。
建议使用iPhone手机测试，如果有问题IOS会报出错信息，Android不会。
最常见的问题就是“Invalid signature”，这个错误信息太笼统了。
需要更细致的调试和辛勤的打Log。我在这个坑里淌了两天……
注：本地测试环境不能测试，必须发布到线上测试环境（非生产环境），
并且线上测试环境的域名和URI等信息都要在公众号设置里有授权。
———————— 我是蠢蠢欲动的分割线
————————
如此看来，流程清晰多了，也无甚难处。
可当初做开发和调试时，因为对后端语言不熟，耗费了很多时间，
用JS三秒写出的方法，用后端语言写就频繁报错，
什么也不说了，只恨自己读书少。
最后感谢在此过程中提供语法指点的盆友。
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。查看: 6857|回复: 6
hbuilder的移动端APP如何实现微信支付,求具体流程详解
& && & 我的HBuilder里的一个移动端APP项目已经有了支付宝，还要实现微信支付，不知道怎么做微信支付，什么公众号，审核，应用包签名都有，就是不知道该如何下手，菜鸟求大神详解！！！！！！！！
HBuilder 基座已实现H5 plus的支付API，现已集成支付宝快捷支付平台。使用支付功能前必须在支付宝网站开通”快捷支付“服务，并配置服务器生成订单信息。开发指导支付流程如下：
flow.png (75.12 KB, 下载次数: 11)
11:17 上传
plus API使用步骤：
1. 调用plus.payment.getChannels()获取系统支持的支付通道；
2. 调用plus.payment.request()发起支付请求。示例代码var channel=
// 1. 获取支付通道
function plusReady(){
& & // 获取支付通道
& & plus.payment.getChannels(function(channels){
& && &&&channel=channels[0];
& & },function(e){
& && &&&alert(&获取支付通道失败：&+e.message);
& & });
}
document.addEventListener('plusready',plusReady,false);
var ALIPAYSERVER='http://demo./helloh5/payment/alipay.php?total=';
var WXPAYSERVER='http://demo./helloh5/payment/wxpay.php?total=';
// 2. 发起支付请求
function pay(id){
& & // 从服务器请求支付订单
& & var PAYSERVER='';
& & if(id=='alipay'){
& && &&&PAYSERVER=ALIPAYSERVER;
& & }else if(id=='wxpay'){
& && &&&PAYSERVER=WXPAYSERVER;
& & }else{
& && &&&plus.nativeUI.alert(&不支持此支付通道！&,null,&捐赠&);
& && &&&
& & }
& & var xhr=new XMLHttpRequest();
& & xhr.onreadystatechange=function(){
& && &&&switch(xhr.readyState){
& && && && &case 4:
& && && && &if(xhr.status==200){
& && && && && & plus.payment.request(channel,xhr.responseText,function(result){
& && && && && && &&&plus.nativeUI.alert(&支付成功！&,function(){
& && && && && && && && &back();
& && && && && && &&&});
& && && && && & },function(error){
& && && && && && &&&plus.nativeUI.alert(&支付失败：& + error.code);
& && && && && & });
& && && && &}else{
& && && && && & alert(&获取订单信息失败！&);
& && && && &}
& && && && &
& && && && &default:
& && && && &
& && &&&}
& & }
& & xhr.open('GET',PAYSERVER);
& & xhr.send();
}复制代码注：第二步中获取到的订单数据需要在服务器通过支付宝平台获取PID和密钥生成。HBuilder应用配置分享插件添加方法具体步骤如下：
1. 双击应用的manifest.json文件，选中“使用第三方插件”
plugin.jpg (22.04 KB, 下载次数: 4)
11:17 上传
Ctrl+S保存。
点击manifest.json文件的“代码视图”，在permissions节点下添加Payment节点：
permissions.png (17.55 KB, 下载次数: 2)
11:17 上传
在plus -& distribute -& plugins 节点下添加payment节点：
11:17 上传
alipay节点下配置支付宝相关信息
scheme值为iOS平台调用支付宝的“快捷支付”应用返回时用到的标识，推荐使用小写字符串。
weixin节点下配置微信支付相关信息
appid值为在微信开放平台申请应用的AppID值。
支付宝功能申请
登录支付宝账号，签约申请“移动快捷支付”功能，操作流程参考：
获取PID，参考教程：
生成密钥（公钥和私钥），并提交到支付宝，参考教程：
服务器生成订单示例（PHP）
参考开源示例代码
微信支付功能申请
使用微信支付功能需到微信开放平台申请移动应用并开通支付功能
申请应用后可以获取AppID和AppSecret值。开通支付功能后可获取支付业务服务器配置数据
PARTNER：财付通商户号
PARTNER_KEY：财付通密钥
PAYSIGNKEY：支付签名密钥
　　参考开源示例代码
这个我看过，可是看不懂，我就一菜鸟，麻烦具体一点
HBuilder 基座已实现H5 plus的支付API，现已集成支付宝快捷支付平台。使用支付功能前必须在支付宝网站开通 ...
这个我看过，可是看不懂，我就一菜鸟，麻烦具体一点。。。什么下哪个SDK，怎么用，然后做什么
这个我看过，可是看不懂，我就一菜鸟，麻烦具体一点。。。什么下哪个SDK，怎么用，然后做什么
你需要appid值为在微信开放平台申请应用的AppID值，服务器生成订单php，微信和支付宝是相通的！
你需要appid值为在微信开放平台申请应用的AppID值，服务器生成订单php，微信和支付宝是相通的！
我有APPID值，关键是我不知道先干撒再干撒怎么做
微信支付就第一次成功，后面就都支付失败了，换个支付帐号也是第一次成功，后面都失败的，是什么原因呢？日志返回[-100]:[payment微信:-1]General error]
网站推荐 /1
从即日起关注蚂蚁社区官方微信，奖励30蚂蚁币，每月我们会随机抽取3名关注者，奖励月度VIP会员（1000蚂蚁币）。
邮箱: QQ: 木子牛HTML5工作室 版权所有
Powered by X3.2(