12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
- <title>支付测试页</title>
- <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
- <script src="qrcode.min.js" type="text/javascript"></script>
- </head>
- <body>
- <div>点击如下按钮,发起支付宝扫码支付的测试</div>
- <div>
- <button id="alipay_wap">支付宝扫码支付</button>
- </div>
- <div id="qrcode"></div>
- </body>
- <style>
- #qrcode{
- padding-left: 20px;
- padding-top: 20px;
- }
- </style>
- <script>
- let shopOrderId = undefined;
- let payOrderId = undefined;
- let server = 'http://127.0.0.1:48080';
- $(function() {
- // 自动发起商城订单编号
- $.ajax({
- url: server + "/app-api/shop/order/create",
- method: 'POST',
- success: function( result ) {
- if (result.code !== 0) {
- alert('创建商城订单失败,原因:' + result.msg)
- return;
- }
- shopOrderId = result.data.id;
- payOrderId = result.data.payOrderId;
- console.log("商城订单:" + shopOrderId)
- console.log("支付订单:" + payOrderId)
- }
- })
- });
- // 支付宝扫码支付
- $( "#alipay_wap").on( "click", function() {
- // 提交支付
- $.ajax({
- url: server + "/app-api/pay/order/submit",
- method: 'POST',
- dataType: "json",
- contentType: "application/json",
- data: JSON.stringify({
- "id": payOrderId,
- "channelCode": 'alipay_qr'
- }),
- success: function( result ) {
- if (result.code !== 0) {
- alert('提交支付订单失败,原因:' + result.msg)
- return;
- }
- //提交支付后返回的参数
- let data = result.data.invokeResponse;
- new QRCode($("#qrcode")[0],{
- text: data.qrCode, //内容
- width:98, //宽度
- height:98, //高度
- correctLevel: 3,//二维码纠错级别
- background: "#ffffff",//背景颜色
- foreground: "#000000"//二维码颜色
- });
- console.log("data.qrCode===",data.qrCode)
- }
- })
- });
- </script>
- </html>
|