laravel--对接微信JsApi支付

学习总结

" class="reference-link">1.下载微信支付sdk,放在laravel项目中的vendor目录中,并且整理目录中的文件

1.1把example文件夹中的以WxPay.开头的文件复制到lib文件夹中

1.2把lib文件夹中的以每个文件中的require_once中的路径去掉，改为当前文件夹下调用

2.更改WxPay.Config.php中的配置信息

<?php
/**
*
* example目录下为简单的支付样例，仅能用于搭建快速体验微信支付使用
* 样例的作用仅限于指导如何使用sdk，在安全上面仅做了简单处理， 复制使用样例代码时请慎重
* 请勿直接直接使用样例对外提供服务
* 
**/
require_once "WxPay.Config.Interface.php";

/**
*
* 该类需要业务自己继承， 该类只是作为deamon使用
* 实际部署时，请务必保管自己的商户密钥，证书等
* 
*/

class WxPayConfig extends WxPayConfigInterface
{
    //=======【基本信息设置】=====================================
    /**
     * TODO: 修改这里配置为您自己申请的商户信息
     * 微信公众号信息配置
     * 
     * APPID：绑定支付的APPID（必须配置，开户邮件中可查看）
     * 
     * MCHID：商户号（必须配置，开户邮件中可查看）
     * 
     */
    public function GetAppId()
    {
        return 'AppId';
    }
    public function GetMerchantId()
    {
        return '微信支付商户号';
    }

    //=======【支付相关配置：支付成功回调地址/签名方式】===================================
    /**
    * TODO:支付回调url
    * 签名和验证签名方式， 支持md5和sha256方式
    **/
    public function GetNotifyUrl()
    {
        return "";
    }
    public function GetSignType()
    {
        return "HMAC-SHA256";
    }

    //=======【curl代理设置】===================================
    /**
     * TODO：这里设置代理机器，只有需要代理的时候才设置，不需要代理，请设置为0.0.0.0和0
     * 本例程通过curl使用HTTP POST方法，此处可修改代理服务器，
     * 默认CURL_PROXY_HOST=0.0.0.0和CURL_PROXY_PORT=0，此时不开启代理（如有需要才设置）
     * @var unknown_type
     */
    public function GetProxy(&$proxyHost, &$proxyPort)
    {
        $proxyHost = "0.0.0.0";
        $proxyPort = 0;
    }


    //=======【上报信息配置】===================================
    /**
     * TODO：接口调用上报等级，默认紧错误上报（注意：上报超时间为【1s】，上报无论成败【永不抛出异常】，
     * 不会影响接口调用流程），开启上报之后，方便微信监控请求调用的质量，建议至少
     * 开启错误上报。
     * 上报等级，0.关闭上报; 1.仅错误出错上报; 2.全量上报
     * @var int
     */
    public function GetReportLevenl()
    {
        return 1;
    }


    //=======【商户密钥信息-需要业务方继承】===================================
    /*
     * KEY：商户支付密钥，参考开户邮件设置（必须配置，登录商户平台自行设置）, 请妥善保管， 避免密钥泄露
     * 设置地址：https://pay.weixin.qq.com/index.php/account/api_cert
     * 
     * APPSECRET：公众帐号secert（仅JSAPI支付的时候需要配置， 登录公众平台，进入开发者中心可设置）， 请妥善保管， 避免密钥泄露
     * 获取地址：https://mp.weixin.qq.com/advanced/advanced?action=dev&t=advanced/dev&token=2005451881&lang=zh_CN
     * @var string
     */
    public function GetKey()
    {
        return '商户支付密钥';
    }
    public function GetAppSecret()
    {
        return 'AppSecert';
    }


    //=======【证书路径设置-需要业务方继承】=====================================
    /**
     * TODO：设置商户证书路径
     * 证书路径,注意应该填写绝对路径（仅退款、撤销订单时需要，可登录商户平台下载，
     * API证书下载地址：https://pay.weixin.qq.com/index.php/account/api_cert，下载之前需要安装商户操作证书）
     * 注意:
     * 1.证书文件不能放在web服务器虚拟目录，应放在有访问权限控制的目录中，防止被他人下载；
     * 2.建议将证书文件名改为复杂且不容易猜测的文件名；
     * 3.商户服务器要做好病毒和木马防护工作，不被非法侵入者窃取证书文件。
     * @var path
     */
    public function GetSSLCertPath(&$sslCertPath, &$sslKeyPath)
    {
        $sslCertPath = '../cert/apiclient_cert.pem';
        $sslKeyPath = '../cert/apiclient_key.pem';
    }
}

2.1AppId和AppSecert是微信公众号（服务号）申请时的，申请的微信公众号必须已经通过微信认证。

2.2微信支付商户号和商户密钥是在微信支付的官方申请的商户号，申请后会有一个商户密钥

2.3在微信支付中关联公众号

2.4在微信公众号中设置接口权限，登录公众号，开发—接口权限—功能服务—网页授权

2.5在接口域名处填写微信支付发起的域名

3.微信支付控制器源码Pay.php

• 注意：前期vendor中sdk文件夹下的目录调整，就是方便引用的时候目录的一致性，包含后调起支付时所用到的类前必须加 \ 代表当前文件下的类。

<?php

namespace App\Http\Controllers\homes;

use App\Http\Controllers\Controller;
use Exception;
//手动验证用户名和密码
use Illuminate\Support\Facades\Auth;

use Illuminate\Http\Request;
//引入数据库查询构造器，链式调用
use Illuminate\Support\Facades\DB;

