
编写WxController.java
@GetMapping("/qrcode")
public void qrcode(HttpServletRequest request,HttpServletResponse response) throws Exception{
String codeUrl=request.getParameter("codeUrl");
if(codeUrl!=null&&codeUrl.length()>0){
QrConfig qrConfig=new QrConfig();
qrConfig.setWidth(250);
qrConfig.setHeight(250);
qrConfig.setMargin(2);
OutputStream out=response.getOutputStream();
QrCodeUtil.generate(codeUrl,qrConfig,"jpg",out);
out.close();
}
}
编写order.html
<div id="native">
<div class="panel">
<img src="img/close.png" class="close-icon"/>
<h3>使用微信扫码支付</h3>
<img src="" width="250" height="250" class="qrcode" />
<p class="desc">请使用微信扫描该二维码完成付款</p>
<input type="button" class="close-btn" value="已经完成付款"/>
</div>
</div>
编写order.js
if(resp.code==0){
let codeUrl=resp.codeUrl
$(".qrcode").attr("src",wxUrl.qrcode+"?codeUrl="+codeUrl)
$(".close-btn").attr("data-order-id",orderId)
$("#native").show()
let num=0
let timer=setInterval(function(){
num++
let result=searchOrderStatus(orderId)
if(result){
clearInterval(timer)
location.reload()
}
else if(num==10){
clearInterval(timer)
}
},5000)
}