微信扫码支付与生成二维码

二维码

　　(1) 容错级别

　　　　L级（低） 7％的码字可以被恢复。

　　　　M级（中） 的码字的15％可以被恢复。

　　　　Q级（四分）的码字的25％可以被恢复。

　　　　H级（高） 的码字的30％可以被恢复。

　　(2) 二维码生成插件qrious

　　　　qrious是一款基于HTML5 Canvas的纯JS二维码生成插件。通过qrious.js可以快速生成各种二维码，你可以控制二维码的尺寸颜色，还可以将生成的二维码进行Base64编码。

　　　　qrious.js二维码插件的可用配置参数如下：


参数
类型
默认值
描述

background
String
"white"
二维码的背景颜色。

foreground
String
"black"
二维码的前景颜色。

level
String
"L"
二维码的误差校正级别(L, M, Q, H)。

mime
String
"image/png"
二维码输出为图片时的MIME类型。

size
Number
100
二维码的尺寸，单位像素。

value
String
""
需要编码为二维码的值

 web引入qrious.js

qrious.min.js

微信支付SDK

　　(1) 解压WxPayAPI_JAVA_v3.zip

　　(2) 将解压的maven工程导入到IDE(eclipse)

　　(3) 打成jar包,并安装到maven仓库

mvn install:install-file -Dfile=d:\setup\wxpay-sdk-0.0.3.jar -DgroupId=com.github.wxpay -DartifactId=wxpay-sdk -Dversion=0.0.3 -Dpackaging=jar

　　(4) 在要使用微信扫码支付的工程引入依赖

<dependency>
    <groupId>com.github.wxpay</groupId>
    <artifactId>wxpay-sdk</artifactId>
    <version>0.0.3</version>
</dependency>

HttpClient工具类

　　HttpClient是Apache Jakarta Common下的子项目，用来提供高效的、最新的、功能丰富的支持HTTP协议的客户端编程工具包，并且它支持HTTP协议最新的版本和建议。HttpClient已经应用在很多的项目中，比如Apache Jakarta上很著名的另外两个开源项目Cactus和HTMLUnit都使用了HttpClient。

　　HttpClient通俗的讲就是模拟了浏览器的行为，如果我们需要在后端向某一地址提交数据获取结果，就可以使用HttpClient.

　　关于HttpClient（原生）相对比较麻烦，进行封装，使用封装后的工具类HttpClient（对原生HttpClient进行了封装）

HttpClient工具类使用的步骤　

HttpClient client=new HttpClient(请求的url地址);
client.setHttps(true);//是否是https协议
client.setXmlParam(xmlParam);//发送的xml数据
client.post();//执行post请求
String result = client.getContent(); //获取结果

添加配置文件weixinpay.properties

## 微信公众账号或开放平台APP的唯一标识appid=****************## 财付通平台的商户账号partner=*********## 财付通平台的商户密钥partnerkey=*********************************## 回调地址notifyurl=http://a31ef7db.ngrok.io/WeChatPay/WeChatPayNotify

将二维码插件QRious拷贝到web 的plugins目录中

后端代码(ServiceImpl)

@Service
public class WeixinPayServiceImpl implements WeixinPayService {

    @Value("${appid}")
    private String appid;

    @Value("${partner}")
    private String partner;

    @Value("${partnerkey}")
    private String partnerkey;