//引入redis
use Illuminate\Support\Facades\Redis;
//用户支付控制器
class Pay extends Controller
{
    public function wxPay()
    {
            $dir = __DIR__.'\../../../../vendor/wxPay_sdk_v3.0.10/lib/';
            require_once $dir."WxPay.Api.php";
            require_once $dir."WxPay.JsApiPay.php";
            require_once $dir."WxPay.Config.php";
            //①、获取用户openid
            try{
                //计算总金额
                //通过Auth的自定义guard(门卫)获取当前用户登录id
                $memberID = Auth::guard('member')->id();
                //然后读取redis中该用户的所有点菜数据
                $orderData =json_decode(Redis::get('order'.$memberID),true);

                $res = [];

                $res['priceTotal'] = 0;
                if(is_array($orderData))
                {
                    foreach($orderData as $key => $ordData)
                    {
                        $num =(int)$ordData['num'];
                        $prices =json_decode($ordData['dish']['price'],true);
                        $orderData[$key]['price'] = $prices[$ordData['priceKey']];
                        $units  = json_decode($ordData['dish']['unit'],true);
                        $orderData[$key]['unit'] = $units[$ordData['priceKey']];
                        $res['priceTotal']+=(float)$prices[$ordData['priceKey']]*$num;
                    }
                }

                //调起微信支付jsApi接口
                $tools = new \JsApiPay();
                $openId = $tools->GetOpenid();
                //②、统一下单
                $input = new \WxPayUnifiedOrder();
                $input->SetBody("test");
                $input->SetAttach("test");
                $input->SetOut_trade_no("sdkphp".date("YmdHis"));
                $input->SetTotal_fee((string)($res['priceTotal']*100));
                $input->SetTime_start(date("YmdHis"));
                $input->SetTime_expire(date("YmdHis", time() + 600));
                $input->SetGoods_tag("test");
                $input->SetNotify_url("支付成功回调地址");
                $input->SetTrade_type("JSAPI");
                $input->SetOpenid($openId);
                $config = new \WxPayConfig();
                $order = \WxPayApi::unifiedOrder($config, $input);
                echo '<font color="#f00"><b>统一下单支付单信息</b></font><br/>';
                // $this->printf_info($order);
                $res['jsApiParameters'] = $tools->GetJsApiParameters($order);

                //获取共享收货地址js函数参数
                $res['editAddress'] = $tools->GetEditAddressParameters();

                return view('/homes/pay/wxPay',$res);
            } 
            catch(Exception $e) 
            {
                echo $e;
                exit;
                // Log::ERROR(json_encode($e));
            }
    }

        //打印输出数组信息
    public function printf_info($data)
    {
        foreach($data as $key=>$value){
            echo "<font color='#00ff55;'>$key</font> :  ".htmlspecialchars($value, ENT_QUOTES)." <br/>";
        }
    }

    public function wxPayCallBack()
    {
        echo 'wxsuccsss';
    }
}

4.视图页源码wxPay.blade.php

• 注意：控制器传来的数据jsApiParameters和editAddress是json数据，必须解析后使用，否则无法调起支付

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
    <script src="/static/plugins/layui/layui.js"></script>
    <title>微信支付</title>
    <script type="text/javascript">
        layui.use(['layer'],function(){
                   $ = layui.jquery;            
                   });
           //调用微信JS api 支付
               function jsApiCall()
               {
                   var jsApiPar =JSON.parse($('input[name="jsApiPar"]').val());
                   WeixinJSBridge.invoke(
                       'getBrandWCPayRequest',
                       jsApiPar,
                       function(res){
                           WeixinJSBridge.log(res.err_msg);
                           alert(res.err_code+res.err_desc+res.err_msg);
                       }
                   );
               }

               function callpay()
               {
                   if (typeof WeixinJSBridge == "undefined"){
                       if( document.addEventListener ){
                           document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
                       }else if (document.attachEvent){
                           document.attachEvent('WeixinJSBridgeReady', jsApiCall); 
                           document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
                       }
                   }else{
                       jsApiCall();
                   }
               }
    </script>

    <script type="text/javascript">
                //获取共享地址
                function editAddress()
               {               
                   var editAdd =JSON.parse($('input[name="editAdd"]').val());
                   WeixinJSBridge.invoke(
                       'editAddress',
                       editAdd,
                       function(res){
                           $('div[name="test"]').text(JSON.parse(res));
                           var value1 = res.proviceFirstStageName;
                           var value2 = res.addressCitySecondStageName;
                           var value3 = res.addressCountiesThirdStageName;
                           var value4 = res.addressDetailInfo;
                           var tel = res.telNumber;

                           alert(value1 + value2 + value3 + value4 + ":" + tel);
                       }
                   );
               }   

               window.onload = function(){
                   if (typeof WeixinJSBridge == "undefined"){
                       if( document.addEventListener ){
                           document.addEventListener('WeixinJSBridgeReady', editAddress, false);
                       }else if (document.attachEvent){
                           document.attachEvent('WeixinJSBridgeReady', editAddress); 
                           document.attachEvent('onWeixinJSBridgeReady', editAddress);
                       }
                   }else{
                       editAddress();
                   }
               }; 
       </script>
</head>
<body>
    <br/>
    <font color="#9ACD32"><b>该笔订单支付金额为<span style="color:#f00;font-size:50px">{{$priceTotal}}</span>元</b></font><br/><br/>
    <div align="center">
        <button style="width:210px; height:50px; border-radius: 15px;background-color:#FE6714; border:0px #FE6714 solid; cursor: pointer;  color:white;  font-size:16px;" type="button" onclick="callpay()" >立即支付</button>
        <input type="hidden" name="jsApiPar" value="{{$jsApiParameters}}">
        <input type="hidden" name="editAdd" value="{{$editAddress}}">
    </div>
</body>
</html>