微信h5支付申请和jsapi支付的区别

【微信支付】微信公众号支付接口文档V3.3.7_图文_百度文库
两大类热门资源免费畅读
续费一年阅读会员,立省24元!
【微信支付】微信公众号支付接口文档V3.3.7
阅读已结束,下载文档到电脑
想免费下载本文?
定制HR最喜欢的简历
下载文档到电脑,方便使用
还剩33页未读,继续阅读
定制HR最喜欢的简历
你可能喜欢> 微信支付h5支付
后端要对接银联无跳转Token支付,支付宝wap支付,微信APP支付,前端用的是H5和ionic 后端对下单
微信H5支付 NET版本备忘
微信公众平台后台设置:
  1)微信公众平台申请微信支付权限
jingyan baidu com
这篇文章主要介绍了微信支付如何实现内置浏览器的H5页面支付的相关资料,需要的朋友可以
php微信支付若干问题记录
  1 缺少参数$key0$
    此问题的可能性有几种,大致有1 t
  这次总结一下用户在微信内打开网页时,可以调用微信支付完成下单功能的模块开发,
第一步:用户同意授权,获取code
在确保微信公众账号拥有授权作用域(scope参数)的权限
这两天做微信支付开发。碰到大坑。纠结死我了。好不容做完。
后台java:直接上代码:注
1 检查发起支付的参数,全部设置为小写;
WxPayData jsApiParam = new WxPayData();
浅析支付系统的整体架构,本文主要是简单地描述支付系统的整体架构。
Bmob移动支付学习Demo,用户需要在Bmob我的控制台中进行实名认证。并创建自己的应用。同时
支付宝正式进入非洲:肯尼亚成为首个国家:这两年移动支付发展日新月异,支付宝如今已
苹果支付推进缓慢 拿微信开刀,一个全球的硬件终端霸主,一个中国最大的社交生态软件
以支付平台为例,谈谈营销功能设计。营销一般分为平台营销和商户营销,平台营销可覆盖
查询每个订单中订单明细中只支付了部分或为支付的订单。
Android 支付宝以及微信支付快速接入流程,随着移动支付的普及,越来越多的App采用第三发
我与支付宝之间的那些事:基于Python与Face++实现人脸识别。眨眨眼。支付婊这个刷脸的功能
当你在使用支付宝账户的时候,可能会遇到忘记支付宝密码的情况,那如何找回丢失的支付
无现金联盟成立,支付宝用60亿推进无现金社会,4月18日,无现金联盟在杭州成立,联合国
苹果Apple Pay中国新增四家银行支持:已达72家,4月19日消息,苹果的移动支付服务Apple Pay在
Apple Pay在华失意 银行转向二维码支付。Apple Pay在中国几乎到了无人问津的地步。第一财经
微信深夜放出导流大招,长按二维码可跳转小程序。像是要打压即将上线的支付宝小程序的
Apple Pay国内重磅功能曝光:可当公交卡,Apple Pay 在国内真的是堪称鸡肋一般的存在。虽然
在我们使用支付宝,有时候密码忘记了我们该怎么找回能,今天给大家分享一个找会密码的
支付宝登陆密码忘记了通常的解决方法是申请重置密码,不过还有一个方法可以进入支付宝
现在网购越来越流行,很多小伙伴都爱用手机支付宝来付钱了。如果某天准备付钱的时候,
说实话,现在需要记住密码的地方太多了,一个不留神就会忘记了其中的一个密码。还有的
跟支付宝学习如何写“讲故事”的文案。
支付行业,是如何赚走你的钱?很多行业为什么能赚钱?因为它促进了资源之间的流动效率
随着互联网的快速发展,网上购物已成为一种必然的趋势。支付宝在这种趋势中担当着相当
热门文章热门标签
04月21日 |
04月21日 |
04月21日 |
04月21日 |
04月21日 |
04月21日 |
04月21日 |
04月21日 |官方文档说的很清楚,商户已有H5商城网站,用户通过消息或扫描二维码在微信内打开网页时,可以调用微信支付完成下单购买的流程。
当然,最近微信支付平台也加入了纯H5支付,也就是说用户可以在微信以外的手机浏览器请求微信支付的场景唤起微信支付。
当然,今天的主角是微信公众号支付,其实也不一定非在公众号中打开,只要在微信中打开就可以使用。
项目使用的springboot微服务来实现,以下都是简单的伪代码实现,具体逻辑见。
其实就是一个初始化下单操作,前台业务逻辑在这就不展示了,这个就是接收前台参数的方法:
@RequestMapping("/pay")
public String
pay(Product product,ModelMap map) {
("H5支付(需要公众号内支付)");
String url =
weixinPayService.weixinPayMobile(product);
return "redirect:"+
产品实体Bean:
* 产品订单信息
* 创建者 科帮网
* 创建时间
@NoArgsConstructor
@AllArgsConstructor
public class Product implements Serializable {
private static final long serialVersionUID = 1L;
private String productId;// 商品ID
private S//订单名称
private S// 商品描述
private String totalF// 总金额(单位是分)
private String outTradeNo;// 订单号(唯一)
private String spbillCreateIp;// 发起人IP地址
private S// 附件数据主要用于商户携带订单的自定义数据
private Short payT// 支付类型(1:支付宝 2:微信 3:银联)
private Short payW// 支付方式 (1:PC,平板 2:手机)
private String frontU// 前台回调地址
非扫码支付使用
由于整合了Dubbo,使用PRC的方式调用,这里定义一个service:
public String weixinPayMobile(Product product) {
StringBuffer url = new StringBuffer();
String totalFee = product.getTotalFee();
//redirect_uri 需要在微信支付端添加认证网址
totalFee =
CommonUtil.subZeroAndDot(totalFee);
url.append("http://open./connect/oauth2/authorize?");
url.append("appid="+ConfigUtil.APP_ID);
url.append("&redirect_uri="+server_url+"weixinMobile/dopay?");
//注意 此处 get请求 拼接相关参数 用于redirect_uri获取
url.append("outTradeNo="+product.getOutTradeNo()+"&totalFee="+totalFee);
url.append("&response_type=code&scope=snsapi_base&state=");
url.append("#wechat_redirect");
url.toString();
大家有没有注意到redirect_uri参数中,我们定义了我们自己系统中的url请求,如下:
@RequestMapping(value = "dopay")
public String dopay(HttpServletRequest request, HttpServletResponse response) throws Exception {
//此处为weixinPayMobile方法中拼接的参数
String orderNo = request.getParameter("outTradeNo");
String totalFee = request.getParameter("totalFee");
//获取code 这个在微信支付调用时会自动加上这个参数无须设置
String code = request.getParameter("code");
//获取用户openID(JSAPI支付必须传openid)
String openId = MobileUtil.getOpenId(code);
String notify_url =server_url+"/weixinMobile/WXPayBack";//回调接口
String trade_type = "JSAPI";// 交易类型H5支付
SortedMap&Object, Object& packageParams = new TreeMap&Object, Object&();
monParams(packageParams);
packageParams.put("body","报告");// 商品描述
packageParams.put("out_trade_no", orderNo);// 商户订单号
packageParams.put("total_fee", totalFee);// 总金额
packageParams.put("spbill_create_ip", AddressUtils.getIpAddr(request));// 发起人IP地址
packageParams.put("notify_url", notify_url);// 回调地址
packageParams.put("trade_type", trade_type);// 交易类型
packageParams.put("openid", openId);//用户openID
String sign = PayCommonUtil.createSign("UTF-8", packageParams,ConfigUtil.API_KEY);
packageParams.put("sign", sign);// 签名
String requestXML = PayCommonUtil.getRequestXml(packageParams);
String resXml = HttpUtil.postData(ConfigUtil.UNIFIED_ORDER_URL, requestXML);
Map map = XMLUtil.doXMLParse(resXml);
String returnCode = (String) map.get("return_code");
String returnMsg = (String) map.get("return_msg");
StringBuffer url = new StringBuffer();
if("SUCCESS".equals(returnCode)){
String resultCode = (String) map.get("result_code");
String errCodeDes = (String) map.get("err_code_des");
if("SUCCESS".equals(resultCode)){
//获取预支付交易会话标识
String prepay_id = (String) map.get("prepay_id");
String prepay_id2 = "prepay_id=" + prepay_
String packages = prepay_id2;
SortedMap&Object, Object& finalpackage = new TreeMap&Object, Object&();
String timestamp = DateUtil.getTimestamp();
String nonceStr = packageParams.get("nonce_str").toString();
finalpackage.put("appId",
ConfigUtil.APP_ID);
finalpackage.put("timeStamp", timestamp);
finalpackage.put("nonceStr", nonceStr);
finalpackage.put("package", packages);
finalpackage.put("signType", "MD5");
//这里很重要
参数一定要正确 狗日的腾讯 参数到这里就成大写了
//可能报错信息(支付验证签名失败 get_brand_wcpay_request:fail)
sign = PayCommonUtil.createSign("UTF-8", finalpackage,ConfigUtil.API_KEY);
url.append("redirect:/weixinMobile/payPage?");
url.append("timeStamp="+timestamp+"&nonceStr=" + nonceStr + "&package=" + packages);
url.append("&signType=MD5" + "&paySign=" + sign+"&appid="+ ConfigUtil.APP_ID);
url.append("&orderNo="+orderNo+"&totalFee="+totalFee);
("订单号:{}错误信息:{}",orderNo,errCodeDes);
url.append("redirect:/weixinMobile/error?code=0&orderNo="+orderNo);//该订单已支付
("订单号:{}错误信息:{}",orderNo,returnMsg);
url.append("redirect:/weixinMobile/error?code=1&orderNo="+orderNo);//系统错误
return url.toString();
其实,以上代码就是一个认证(获取openid)、下单的过程,最终获取相关参数再重定向到pay页面,也就是我们定义的 redirect:/weixinMobile/payPage。
//公众号H5支付主页
@RequestMapping(value = "payPage")
public String pay(HttpServletRequest request, HttpServletResponse response) throws Exception {
return "weixin/pay";
然后转发到pay.jsp
&%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
//相关参数
String appId = request.getParameter("appid");
String timeStamp = request.getParameter("timeStamp");
String nonceStr = request.getParameter("nonceStr");
String packageValue = request.getParameter("package");
String paySign = request.getParameter("paySign");
String orderNo = request.getParameter("orderNo");
String totalFee
= request.getParameter("totalFee");
&!DOCTYPE html&
&title&微信支付&/title&
&meta charset="UTF-8"/&
&meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/&
&meta name="apple-mobile-web-app-capable" content="yes"/&
&meta name="apple-mobile-web-app-status-bar-style" content="black"/&
&meta name="format-detection" content="telephone=no"/&
&script type="text/javascript" src="&%=basePath%&static/js/jquery-1.10.2.min.js"&&/script&
&!-- 引入 jweixin-1.0.0.js--&
&script src="http://res./open/js/jweixin-1.0.0.js"&&/script&
&article class="order-main "&
&div class="ph_order"&
&div class=" affirm-info"&
&h4 id="orderNo"&&/h4&
&h3 id="totalFee"&&/h3&
&div class="detail-dl"&
&dt&收款方&/dt&
&dd&科帮网&/dd&
&dd id="productName"&充值帮币&/dd&
onclick="callpay()" class="pay-info"&立即支付&/div&
&/article&
&script type="text/javascript"&
var orderNo = '&%=orderNo%&';
var totalFee
= '&%=totalFee%&';
$(function(){
function onBridgeReady(){
WeixinJSBridge.invoke('getBrandWCPayRequest',{
"appId" : "&%=appId%&",
"timeStamp" : "&%=timeStamp%&",
"nonceStr" : "&%=nonceStr%&",
"package" : "&%=packageValue%&",
"signType" : "MD5",
"paySign" : "&%=paySign%&"
},function(res){
//使用以上方式判断前端返回,微信团队郑重提示:res.err_msg将在用户支付成功后返回
ok,但并不保证它绝对可靠。
if(res.err_msg == "get_brand_wcpay_request:ok"){
window.location.href="http://前台回调地址";
}else if(res.err_msg == "get_brand_wcpay_request:cancel"){
alert("用户取消支付!");
}else if(res.err_msg == "get_brand_wcpay_request:fail"){
alert("支付失败!");
function callpay(){
if (typeof WeixinJSBridge == "undefined"){
if( document.addEventListener ){
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
}else if (document.attachEvent){
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
onBridgeReady();
function init(){
$("#orderNo").html("科帮网-订单编号:"+orderNo);
totalFee = accDiv(totalFee,100);
$("#totalFee").html("¥"+totalFee);
function accDiv(arg1,arg2){
var t1=0,t2=0,r1,r2;
try{t1=arg1.toString().split(".")[1].}catch(e){}
try{t2=arg2.toString().split(".")[1].}catch(e){}
with(Math){
r1=Number(arg1.toString().replace(".",""));
r2=Number(arg2.toString().replace(".",""));
return (r1/r2)*pow(10,t2-t1);
其实,这就是一个回调通知,用户支付成功以后,微信会通知我们后台支付状态,然后我们根据订单信息完成下一步业务逻辑。
@RequestMapping(value = "WXPayBack")
public void WXPayBack(HttpServletRequest request, HttpServletResponse response){
String resXml = "";
Map&String, String& map = MobileUtil.parseXml(request);
String return_code = map.get("return_code");//状态
String out_trade_no = map.get("out_trade_no");//订单号
if (return_code.equals("SUCCESS")) {
if (out_trade_no != null) {
//处理订单逻辑
("微信手机支付回调成功订单号:{}",out_trade_no);
resXml = "&xml&" + "&return_code&&![CDATA[SUCCESS]]&&/return_code&" + "&return_msg&&![CDATA[OK]]&&/return_msg&" + "&/xml& ";
("微信手机支付回调失败订单号:{}",out_trade_no);
resXml = "&xml&" + "&return_code&&![CDATA[FAIL]]&&/return_code&" + "&return_msg&&![CDATA[报文为空]]&&/return_msg&" + "&/xml& ";
} catch (Exception e) {
logger.error("手机支付回调通知失败",e);
resXml = "&xml&" + "&return_code&&![CDATA[FAIL]]&&/return_code&" + "&return_msg&&![CDATA[报文为空]]&&/return_msg&" + "&/xml& ";
// ------------------------------
// 处理业务完毕
// ------------------------------
BufferedOutputStream out = new BufferedOutputStream(response.getOutputStream());
out.write(resXml.getBytes());
out.flush();
out.close();
} catch (Exception e) {
e.printStackTrace();
其实,当你完成集成测试的那一刻,也就没啥子坑了,相关的注意事项都在代码中有体现。
详细代码见:
阅读(...) 评论()}

我要回帖

更多关于 浏览器h5唤起微信支付 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信