1.准备工作
首先在微信公众平台进行申请 https://mp.weixin.qq.com/ 这里需要几个值 关联的公众号appid、商户号和商户key ,当我们申请通过后就可以拿到这三个数据,就可以集成微信支付功能。
2.微信二维码接口
2.1 安装依赖
<dependency> <groupId>com.github.wxpay</groupId> <artifactId>wxpay-sdk</artifactId> <version>0.0.3</version> </dependency> <dependency> <groupId>com.alibaba</groupId> <artifactId>fastjson</artifactId> <version>1.2.76</version> </dependency>
2.2 生成二维码
步骤:
1.根据订单号查询订单信息
2.根据map设置二维码需要参数
3.发送httpclient请求,传递参数
4.得到发送请求返回结果
1)创建工具类httpclient,用于发送请求
package com.gh.mp.eduOrder.utils; import org.apache.http.Consts; import org.apache.http.HttpEntity; import org.apache.http.NameValuePair; import org.apache.http.client.ClientProtocolException; import org.apache.http.client.entity.UrlEncodedFormEntity; import org.apache.http.client.methods.*; import org.apache.http.conn.ssl.SSLConnectionSocketFactory; import org.apache.http.conn.ssl.SSLContextBuilder; import org.apache.http.conn.ssl.TrustStrategy; import org.apache.http.entity.StringEntity; import org.apache.http.impl.client.CloseableHttpClient; import org.apache.http.impl.client.HttpClients; import org.apache.http.message.BasicNameValuePair; import org.apache.http.util.EntityUtils; import javax.net.ssl.SSLContext; import java.io.IOException; import java.security.cert.CertificateException; import java.security.cert.X509Certificate; import java.text.ParseException; import java.util.HashMap; import java.util.LinkedList; import java.util.List; import java.util.Map; /** * http请求客户端 * * @author qy * */ public class HttpClient { private String url; private Map<String, String> param; private int statusCode; private String content; private String xmlParam; private boolean isHttps; public boolean isHttps() { return isHttps; } public void setHttps(boolean isHttps) { this.isHttps = isHttps; } public String getXmlParam() { return xmlParam; } public void setXmlParam(String xmlParam) { this.xmlParam = xmlParam; } public HttpClient(String url, Map<String, String> param) { this.url = url; this.param = param; } public HttpClient(String url) { this.url = url; } public void setParameter(Map<String, String> map) { param = map; } public void addParameter(String key, String value) { if (param == null) param = new HashMap<String, String>(); param.put(key, value); } public void post() throws ClientProtocolException, IOException { HttpPost http = new HttpPost(url); setEntity(http); execute(http); } public void put() throws ClientProtocolException, IOException { HttpPut http = new HttpPut(url); setEntity(http); execute(http); } public void get() throws ClientProtocolException, IOException { if (param != null) { StringBuilder url = new StringBuilder(this.url); boolean isFirst = true; for (String key : param.keySet()) { if (isFirst) url.append("?"); else url.append("&"); url.append(key).append("=").append(param.get(key)); } this.url = url.toString(); } HttpGet http = new HttpGet(url); execute(http); } /** * set http post,put param */ private void setEntity(HttpEntityEnclosingRequestBase http) { if (param != null) { List<NameValuePair> nvps = new LinkedList<NameValuePair>(); for (String key : param.keySet()) nvps.add(new BasicNameValuePair(key, param.get(key))); // 参数 http.setEntity(new UrlEncodedFormEntity(nvps, Consts.UTF_8)); // 设置参数 } if (xmlParam != null) { http.setEntity(new StringEntity(xmlParam, Consts.UTF_8)); } } private void execute(HttpUriRequest http) throws ClientProtocolException, IOException { CloseableHttpClient httpClient = null; try { if (isHttps) { SSLContext sslContext = new SSLContextBuilder() .loadTrustMaterial(null, new TrustStrategy() { // 信任所有 public boolean isTrusted(X509Certificate[] chain, String authType) throws CertificateException { return true; } }).build(); SSLConnectionSocketFactory sslsf = new SSLConnectionSocketFactory( sslContext); httpClient = HttpClients.custom().setSSLSocketFactory(sslsf) .build(); } else { httpClient = HttpClients.createDefault(); } CloseableHttpResponse response = httpClient.execute(http); try { if (response != null) { if (response.getStatusLine() != null) statusCode = response.getStatusLine().getStatusCode(); HttpEntity entity = response.getEntity(); // 响应内容 content = EntityUtils.toString(entity, Consts.UTF_8); } } finally { response.close(); } } catch (Exception e) { e.printStackTrace(); } finally { httpClient.close(); } } public int getStatusCode() { return statusCode; } public String getContent() throws ParseException, IOException { return content; } }
2)创建生成二维码接口,传递参数是订单号
/** * 生成微信二维码接口,参数是订单号 * @param orderNo * @return */ @GetMapping("createNative/{orderNo}") public R createNative(@PathVariable String orderNo){ Map map= tPayLogService.createNative(orderNo); return R.ok().data(map); }
3)创建service层,用于生成二维码
@Override public Map createNative(String orderNo) { try { //1.根据订单号查询订单信息 QueryWrapper<TOrder> queryWrapper=new QueryWrapper<TOrder>(); queryWrapper.eq("order_no",orderNo); TOrder order = orderService.getOne(queryWrapper); //2.根据map设置二维码需要参数 Map m = new HashMap(); m.put("appid", "wx74862e0dfcf69954"); m.put("mch_id", "1558950191"); //商户号 m.put("nonce_str", WXPayUtil.generateNonceStr()); //生成随机字符串 m.put("body", order.getCourseTitle()); //生成二维码的名字 m.put("out_trade_no", orderNo); //填写订单号 m.put("total_fee", order.getTotalFee().multiply(new BigDecimal("100")).longValue()+"");//转换价格 m.put("spbill_create_ip", "127.0.0.1"); //ip地址 m.put("notify_url", "http://guli.shop/api/order/weixinPay/weixinNotify\n");//回调地址 m.put("trade_type", "NATIVE"); //支付类型 //3.发送httpclient请求,传递参数 HttpClient client = new HttpClient("https://api.mch.weixin.qq.com/pay/unifiedorder"); //client设置参数 client.setXmlParam(WXPayUtil.generateSignedXml(m, "T6m9iK73b0kn9g5v426MKfHQH7X8rKwb")); client.setHttps(true); //执行请求发送 client.post(); //4.得到发送请求返回结果,返回内容是使用xml格式返回 String xml = client.getContent(); //把xml格式转换成map集合,把map集合返回 Map<String, String> resultMap = WXPayUtil.xmlToMap(xml); //最终返回数据的封装 Map map = new HashMap(); map.put("out_trade_no", orderNo); map.put("course_id", order.getCourseId()); map.put("total_fee", order.getTotalFee()); map.put("result_code", resultMap.get("result_code"));//返回二维码操作状态码 map.put("code_url", resultMap.get("code_url"));//二维码地址 return map; }catch (Exception e){ e.printStackTrace(); throw new EduException(20001,"获取二维码失败"); } }
4)前端页面
首先通过命令 npm install vue-qriously 安装插件
在配置文件使用插件
import VueQriously from ‘vue-qriously‘ Vue.use(VueQriously)
创建前端页面 _pid.vue 用于展示二维码
<template> <div class="cart py-container"> <!--主内容--> <div class="checkout py-container pay"> <div class="checkout-tit"> <h4 class="fl tit-txt"><span class="success-icon"></span><span class="success-info">订单提交成功,请您及时付款!订单号:{{payObj.out_trade_no}}</span> </h4> <span class="fr"><em class="sui-lead">应付金额:</em><em class="orange money">¥{{payObj.total_fee}}</em></span> <div class="clearfix"></div> </div> <div class="checkout-steps"> <div class="fl weixin">微信支付</div> <div class="fl sao"> <p class="red">请使用微信扫一扫。</p> <div class="fl code"> <!-- <img id="qrious" src="~/assets/img/erweima.png" > --> <!-- <qriously value="weixin://wxpay/bizpayurl?pr=R7tnDpZ" :size="338"/> --> <qriously :value="payObj.code_url" :size="338" /> <div class="saosao"> <p>请使用微信扫一扫</p> <p>扫描二维码支付</p> </div> </div> </div> <div class="clearfix"></div> <!-- <p><a href="pay.html" target="_blank">> 其他支付方式</a></p> --> </div> </div> </div> </template> <script> import { createNative,queryPayStatus } from ‘@/api/order‘ export default{ data(){ return{ orderId:‘‘, payObj:{} } }, created(){ this.orderId = this.$route.params.pid this.createNative() }, methods:{ createNative(){ createNative(this.orderId).then(res=>{ this.payObj = res.data.data }) } } } </script>