    /**
     * 生成二维码
     * @return
     */
    public Map createNative(String out_trade_no,String total_fee){
        //1.创建参数
        Map<String,String> param=new HashMap();//创建参数
        param.put("appid", appid);//公众号
        param.put("mch_id", partner);//商户号
        param.put("nonce_str", WXPayUtil.generateNonceStr());//随机字符串
        param.put("body", "xxx");//商品描述
        param.put("out_trade_no", out_trade_no);//商户订单号
        param.put("total_fee",total_fee);//总金额（分）
        param.put("spbill_create_ip", "127.0.0.1");//IP
        param.put("notify_url", "http://www.xxx.cn");//回调地址(随便写)
        param.put("trade_type", "NATIVE");//交易类型
        try {
            //2.生成要发送的xml
            String xmlParam = WXPayUtil.generateSignedXml(param, partnerkey);
            System.out.println(xmlParam);
            HttpClient client=new HttpClient("https://api.mch.weixin.qq.com/pay/unifiedorder");
            client.setHttps(true);
            client.setXmlParam(xmlParam);
            client.post();
            //3.获得结果
            String result = client.getContent();
            System.out.println(result);
            Map<String, String> resultMap = WXPayUtil.xmlToMap(result);
            Map<String, String> map=new HashMap<>();
            map.put("code_url", resultMap.get("code_url"));//支付地址
            map.put("total_fee", total_fee);//总金额
            map.put("out_trade_no",out_trade_no);//订单号
            return map;
        } catch (Exception e) {
            e.printStackTrace();
            return new HashMap<>();
        }
    }
}

后端代码(Controller)

/**
 * 支付控制层
 * @author Administrator
 *
 */
@RestController
@RequestMapping("/pay")
public class PayController {
    @Reference
    private  WeixinPayService weixinPayService;

    /**
     * 生成二维码
     * @return
     */
    @RequestMapping("/createNative")
    public Map createNative(){
        IdWorker idworker=new IdWorker();
        return weixinPayService.createNative(idworker.nextId()+"","1");
    }
}

 前端代码,先引入angular.js

angular.min.js

base.js

var app = angular.module(‘xxx‘, []);

Service.js

app.service(‘payService‘,function($http){
    //本地支付
    this.createNative=function(){
        return $http.get(‘pay/createNative.do‘);
    }
});

Controller.js

app.controller(‘payController‘ ,function($scope ,payService){
    //本地生成二维码
    $scope.createNative=function(){
        payService.createNative().success(
            function(response){
                $scope.money=  (response.total_fee/100).toFixed(2) ;    //金额
                $scope.out_trade_no= response.out_trade_no;//订单号
                //二维码
                var qr = new QRious({
                    element:document.getElementById(‘qrious‘),// 根据id选择元素
                    size:250,
                    level:‘H‘,
                    value:response.code_url
                 });
            }
        );
    }
});

html页面

　　引入js

<script type="text/javascript" src="plugins/angularjs/angular.min.js">  </script>
    <script type="text/javascript" src="js/base.js">  </script>
    <script type="text/javascript" src="js/service/payService.js">  </script>
    <script type="text/javascript" src="js/controller/payController.js">  </script>
    <script type="text/javascript" src="plugins/qrious.min.js"></script>

　　指令

<body ng-app="pinyougou" ng-controller="payController" ng-init="createNative()">

　　html代码

<p class="red"></p>
         <div class="fl code">
              <img id="qrious">
              <div class="saosao">
                  <p>请使用微信扫一扫</p>
                  <p>扫描二维码支付</p>
         </div>
</div>

微信扫码支付状态

　　后端(ServiceImpl)

@Override
    public Map queryPayStatus(String out_trade_no) {
        Map param=new HashMap();
        param.put("appid", appid);//公众账号ID
        param.put("mch_id", partner);//商户号
        param.put("out_trade_no", out_trade_no);//订单号
        param.put("nonce_str", WXPayUtil.generateNonceStr());//随机字符串
        String url="https://api.mch.weixin.qq.com/pay/orderquery";
        try {
            String xmlParam = WXPayUtil.generateSignedXml(param, partnerkey);
            HttpClient client=new HttpClient(url);
            client.setHttps(true);
            client.setXmlParam(xmlParam);
            client.post();
            String result = client.getContent();
            Map<String, String> map = WXPayUtil.xmlToMap(result);
            System.out.println(map);
            return map;
        } catch (Exception e) {
            e.printStackTrace();
            return null;
        }
    }

后端代码(Controller)

