微信公众号网页支付开发

 

 最近做的游戏公众号项目需要实现在微信公众号网页进行支付，虽然是一个小的功能，初次接触支付还是犯了很多错误，在此记录一下大体的开发流程。

准备工作

第一步：申请微信商户号，配置JSAPI支付授权目录（注：发起支付的前端页面所在的请求目录，去掉最后一个/后面内容）：

例如我的支付页面请求路径是http://www.xxxxx.com/wxpay/jsPay/getPayPage,

需要配置的JSAPI支付授权目录就是：http://www.xxxxx.com/wxpay/jsPay/，后边的统一下单接口也必须在这个目录下

格式：http://www.xxxxx.com/wxpay/jsPay/ (注：域名后必须至少配置两层路径)

 

 

第二步：仔细阅读支付相关文档，仔细阅读支付相关文档，仔细阅读支付相关文档。

              文档连接：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_1

 

第三步：引入微信JS文件，http://res.wx.qq.com/open/js/jweixin-1.4.0.js，详见文档https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

开发步骤

第一步：前端页面点击支付按钮，需要传参商品名称和商品总价给后端，后台调用统一下单接口，获取支付授权参数，返回给页面（注意对照参数，长度和类型对应，订单总total_fee参数单位为分，需在后端转为单位分对应的总价金额）

所有支付的第一步都是请求统一下单，统一下单，统一下单，请求URL地址：https://api.mch.weixin.qq.com/pay/unifiedorder。统一下单的目的是拿到预支付交易会话标识prepay_id，这个是必须的。所有的支付调用都是通过prepay_id来识别。

 

下面是后台请求支付授权参数代码：

接口：

public void wxPay(){
        String gamePlayId = getPara("gamePlayId");
        String userId = getPara("userId");
        BizOrder userOrder = new BizOrder();
        userOrder.setCreateTime(new Date());
        userOrder.setGamePlayId(gamePlayId);
        userOrder.setTotalFee(0.01F);
        userOrder.setUserId(userId);
        userOrder.save();
        Map<String, Object> map = null;
        try {
            //统一下单，调用工具类请求下单方法，返回xml，用return_code判断统一下单结果,获取prepay_id等预支付成功信息
            String prePayInfoXml = WxPayUtil.unifiedOrder("PRO版报告", System.currentTimeMillis() + WxPayUtil.getNonceStr6(),
                    (new BigDecimal(userOrder.getTotalFee().toString()).multiply(new BigDecimal(100))).intValue(),
                    WxPayUtil.getIpAddr(getRequest()), getSessionAttr("openId").toString(),gamePlayId);
            //生成包含prepay_id的map，map传入前端
            log.info(prePayInfoXml);
            map = WxPayUtil.getPayMap(prePayInfoXml);
            //将订单号放入map，用以支付后处理
            map.put("orderNo", userOrder.getId());
            System.out.println("支付授权参数："+JSON.toJSONString(map));
        }catch (Exception e){
            log.error(e.getMessage());
        }

        renderJson(map);
    }

工具类：

​

public class WxPayUtil {
    private static Logger logger = Logger.getLogger(WxPayUtil.class);
    /**
     * 根据code获取openid
     * @param code
     * @return
     * @throws IOException
     */
    public static Map<String,Object> getOpenIdByCode(String code) throws IOException {
        //请求该链接获取access_token
        HttpPost httppost = new HttpPost("https://api.weixi