本文目录一览：
微信支付怎么配置jsapi
微信支付，是微信向有出售物品/提供服务需求的商家提供推广销售、支付收款、经营分析的整套解决方案，包括多种支付方式，如付款码支付、JSAPI支付、小程序支付、APP支付、电脑网站支付、企业微信支付、H5支付，以及多种支付工具，如微信红包、代金券等。
微信支付配置步骤:
步骤1：注册支付商户号
步骤2、秘钥（32位）
步骤3、上传证书
步骤4、商户号新增小程序授权（注意授权状态是否是成功）
步骤5、公众号支付、JSAPI开通
登录小程序后台找到配置管理→支付配置
登录开通微信支付商户平台（），在微信支付商户平台里面进行查找商户号和设置API密钥、下载证书
以下步骤查找上述基础的内容在哪个地方查找。
步骤1、支付商户号查找：
（注：登录商户号尽量使用360浏览器或者谷歌浏览器）
进入后在 账户中心—商户信息、可以看到微信支付商户号、把商户号记一下，填到后台。
注：首次进入微信支付后台需要下载控件和操作证书（按照提示一步步操作即可）
步骤二：API密钥：随后点击下面的API安全、设置一下API秘钥，API密钥必须是32位字母或数字
注：该处设置秘钥时看下设置下方的API秘钥，不要设置APIV3的秘钥。
注：该处设置下后把新设置的密钥填到制作后台。
步骤三：证书路径、密钥路径：API秘钥设置好了之后、点击下载API证书
（注：该处证书上传用于退款。退款需要往商户号里充值钱。）
下载后是一个压缩包，然后解压、然后根据名称分别上传到证书路径、密钥路径。
步骤四：小程序在公众号里申请，公众号里开通的微信支付；该方式需要先登录商户号-产品中心-APPID授权管理-新增该小程序的授权。具体如下图：
如提示已绑定（此步骤跳过）
授权后到微信小程序后台同意授权。如图：
确保上图申请单状态是授权成功。
步骤五：查看微信支付商户号公众号支付、JSAPI是否开通。如下图：（如未开通，点击开通下，如果没有公众号支付可不用管）
（1）公众号支付开通（如果没有公众号支付，此步骤跳过）
（2）JSAPI开通
JS交互微信之JSAPI支付
本篇为 JS交互微信系列篇 的第四篇 微信JSAPI支付 ，记录在微信内置浏览器内用调用微信支付过程。
JSAPI支付是用户在微信中打开商户的H5页面，商户在H5页面通过调用微信支付提供的JSAPI接口调起微信支付模块完成支付。
要拥有两个账号：
要开通产品中心的JSAPI支付。然后 产品中心=开发配置=支付配置=公众号支付配置 绑定支付授权目录，写已通过ICP备案的域名。
另外，要在ip白名单中，配置测试地址ip和线上生产地址ip，不然各种回调都会失败！
由于在微信内支付需要获取用户的 openid ，要获取它则必须通过网页授权配置。在公微信公众平台中， 公众号设置=功能设置=网页授权域名 中按要求填写。
在支付流程方面，重点依然都在后端处理，前端方面步骤比较简单。本文只叙述前端内容。
在将要进入支付的前一页面，直接接入微信授权，然后跳转进要支付的那个页面。举个例子：有a、b两个页面，在b页面用到支付，b页面由a页面跳转而来。那么在a页面跳b页面的时候，别直接跳转b的url，而是跳转到：
{appId}redirect_uri={b.html}response_type=codescope=snsapi_base#wechat_redirect
我们注意到，这里有这两个需要自己写的参数： appid 和 redirect_uri ，意义是：
另外，还有一个注意的点是， b.html这个url我们要进行encode转码，不然地址解析可能会出现问题！
上一步执行完后，在微信浏览器中，我们会得到一个链接，类似：
b.html?code={code}state=#/
在此处，我们得到了一个code值，这就是我们获取 openid 的凭证了。
获取方法当然是把值传给后台，后台去处理啦~
在上一步中，我们拿到code值后，就可以提交一些信息给后端了，比如商品相关属性、总价等，另外加上code值，传给后端。后端一顿操作后，返回给前端。我们需要的参数如下（后端返回下面这些参数）：
上个步骤拿到需要交互微信的参数后，就开始调用微信的支付接口了，如下：
至此，调用微信JSAPI来完成在微信内的支付就完成了。
java实现微信支付，通过JSAPI发起支付请求
在config.jsp填 好 在ResponseHandler填下APPKEY 用wxm-pay-api-demo.html或者jsapi.jsp我测试是都可以用.试能用哪个用哪个吧 JS已经搞好了
ResponseHandler,ResponseHandler,payNotifyUrl.jsp都修了..
微信支付后端篇
微信支付系列文章
微信支付-java后端实现
微信支付-vue 前端实现
java demo: 下载地址文章底部
技术栈
Spring boot
java
XML (微信在http协议中数据传输方案)
MD5 签名
微信支付术语
openid (OpenID是公众号一对一对应用户身份的标识)
app_id (公众号id，登录微信公众号–开发–基本配置中获得；)
key (收款商户后台进行配置，登录微信商户平台–账户中心–API安全-设置秘钥，设置32位key值；)
mch_id (收款商家商户号；)
certPath (API证书, 登录微信商户平台–账户中心-API安全-下载证书)
后端流程
服务端需要的核心操作, 总共分为以下几步:
统一下单
前端调起微信支付必要参数 (需加密)
订单结果主动通知 (回调接口)
查询订单结果
结束订单支付接口（关闭订单，支付订单关闭）
代码
微信总共支持多种语言的sdk, 在官网可以下载例子, java程序也可以引入微信支付的sdk包, 但是github上的sdk已经很久没有更新了, 最好的选择, 也是我的选择, 在官网上下载sdk项目, 将其中所有java类copy到自己的项目中.
官网sdk下载目录
链接: 商户平台首页
#### 根据微信sdk生成配置类 WXPayConfig
创建IWxPayConfig.class, 继承sdk WXPayConfig.class, 实现sdk中部分抽象方法, 读取本地证书, 加载到配置类中.
package core.com.chidori.wxpay;
import core.com.wxpay.IWXPayDomain;
import core.com.wxpay.WXPayConfig;
import core.com.wxpay.WXPayConstants;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;
import java.io.ByteArrayInputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.InputStream;
@Service
public class IWxPayConfig extends WXPayConfig { // 继承sdk WXPayConfig 实现sdk中部分抽象方法
private byte[] certData;
@Value("${vendor.wx.config.app_id}")
private String app_id;
@Value("${vendor.wx.pay.key}")
private String wx_pay_key;
@Value("${vendor.wx.pay.mch_id}")
private String wx_pay_mch_id;
public IWxPayConfig() throws Exception { // 构造方法读取证书, 通过getCertStream 可以使sdk获取到证书
String certPath = "/data/config/chidori/apiclient_cert.p12";
File file = new File(certPath);
InputStream certStream = new FileInputStream(file);
this.certData = new byte[(int) file.length()];
certStream.read(this.certData);
certStream.close();
}
@Override
public String getAppID() {
return app_id;
}
@Override
public String getMchID() {
return wx_pay_mch_id;
}
@Override
public String getKey() {
return wx_pay_key;
}
@Override
public InputStream getCertStream() {
return new ByteArrayInputStream(this.certData);
}
@Override
public IWXPayDomain getWXPayDomain() { // 这个方法需要这样实现, 否则无法正常初始化WXPay
IWXPayDomain iwxPayDomain = new IWXPayDomain() {
@Override
public void report(String domain, long elapsedTimeMillis, Exception ex) {
}
@Override
public DomainInfo getDomain(WXPayConfig config) {
return new IWXPayDomain.DomainInfo(WXPayConstants.DOMAIN_API, true);
}
};
return iwxPayDomain;
}
}
发起统一下单 AND 前端调起微信支付必要参数
// 发起微信支付
WXPay wxpay = null;
Map result = new HashMap();
try {
// ******************************************
//
// 统一下单
//
// ******************************************
wxpay = new WXPay(iWxPayConfig); // *** 注入自己实现的微信配置类, 创建WXPay核心类, WXPay 包括统一下单接口
Map data = new HashMap ();
data.put("body", "订单详情");
data.put("out_trade_no", transOrder.getGlobalOrderId()); // 订单唯一编号, 不允许重复
data.put("total_fee", String.valueOf(transOrder.getOrderAmount().multiply(new BigDecimal(100)).intValue())); // 订单金额, 单位分
data.put("spbill_create_ip", "192.168.31.166"); // 下单ip
data.put("openid", openId); // 微信公众号统一标示openid
data.put("notify_url", ""); // 订单结果通知, 微信主动回调此接口
data.put("trade_type", "JSAPI"); // 固定填写
logger.info("发起微信支付下单接口, request={}", data);
Map response = wxpay.unifiedOrder(data); // 微信sdk集成方法, 统一下单接口unifiedOrder, 此处请求 MD5加密 加密方式
logger.info("微信支付下单成功, 返回值 response={}", response);
String returnCode = response.get("return_code");
if (!SUCCESS.equals(returnCode)) {
return null;
}
String resultCode = response.get("result_code");
if (!SUCCESS.equals(resultCode)) {
return null;
}
String prepay_id = response.get("prepay_id");
if (prepay_id == null) {
return null;
}
// ******************************************
//
// 前端调起微信支付必要参数
//
// ******************************************
String packages = "prepay_id=" + prepay_id;
Map wxPayMap = new HashMap ();
wxPayMap.put("appId", iWxPayConfig.getAppID());
wxPayMap.put("timeStamp", String.valueOf(Utility.getCurrentTimeStamp()));
wxPayMap.put("nonceStr", Utility.generateUUID());
wxPayMap.put("package", packages);
wxPayMap.put("signType", "MD5");
// 加密串中包括 appId timeStamp nonceStr package signType 5个参数, 通过sdk WXPayUtil类加密, 注意, 此处使用 MD5加密 方式
String sign = WXPayUtil.generateSignature(wxPayMap, iWxPayConfig.getKey());
// ******************************************
//
// 返回给前端调起微信支付的必要参数
//
// ******************************************
result.put("prepay_id", prepay_id);
result.put("sign", sign);
result.putAll(wxPayMap);
return result;
} catch (Exception e) {
}
回调结果处理
核心是支付订单回调时, 需校验加密签名是否匹配, 防止出现模拟成功通知
@RequestMapping(value = "/payCallback", method = RequestMethod.POST)
public String payCallback(HttpServletRequest request, HttpServletResponse response) {
logger.info("进入微信支付异步通知");
String resXml="";
try{
//
InputStream is = request.getInputStream();
//将InputStream转换成String
BufferedReader reader = new BufferedReader(new InputStreamReader(is));
StringBuilder sb = new StringBuilder();
String line = null;
try {
while ((line = reader.readLine()) != null) {
sb.append(line + " ");
}
} catch (IOException e) {
e.printStackTrace();
} finally {
try {
is.close();
} catch (IOException e) {
e.printStackTrace();
}
}
resXml=sb.toString();
logger.info("微信支付异步通知请求包: {}", resXml);
return wxTicketService.payBack(resXml);
}catch (Exception e){
logger.error("微信支付回调通知失败",e);
String result = " ";
return result;
}
}
@Override
public String payBack(String notifyData) {
logger.info("payBack() start, notifyData={}", notifyData);
String xmlBack="";
Map notifyMap = null;
try {
WXPay wxpay = new WXPay(iWxPayConfig);
notifyMap = WXPayUtil.xmlToMap(notifyData); // 转换成map
if (wxpay.isPayResultNotifySignatureValid(notifyMap)) {
// 签名正确
// 进行处理。
// 注意特殊情况：订单已经退款，但收到了支付结果成功的通知，不应把商户侧订单状态从退款改成支付成功
String return_code = notifyMap.get("return_code");//状态
String out_trade_no = notifyMap.get("out_trade_no");//订单号
if (out_trade_no == null) {
logger.info("微信支付回调失败订单号: {}", notifyMap);
xmlBack = " ";
return xmlBack;
}
// 业务逻辑处理 ****************************
logger.info("微信支付回调成功订单号: {}", notifyMap);
xmlBack = " ";
return xmlBack;
} else {
logger.error("微信支付回调通知签名错误");
xmlBack = " ";
return xmlBack;
}
} catch (Exception e) {
logger.error("微信支付回调通知失败",e);
xmlBack = " ";
}
return xmlBack;
}
统一下单的签名和后续前端拉取微信支付的签名需要统一, 也就是都采用MD5加密, 如果2者不同, 会导致前端拉取微信支付fail, 这是一个巨大的坑, 因为这个原因调试了好久, 微信在文档里没有明确标出统一下单的签名校验方式 需要和前端拉取微信支付的签名校验保持一致.
微信sdk里的源码需要针对这个问题调整一下, 调整如下:
WXPay类需要修改下加密判断，在WXPay构造方法中，调整如下
public WXPay(final WXPayConfig config, final String notifyUrl, final boolean autoReport, final boolean useSandbox) throws Exception {
this.config = config;
this.notifyUrl = notifyUrl;
this.autoReport = autoReport;
this.useSandbox = useSandbox;
if (useSandbox) {
this.signType = SignType.MD5; // 沙箱环境
}
else {
this.signType = SignType.MD5; // 将这里的加密方式修改为SignType.MD5, 保持跟前端吊起微信加密方式保持一致
}
this.wxPayRequest = new WXPayRequest(config);
}
结束语
做完以后, 微信支付的后端逻辑还是很清晰的, 但是在开发过程中很煎熬, 不清楚每个专业术语在微信哪里配置, 加密方式乱的很