/**
     * 查询支付状态
     * @param out_trade_no
     * @return
     */
    @RequestMapping("/queryPayStatus")
    public Result queryPayStatus(String out_trade_no){
        Result result=null;　　　　　int x = 0;　　　　　
        while(true){
            //调用查询接口
            Map<String,String> map = weixinPayService.queryPayStatus(out_trade_no);
            if(map==null){//出错
                result=new  Result(false, "支付出错");
                break;
            }
            if(map.get("trade_state").equals("SUCCESS")){//如果成功
                result=new  Result(true, "支付成功");
                break;
            }
            try {
                Thread.sleep(3000);//间隔三秒
            } catch (InterruptedException e) {
                e.printStackTrace();
            }　　　　　　　　//为了不让循环无休止地运行，我们定义一个循环变量，如果这个变量超过了这个值则退出循环，设置时间为5分钟　　　　　　　　x++;　　　　　　　　if(x>=100){　　　　　　　　　　result=new  Result(false, "二维码超时");　　　　　　　　　　//1.调用微信的关闭订单接口（学员实现）　　　　　　　　　　Map<String,String> payresult = weixinPayService.closePay(out_trade_no);　　　　　　　　　　if( !"SUCCESS".equals(payresult.get("result_code")) ){//如果返回结果是正常关闭　　　　　　　　　　　　if("ORDERPAID".equals(payresult.get("err_code"))){　　　　　　　　　　　　　　result=new Result(true, "支付成功");　　　　　　　　　　　　　　seckillOrderService.saveOrderFromRedisToDb(userId, Long.valueOf(out_trade_no), map.get("transaction_id"));　　　　　　　　　　　　　　}　　　　　　　　　　}　　　　　　　　　　if(result.isSuccess()==false){　　　　　　　　　　　　System.out.println("超时，取消订单");　　　　　　　　　　　　//2.调用删除　　　　　　　　　　　　seckillOrderService.deleteOrderFromRedis(userId, Long.valueOf(out_trade_no));　　　　　　　　　　}　　　　　　　　　　break;　　　　　　　　}
        }
        return result;
    }

前端js

　　Controller.js

//查询支付状态
    queryPayStatus=function(out_trade_no){
        payService.queryPayStatus(out_trade_no).success(
            function(response){
                if(response.success){
                    location.href="paysuccess.html";
                }else{　　　　　　　　　　　　if(response.message==‘二维码超时‘){　　　　　　　　　　　　　　location.href="payTimeOut.html"; 　　　　　　　　　　　　}else{　　　　　　　　　　　　　　location.href="payfail.html";　　　　　　　　　　　　}
                }
            }
        );
    }

　　Service.js

　　修改createNative方法

//本地生成二维码
    $scope.createNative=function(){
        payService.createNative().success(
            function(response){
                ..........
                 queryPayStatus(response.out_trade_no);//查询支付状态
            }
        );
    }

关闭微信扫码支付

　　后端代码(ServiceImpl)

@Override
    public Map closePay(String out_trade_no) {
        Map param=new HashMap();
        param.put("appid", appid);//公众账号ID
        param.put("mch_id", partner);//商户号
        param.put("out_trade_no", out_trade_no);//订单号
        param.put("nonce_str", WXPayUtil.generateNonceStr());//随机字符串
        String url="https://api.mch.weixin.qq.com/pay/closeorder";
        try {
            String xmlParam = WXPayUtil.generateSignedXml(param, partnerkey);
            HttpClient client=new HttpClient(url);
            client.setHttps(true);
            client.setXmlParam(xmlParam);
            client.post();
            String result = client.getContent();
            Map<String, String> map = WXPayUtil.xmlToMap(result);
            System.out.println(map);
            return map;
        } catch (Exception e) {
            e.printStackTrace();
            return null;
        }
    }

后端代码(Controller)
　　修改queryPayStatus方法

 前端代码

　　修改queryPayStatus方法

原文地址：https://www.cnblogs.com/lin-nest/p/10320053.html

时间： 2024-11-08 04:31:32

微信扫码支付与生成二维码的相关文章

java 生成 二维码 和jquery 生成二维码

生成二维码 Java 生成二维码: 思路为拿到jar 包知道里面的方法使用 Step one : 在https://github.com/zxing中下载(点击网页中名为 zxing 的a标签,跳转到源码页面,点击release 查看所有发布的源码,下载zip压缩文件 Step two:  解压文件后打开文件夹,将core包和javase包 中的com包拷贝到一java项目src目录下.右键导出 jar file  得到一个二维码开发的jar包 Step three: 进行二维码制作 impor

