微信支付demo

IJPay  支付

后端参见 :https://javen205.gitee.io/ijpay/doc/ijpay/wxpay/wechatPay.html

Spring Boot版本Demo

    /**
     * 公众号支付
     */
    @RequestMapping(value ="/webPay",method = {RequestMethod.POST,RequestMethod.GET})
    @ResponseBody
    public AjaxResult webPay(HttpServletRequest request,HttpServletResponse response,
            @RequestParam("total_fee") String total_fee) {
        // openId,采用 网页授权获取 access_token API:SnsAccessTokenApi获取

        String openId = (String) request.getSession().getAttribute("openId");

        if (StrKit.isBlank(openId)) {
            result.addError("openId is null");
            return result;
        }
        if (StrKit.isBlank(total_fee)) {
            result.addError("请输入数字金额");
            return result;
        }

        String ip = IpKit.getRealIp(request);
        if (StrKit.isBlank(ip)) {
            ip = "127.0.0.1";
        }

        Map<String, String> params = WxPayApiConfigKit.getWxPayApiConfig()
                .setAttach("IJPay 公众号支付测试  -By Javen")
                .setBody("IJPay 公众号支付测试  -By Javen")
                .setOpenId(openId)
                .setSpbillCreateIp(ip)
                .setTotalFee(total_fee)
                .setTradeType(TradeType.JSAPI)
                .setNotifyUrl(notify_url)
                .setOutTradeNo(String.valueOf(System.currentTimeMillis()))
                .build();

        String xmlResult = WxPayApi.pushOrder(false,params);
log.info(xmlResult);
        Map<String, String> resultMap = PaymentKit.xmlToMap(xmlResult);

        String return_code = resultMap.get("return_code");
        String return_msg = resultMap.get("return_msg");
        if (!PaymentKit.codeIsOK(return_code)) {
            result.addError(return_msg);
            return result;
        }
        String result_code = resultMap.get("result_code");
        if (!PaymentKit.codeIsOK(result_code)) {
            result.addError(return_msg);
            return result;
        }
        // 以下字段在return_code 和result_code都为SUCCESS的时候有返回


        String prepay_id = resultMap.get("prepay_id");

        Map<String, String> packageParams = PaymentKit.prepayIdCreateSign(prepay_id);

        String jsonStr = JSON.toJSONString(packageParams);
        result.success(jsonStr);
        return result;
    }
Jfinal版本Demo

public void webPay() {

        // openId,采用 网页授权获取 access_token API:SnsAccessTokenApi获取
        String openId = (String) getSession().getAttribute("openId");

        String total_fee=getPara("total_fee");

        if (StrKit.isBlank(openId)) {
            ajax.addError("openId is null");
            renderJson(ajax);
            return;
        }
        if (StrKit.isBlank(total_fee)) {
            ajax.addError("请输入数字金额");
            renderJson(ajax);
            return;
        }

        String ip = IpKit.getRealIp(getRequest());
        if (StrKit.isBlank(ip)) {
            ip = "127.0.0.1";
        }

        Map<String, String> params = WxPayApiConfigKit.getWxPayApiConfig()
                .setAttach("IJPay 公众号支付测试  -By Javen")
                .setBody("IJPay 公众号支付测试  -By Javen")
                .setOpenId(openId)
                .setSpbillCreateIp(ip)
                .setTotalFee(total_fee)
                .setTradeType(TradeType.JSAPI)
                .setNotifyUrl(notify_url)
                .setOutTradeNo(String.valueOf(System.currentTimeMillis()))
                .build();

        String xmlResult = WxPayApi.pushOrder(false,params);
log.info(xmlResult);
        Map<String, String> result = PaymentKit.xmlToMap(xmlResult);

        String return_code = result.get("return_code");
        String return_msg = result.get("return_msg");
        if (!PaymentKit.codeIsOK(return_code)) {
            ajax.addError(return_msg);
            renderJson(ajax);
            return;
        }
        String result_code = result.get("result_code");
        if (!PaymentKit.codeIsOK(result_code)) {
            ajax.addError(return_msg);
            renderJson(ajax);
            return;
        }
        // 以下字段在return_code 和result_code都为SUCCESS的时候有返回
        String prepay_id = result.get("prepay_id");

        Map<String, String> packageParams = PaymentKit.prepayIdCreateSign(prepay_id);

        String jsonStr = JsonKit.toJson(packageParams);
        ajax.success(jsonStr);
        renderJson(ajax);
    }

HTML部分:参见 https://gitee.com/javen205/IJPay-Demo/blob/master/src/main/webapp/WEB-INF/_views/wxpay.html#

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport"
	content="width=device-width,initial-scale=1,user-scalable=0">
<title>商户模式-微信支付</title>
<link rel="stylesheet"
	href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css">
<link rel="stylesheet"
	href="//cdn.bootcss.com/jquery-weui/1.0.1/css/jquery-weui.min.css">
