• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 用H5调用支付微信公众号支付的解析

用H5调用支付微信公众号支付的解析

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含微信支付,微信H5支付,公众号开发支付,微信公众号支付等相关知识,匿名希望在学习及工作中可以帮助到您
这篇文章主要为大家详细介绍了微信公众号支付H5调用支付,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

最近项目需要微信支付,然后看了下微信公众号支付,虽然不难,但是细节还是需要注意的,用了大半天时间写了个demo,并且完整的测试了一下支付流程,下面分享一下微信公众号支付的经验。

一、配置公众号微信支付

需要我们配置微信公众号支付地址和测试白名单。


比如:支付JS页面的地址为 http://www.xxx.com/shop/pay/
那此处配置www.xxx.com/shop/pay/

二、开发流程

借用微信公众号支付api(地址 http://pay.weixin.qq.com/wiki/doc/api/index.php?chapter=7_4),我们需要开发的为红色标记出的。如下:


三、向微信服务器端下订单

调用统一下单接口,这样就能获取微信支付的prepay_id(http://pay.weixin.qq.com/wiki/doc/api/index.php?chapter=9_1)。

在调用该接口前有几个字段是H5支付必须填写的openid

3.1 获取openid

可以通过网页授权形式(http://mp.weixin.qq.com/wiki/17/c0f37d5704f0b64713d5d2c37b468d75.html)

在微信中发送如下链接

https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx520c15f417810387&redirect_uri=要跳转的下订单的url&response_type=code&scope=snsapi_base&state=123#wechat_redirect

3.2 后台支付

代码如下,包含预处理订单,支付订单等接口。

package org.andy.controller; 
 
import java.io.ByteArrayInputStream; 
import java.io.IOException; 
import java.io.InputStream; 
import java.io.UnsupportedEncodingException; 
import java.util.Date; 
import java.util.HashMap; 
import java.util.Iterator; 
import java.util.Map; 
import java.util.Map.Entry; 
import java.util.Random; 
 
import javax.servlet.ServletInputStream; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
 
import org.apache.commons.codec.digest.DigestUtils; 
import org.springframework.stereotype.Controller; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.xmlpull.v1.XmlPullParser; 
import org.xmlpull.v1.XmlPullParserException; 
import org.xmlpull.v1.XmlPullParserFactory; 
 
import com.fasterxml.jackson.databind.JsonNode; 
import com.gson.oauth.Oauth; 
import com.gson.oauth.Pay; 
import com.gson.util.HttpKit; 
import com.gson.util.Tools; 
import org.andy.util.DatetimeUtil; 
import org.andy.util.JsonUtil; 
import org.andy.util.SessionUtil; 
import org.andy.util.WebUtil; 
 
@Controller 
@RequestMapping("/pay") 
public class WXPayController { 
 
 @RequestMapping(value = "wxprepay") 
 public void jspay(HttpServletRequest request, HttpServletResponse response, String callback) throws Exception { 
 // 获取openid 
 String openId = SessionUtil.getAtt(request, "openId"); 
 if (openId == null) { 
 openId = getUserOpenId(request); 
 } 
 
 String appid = "wx16691fcb0523c1a4"; 
 String partnerid = "22223670"; 
 String paternerKey = "fjfjfjfjf1234567FFFFFFFFF1234567"; 
 
 String out_trade_no = getTradeNo(); 
 Map<String, String> paraMap = new HashMap<String, String>(); 
 paraMap.put("appid", appid); 
 paraMap.put("attach", "测试支付"); 
 paraMap.put("body", "测试购买Beacon支付"); 
 paraMap.put("mch_id", partnerid); 
 paraMap.put("nonce_str", create_nonce_str()); 
 paraMap.put("openid", openId); 
 paraMap.put("out_trade_no", out_trade_no); 
 paraMap.put("spbill_create_ip", getAddrIp(request)); 
 paraMap.put("total_fee", "1"); 
 paraMap.put("trade_type", "JSAPI"); 
 paraMap.put("notify_url", "http://www.xxx.co/wxpay/pay/appPay_notify.shtml"); 
 String sign = getSign(paraMap, paternerKey); 
 paraMap.put("sign", sign); 
 
 // 统一下单 https://api.mch.weixin.qq.com/pay/unifiedorder 
 String url = "https://api.mch.weixin.qq.com/pay/unifiedorder"; 
 
 String xml = ArrayToXml(paraMap, false); 
 
 String xmlStr = HttpKit.post(url, xml); 
 
 // 预付商品id 
 String prepay_id = ""; 
 
 if (xmlStr.indexOf("SUCCESS") != -1) { 
 Map<String, String> map = doXMLParse(xmlStr); 
 prepay_id = (String) map.get("prepay_id"); 
 } 
 
 Map<String, String> payMap = new HashMap<String, String>(); 
 payMap.put("appId", appid); 
 payMap.put("timeStamp", create_timestamp()); 
 payMap.put("nonceStr", create_nonce_str()); 
 payMap.put("signType", "MD5"); 
 payMap.put("package", "prepay_id=" + prepay_id); 
 String paySign = getSign(payMap, paternerKey); 
 
 payMap.put("pg", prepay_id); 
 payMap.put("paySign", paySign); 
 
 
 WebUtil.response(response, WebUtil.packJsonp(callback, JsonUtil.warpJsonNodeResponse(JsonUtil.objectToJsonNode(payMap)).toString())); 
 } 
 
 @RequestMapping(value = "appPay") 
 public void appPay(HttpServletRequest request, HttpServletResponse response, String body, String detail, String total_fee, String spbill_create_ip, 
 String notify_url, String trade_type, String callback) throws Exception { 
 
 String appid = "wx16691fcb0523c1a4"; 
 String partnerid = "22223670"; 
 String paternerKey = "fjfjfjfjf1234567FFFFFFFFF1234567"; 
 
 String out_trade_no = getTradeNo(); 
 Map<String, String> paraMap = new HashMap<String, String>(); 
 paraMap.put("appid", appid); 
 paraMap.put("body", body); 
 paraMap.put("mch_id", partnerid); 
 paraMap.put("nonce_str", create_nonce_str()); 
 paraMap.put("out_trade_no", out_trade_no); 
 paraMap.put("spbill_create_ip", spbill_create_ip); 
 paraMap.put("total_fee", total_fee); 
 paraMap.put("trade_type", trade_type); 
 paraMap.put("notify_url", notify_url); 
 String sign = getSign(paraMap, paternerKey); 
 paraMap.put("sign", sign); 
 
 // 统一下单 https://api.mch.weixin.qq.com/pay/unifiedorder 
 String url = "https://api.mch.weixin.qq.com/pay/unifiedorder"; 
 
 String xml = ArrayToXml(paraMap, false); 
 
 String xmlStr = HttpKit.post(url, xml); 
 
 // 预付商品id 
 String prepay_id = ""; 
 
 Map<String, String> map = doXMLParse(xmlStr); 
 if (xmlStr.indexOf("SUCCESS") != -1) { 
 prepay_id = (String) map.get("prepay_id"); 
 } 
 
 String result_code = map.get("result_code"); 
 String err_code_des = map.get("err_code_des"); 
 Map<String, String> payMap = new HashMap<String, String>(); 
 payMap.put("appid", appid); 
 payMap.put("partnerid", partnerid); 
 payMap.put("prepayid", prepay_id); 
 payMap.put("package", "Sign=WXPay"); 
 payMap.put("noncestr", create_nonce_str()); 
 payMap.put("timestamp", create_timestamp()); 
 String paySign = getSign(payMap, paternerKey); 
 
 payMap.put("sign", paySign); 
 payMap.put("result_code", result_code); 
 payMap.put("err_code_des", err_code_des); 
 
 
 WebUtil.response(response, WebUtil.packJsonp(callback, JsonUtil.warpJsonNodeResponse(JsonUtil.objectToJsonNode(payMap)).toString())); 
 } 
 
 @RequestMapping("/appPay_notify") 
 public void appPayNotify(HttpServletRequest request, HttpServletResponse response) throws Exception{ 
 //String xml = "<xml><appid><![CDATA[wxb4dc385f953b356e]]></appid><bank_type><![CDATA[CCB_C
  


 

您可能想查找下面的文章:

  • H5微信支付之引入微信的js-sdk包失败的解决方法
  • 用H5调用支付微信公众号支付的解析

相关文章

  • 2018-12-03用html5的63行代码实现贪吃蛇游戏
  • 2018-12-03HTML5--多媒体标签详解
  • 2018-12-03HTML5游戏框架cnGameJS开发实录-精灵对象篇
  • 2018-12-03全面解析HTML5的文档结构和新增标签
  • 2018-12-03如何创建 HTML5 Canvas 电信网络拓扑图
  • 2018-12-03如何看待用 HTML5 技术开发的 web 应用与 Android 或 iOS 等原生应用的关系?
  • 2018-12-03H5移动端各种各样的列表的制作方法(六)
  • 2018-12-03html 5中使用video元素制作一个影片播放器
  • 2018-12-03html5 input输入实时检测以及延时优化
  • 2017-08-06使用HTML5 Canvas API控制字体的显示与渲染的方法

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 小强的HTML5移动开发之路(19)——HTML5 Local Storage(本地存储)
    • AngularJS“路由”的简介及用法介绍
    • HTML5 canvas超逼真的模拟时钟特效
    • 做导航栏为什么用ul>li,而不用dd dt dl?
    • 开发人员最常用的HTML5/CSS3代码生成器
    • H5的地理定位怎样使用
    • 如何在canvas里面基于随机点绘制一个多边形
    • 移动端Html5页面生成图片解决方案
    • HTML5 Canvas处理头像上传的图文代码详细介绍
    • H5的LocalStorage如何在本地存储刷新值

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有