iOS 简单易用的二维码扫描及生成二维码三方控件LFQRCode，可灵活自定义UI

扫描的控件是一个view,使用者只需贴在自己的控制器内即可.其他UI用户可在自己控制器随便添加.代码如下 - (void)viewDidLoad { [super viewDidLoad]; //扫描有效区(即框内透明区域) CGRect interestRect = CGRectMake(20, (self.view.frame.size.height - (self.view.frame.size.width - 40))/2.0f, self.view.frame.size.width -

微信二维码来源统计自动生成二维码统计？

微信二维码来源统计,我们先来了解下渠道二维码,我们的微信公众号使用渠道二维码可以实现记录粉丝是通过二维码扫描关注并进入活动功能的统计,渠道二维码还可以让粉丝扫码后直接关注成为粉丝并直接弹出微信活动的页面,真正实现关注加参与微信活动的快捷体验,然后就是注册微号帮平台,授权我们的认证服务号,才可以实现渠道二维码. 自动生成二维码统计操作.微信服务号如何授权微号帮平台?1.微信公众号授权微号帮平台(1)添加授权公众号 (2)微信扫码授权公众号使用微信公众平台绑定的管理员个人微信号扫描 (3)微信公众号

Python3使用qrcode生成二维码教程

一.安装依赖库 pip install qrcode pillow image pillow是python3中PIL的代替库,image是生成图版需要用到的库 安装image时报错"Could not install packages due to an EnvironmentError: [Errno 22] invalid mode ('wb') or filename",没管,直接在pycharm的setting中安装就没报错了. 二.简单用法 以下是生成指向百度的二维码为例,用

.net Core 调用微信Jsapi接口，H5解析二维码

项目里需要用到扫描二维码,自己实现,不会. 找到了两种解决方案: 通过reqrcode.js,这是一个前端解析二维码内容的js库.如果二维码比较清晰,用这种效果也不错 调用微信扫一扫功能,这种效果很好.但是调试接口超级麻烦. 具体实现:前端代码(vue)(前端用到 vux) <template> <div class="main"> <group title="打印机参数" label-width="5.5em"&g

C#运用QRCode生成二维码

在现在的项目中,较多的使用到二维码,现在介绍一个第三方组件,用于生成二维码. 生成二维码:         /// <summary>         /// 生成二维码         /// </summary>         /// <param name="content">带生成二维码的字符串</param>         /// <param name="path">路径</param

Android二维码开源项目zxing用例简化和生成二维码、条形码

上一篇讲到:Android二维码开源项目zxing编译,编译出来后有一个自带的测试程序:CaptureActivity比较复杂,我只要是把一些不用的东西去掉,用看起来更方便,二维码和条形码的流行性自不必说了. 自带的例子,目录结构如下: 修改后的程序目录结构,去掉了很多功能,如果分享.设置等. 先上效果图          扫描ZXing生成的条形码和二维码结果 扫描界面 扫描商品的条码 整个程序只修改了以下两个类,其它都是直接从原来的Demo中复制出来的 生成二维码的代码 /** * 生成二维

java生成二维码的几种方式

1: 使用SwetakeQRCode在Java项目中生成二维码 http://swetake.com/qr/ 下载地址 或着http://sourceforge.jp/projects/qrcode/downloads/28391/qrcode.zip 这个是日本人写的,生成的是我们常见的方形的二维码 可以用中文 如:5677777ghjjjjj 2: 使用BarCode4j生成条形码和二维码 BarCode4j网址:http://sourceforge.NET/projects/barcode

使用ZXing扫描二维码和生成二维码

二维码在APP中的使用越来越多,于是就是找了相关的资料写了一个二维码扫描和生成二维码的Demo. 本Demo使用了第三方的ZXing库.github的地址: Zxing AndroidStudio中的引用: File---New---import  module导入ZXing的第三方库然后选中项目按F4, 点击加号选择File dependency将ZXing库导入. 接下来就开始写布局文件 activity_main.xml <?xml version="1.0" encodi