<link rel="stylesheet" href="#(ctxPath)/static/css/demos.css">
</head>
<body>
<body ontouchstart>
	<div class="weui-tab">
		<div class="weui-tab__bd">
			<div id="tab0" class="weui-tab__bd-item weui-tab__bd-item--active">
				<header class='demos-header'>
					<h1 class="demos-title">微信支付</h1>
					<p class='demos-sub-title'>IJPay 让支付触手可及,微信扫码支付模式一</p>
				</header>
				<div class="bd">
					<div class="page__bd">
						<div class="weui-cell">
							<div class="weui-cell__hd">
								<label class="weui-label">产品ID</label>
							</div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="number" id="money1"
									placeholder="请输入产品ID">
							</div>
						</div>
					</div>
					<div class="weui-btn-area">
						<a href="javascript:scanCode1();"
							class="weui-btn weui-btn_primary">确定支付</a>
					</div>
					<div style="text-align: center; margin-top: 30px">
						<img id="qrcode1" alt="" src="">
					</div>
				</div>
			</div>
			<div id="tab1" class="weui-tab__bd-item">
				<header class='demos-header'>
					<h1 class="demos-title">微信支付</h1>
					<p class='demos-sub-title'>IJPay 让支付触手可及,微信扫码支付模式二</p>
				</header>
				<div class="bd">
					<div class="page__bd">
						<div class="weui-cell">
							<div class="weui-cell__hd">
								<label class="weui-label">金额(¥)</label>
							</div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="number" id="money2"
									placeholder="请输入数字金额,单位分">
							</div>
						</div>
					</div>
					<div class="weui-btn-area">
						<a href="javascript:scanCode2();"
							class="weui-btn weui-btn_primary">确定支付</a>
					</div>
					<div class="weui-btn-area">
						<a href="#(ctxPath)/toOauth?state=wxpay"
							class="weui-btn weui-btn_warn">重新获取openId</a>
					</div>
					<div style="text-align: center; margin-top: 30px">
						<img id="qrcode2" alt="" src="">
					</div>
				</div>
			</div>
			<div id="tab2" class="weui-tab__bd-item">
				<header class='demos-header'>
					<h1 class="demos-title">微信支付</h1>
					<p class='demos-sub-title'>IJPay 让支付触手可及,微信刷卡支付</p>
				</header>
				<div class="bd">
					<div class="page__bd">
						<div class="weui-cell">
							<div class="weui-cell__hd">
								<label class="weui-label">金额(¥)</label>
							</div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="number" id="micropay_money"
									placeholder="请输入数字金额,单位分">
							</div>
						</div>
						<div class="weui-cell">
							<div class="weui-cell__hd">
								<label class="weui-label">条形码</label>
							</div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="number" id="auth_code"
									placeholder="请输入条形码">
							</div>
						</div>
					</div>
					<div class="weui-btn-area">
						<a href="javascript:micropay();" class="weui-btn weui-btn_primary">确定支付</a>
					</div>
				</div>
			</div>
			<div id="tab3" class="weui-tab__bd-item">
				<header class='demos-header'>
					<h1 class="demos-title">微信支付</h1>
					<p class='demos-sub-title'>IJPay 让支付触手可及,公众号支付</p>
				</header>
				<div class="bd">
					<div class="page__bd">
						<div class="weui-cell">
							<div class="weui-cell__hd">
								<label class="weui-label">金额(¥)</label>
							</div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="number" id="web_money"
									placeholder="请输入数字金额,单位分">
							</div>
						</div>
					</div>
					<div class="weui-btn-area">
						<a href="javascript:wxpay();" class="weui-btn weui-btn_primary">确定支付</a>
					</div>
					<div class="weui-btn-area">
						<a href="#(ctxPath)/toOauth?state=wxpay"
							class="weui-btn weui-btn_warn">重新获取openId</a>
					</div>
				</div>
			</div>
			<div id="tab4" class="weui-tab__bd-item">
				<header class='demos-header'>
					<h1 class="demos-title">微信支付</h1>
					<p class='demos-sub-title'>IJPay 让支付触手可及 -By Javen205</p>
				</header>
				<div style="text-align: center;">
				如果对你有帮助,请任意打赏支持
					<img width="200px" height="200px" alt=""
						src="#(ctxPath)/static/images/wxpay.png">
				</div>
				<div class="weui-msg__extra-area" style="margin-bottom: 100px">
					<div class="weui-footer">
						<p class="weui-footer__links">
							<a
								href="http://wpa.qq.com/msgrd?v=3&uin=572839485&site=qq&menu=yes"
								target="_blank" class="weui-footer__link">Javen提供技术支持</a>
						</p>
						<p class="weui-footer__text">Copyright © 2015-2017</p>
					</div>
				</div>
			</div>
		</div>

		<div class="weui-tabbar">
			<a href="#tab0" class="weui-tabbar__item weui-bar__item--on"> <!-- <span
				class="weui-badge"
				style="position: absolute; top: -.4em; right: 1em;">8</span> -->
				<div class="weui-tabbar__icon">
					<img src="#(ctxPath)/static/images/icon_nav_button.png" alt="">
				</div>
				<p class="weui-tabbar__label">扫码模式一</p>
			</a> <a href="#tab1" class="weui-tabbar__item"> <!-- <span
				class="weui-badge"
				style="position: absolute; top: -.4em; right: 1em;">6</span> -->
				<div class="weui-tabbar__icon">
					<img src="#(ctxPath)/static/images/icon_nav_button.png" alt="">
				</div>
				<p class="weui-tabbar__label">扫码模式二</p>
			</a> <a href="#tab2" class="weui-tabbar__item">
				<div class="weui-tabbar__icon">
					<img src="#(ctxPath)/static/images/icon_nav_msg.png" alt="">
				</div>
				<p class="weui-tabbar__label">刷卡支付</p>
			</a> <a href="#tab3" class="weui-tabbar__item">
				<div class="weui-tabbar__icon">
					<img src="#(ctxPath)/static/images/icon_nav_article.png" alt="">
				</div>
				<p class="weui-tabbar__label">公众号支付</p>
			</a> <a href="#tab4" class="weui-tabbar__item">
				<div class="weui-tabbar__icon">
					<img src="#(ctxPath)/static/images/icon_nav_cell.png" alt="">
				</div>
				<p class="weui-tabbar__label">我</p>
			</a>
		</div>
	</div>
