Wechat payment
- WeChat pay
- Preparation before wechat pay
- The background and development
- Vue front-end
WeChat pay
Recently, the company wants to make an event forecast on the wechat public account, and the tickets for the event need to be paid in wechat.
Preparation before wechat pay
WeChat need a WeChat payment business (https://pay.weixin.qq.com/index.php/apply/applyment_home/guide_normal), please apply themselves to business platform. After applying for the business number, you need to register at“Wechat public Account Platform — > wechat Pay”In the access. After the connection is successful, you need to log in to the system“Wechat public account platform – > Settings – > public account Settings – > Function Settings“Set up your domain name, domain name format: http://baidu.com/, and set your server IP into a whitelist, set up after you can start to develop wechat payment,
The background and development
Without more words, directly on the code, if you want to understand the details of the official document wechat payment
Control layer
@RequestMapping(value = "/wxpay", produces = MediaType.APPLICATION_JSON_VALUE) @ResponseBody public Map<String, Object> weixinPrePay(@RequestBody Pay pay,HttpServletRequest request) throws Exception { Map<String,Object> maps = new HashMap<String,Object>(); Pay.setopenid (pay.getopenid ().substring(0, pay.getopenid ().length()-1)); System.out.println(pay.getOpenid()); Double prices = pay.getprice ()*100; Double prices = pay.getprice ()*100; Integer total_fee = prices.intValue(); System.out.println(prices+"----"+pay.getPrice()+"----"+total_fee); Integer out_trade_no = (int) (system.currentTimemillis () / 1000+970516); SortedMap<String, Object> parameterMap = new TreeMap<String, Object>(); parameterMap.put("appid", Parm.APPID); Parametermap. put(" McH_id ", parm.mch_id /* payCommonUtil.mch_id */); Parametermap. put("device_info", "WEB"); parameterMap.put("nonce_str", randomString); Parametermap. put("body", "cheshi"); Parametermap. put(" out_trade_NO ", out_trade_NO); Parametermap. put("fee_type", "CNY"); // Merchant order number (unique) parameterMap is generated using the current timestamp + arbitrary number. CNY: CNY: parameterMap. Put ("total_fee", total_fee); Parametermap. put(" notifY_URL ", wxnotify); Parametermap. put("trade_type", "JSAPI"); //JSAPI--JSAPI payment (or small program payment), NATIVE-- NATIVE payment, APP-- APP payment, MWEB--H5 payment, Parametermap. put(" openID ", aseutil.aesdecrypt (pay.getopenid ()))); // Trade_type is JSAPI and openID. / / the MD5 encryption format WeChat underlying the default encryption is the HMAC - SHA256 specific you can go to see the WeChat pay the underlying code (https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=11_1) parameterMap.put("sign_type", "MD5"); String sign = PayCommonUtil.createsign ("UTF-8", parameterMap); String sign = PayCommonUtil.createsign ("UTF-8", parameterMap) parameterMap.put("sign", sign); System.out.println(parameterMap); / / WeChat order with unified interface Need to set the parameters in the splicing into XML < > > < / XML format String requestXML = PayCommonUtil. GetRequestXml (parameterMap); System.out.println(requestXML); / / call WeChat unified order interface String result = PayCommonUtil. HttpsRequest (" https://api.mch.weixin.qq.com/pay/unifiedorder ", "POST", requestXML); System.out.println(result); Map<String, Object> map = null; Prepay_id map = payCommonUtil.doxmlparse (result); prepay_id map = payCommonUtil.doxmlparse (result); Put ("timestamp", system.currentTimemillis () / 1000); Wechat Pay signature requires two signatures, If ("SUCCESS".equals(map.get("result_code"))) {SortedMap<String, Object> map2 = new TreeMap<String, Object>(); Map2. put("appId", map.get(" appId")); map2.put("timeStamp", map.get("timestamp")); Map2. put("nonceStr", map.get("nonce_str"))); Put ("package", "prepay_id=" + map.get("prepay_id"))); Map2. put("signType", "MD5"); String sign2 = PayCommonUtil.createsign ("UTF-8", map2); Map<String,Object> payInfo = new HashMap<String,Object>(); payInfo.put("appId", map.get("appid")); payInfo.put("timeStamp", map.get("timestamp")); payInfo.put("nonceStr", map.get("nonce_str")); payInfo.put("prepay_id",map.get("prepay_id")); payInfo.put("signType", "MD5"); payInfo.put("paySign", sign2); Maps. put("status", 200); Maps. put(" MSG ", "unified order successful!") ); maps.put("data", payInfo); }else { maps.put("status", 500); Maps. put(" MSG ", "server busy, please try again later "); maps.put("data", null); } } catch (JDOMException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } return maps; }Copy the code
Vue front-end
OnBridgeReady () {let that = this; Let param = {openID: sessionStorage.getitem (" openID "), // openID price: that.ruleform.price // amount to pay}; Then (ref => {console.log(ref.data); if (ref.data.status == 200) { WeixinJSBridge.invoke( "getBrandWCPayRequest", { appId: Ref.data.data. appId, // appId of wechat timeStamp: ref.data.data.timeStamp, // timeStamp nonceStr: NonceStr, // random string package: "prepay_id=" + ref.data.data.prepay_id, // order number signType: "MD5", // wechat signature: paySign: Ref.data.data. paySign}, Function (res) {if (res.err_msg == "get_brand_wcpay_request: OK ") {if (res.err_msg == "get_brand_wcpay_request: OK ") { //res.err_msg will return OK after the user has paid successfully, but it is not guaranteed to be absolutely reliable. var equipments = ""; Equipments = "single package (one ticket, tent)"; Equipments = "double package (two tickets, one tent)"; } let params = { SysUser: { name: that.ruleForm.username, mobile: that.ruleForm.phone, openid: sessionStorage.getItem("openid") }, Info_id: that.ruleForm.info, Participants: that.ruleForm.numbers, Equipments: equipments, price: that.ruleForm.price }; console.log(params); InsertForecast (params). Then (ref => {if (ref. Data.status == 200) {that.$router.push({path: "/ForeacstList" }); } else {that.$message.error(" $message.error "); }}); } else {that.$message.error(" Failed to pay, please pay again "); }}); } else { that.$message.error(ref.data.msg); }}); }, // WeixinJs() {console.log(this.ruleform.price); if (typeof WeixinJSBridge == "undefined") { if (document.addEventListener) { document.addEventListener( "WeixinJSBridgeReady", onBridgeReady, false ); } else if (document.attachEvent) { document.attachEvent("WeixinJSBridgeReady", onBridgeReady); document.attachEvent("onWeixinJSBridgeReady", onBridgeReady); } } else { this.onBridgeReady(); }}Copy the code
That’s the end of wechat Pay.