</body>
<script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="//cdn.bootcss.com/jquery-weui/1.0.1/js/jquery-weui.min.js"></script>
<script src="#(ctxPath)/static/layer/layer.js"></script>
<script type="text/javascript" src="#(ctxPath)/js/jquery.qrcode.min.js"></script>
<script type="text/javascript">
	/* 微信扫码支付 */
	function scanCode1() {
		$.showLoading("正在加载...");
		var total_fee = $.trim($("#money1").val());
		$.post("#(ctxPath)/wxpay/scanCode1", {
			productId : total_fee,
		}, function(res) {
			$.hideLoading();
			if (res.code == 0) {
				var name = res.data;
				console.log(name);
				showScanCode('#qrcode1', name);
			} else {
				if (res.code == 2) {
					layer.alert(res.message);
				} else {
					layer.msg("error:" + res.message, {
						shift : 6
					});
				}
			}
		});

	}
	function scanCode2() {
		$.showLoading("正在加载...");
		var total_fee = $.trim($("#money2").val());
		$.post("#(ctxPath)/wxpay/scanCode2", {
			total_fee : total_fee,
		}, function(res) {
			$.hideLoading();
			if (res.code == 0) {
				var name = res.data;
				console.log(name);
				showScanCode('#qrcode2', name);
			} else {
				if (res.code == 2) {
					layer.alert(res.message);
				} else {
					layer.msg("error:" + res.message, {
						shift : 6
					});
				}
			}
		});

	}

	function showScanCode(id, name) {
		$(id).attr("src", "#(ctxPath)/" + name);
	}
	/* 微信扫码支付 END*/
	/* 微信刷卡支付 */
	function micropay() {
		$.showLoading("正在加载...");
		var total_fee = $.trim($("#micropay_money").val());
		var auth_code = $.trim($("#auth_code").val());
		$.post("#(ctxPath)/wxpay/micropay", {
			total_fee : total_fee,
			auth_code : auth_code,
		}, function(res) {
			$.hideLoading();
			if (res.code == 0) {
				layer.msg("支付成功", {
					shift : 6
				});

				self.location = "#(ctxPath)/success.jsp";
			} else {
				if (res.code == 2) {
					layer.alert(res.message);
				} else {
					layer.msg("error:" + res.message, {
						shift : 6
					});
				}
			}
		});
	}
	/* 微信刷卡支付 END*/
	/* 微信公众号支付支付 */
	function wxpay() {
		$.showLoading("正在加载...");
		var total_fee = $.trim($("#web_money").val());
		$.post("#(ctxPath)/wxpay/webPay", {
			total_fee : total_fee,
		}, function(res) {
			$.hideLoading();
			if (res.code == 0) {
				var data = $.parseJSON(res.data);

				if (typeof WeixinJSBridge == "undefined") {
					if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady',
								onBridgeReady(data), false);
					} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady',
								onBridgeReady(data));
						document.attachEvent('onWeixinJSBridgeReady',
								onBridgeReady(data));
					}
				} else {
					onBridgeReady(data);
				}
			} else {
				if (res.code == 2) {
					layer.alert(res.message);
				} else {
					layer.msg("error:" + res.message, {
						shift : 6
					});
				}
			}
		});

	}

	function onBridgeReady(json) {
		WeixinJSBridge.invoke('getBrandWCPayRequest', json, function(res) {
			// 使用以上方式判断前端返回,微信团队郑重提示:res.err_msg将在用户支付成功后返回    ok,但并不保证它绝对可靠。
			if (res.err_msg == "get_brand_wcpay_request:ok") {
				layer.msg("支付成功", {
					shift : 6
				});

				self.location = "#(ctxPath)/success";

			} else {
				layer.msg("支付失败", {
					shift : 6
				});
			}
		});
	}
	/* 微信公众号支付支付 END */
</script>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_41690497/article/details/86233549