uni-app 公众号做微信支付和支付宝支付

公众号做微信支付和支付宝支付

微信支付

首先确保已经开通微信支付和绑定了微信公众号,如有疑问请前往微信公众平台申请。

uniapp端

<template>
	<view class="app">
		<view class="price-box">
			<text>支付金额</text>
			<text class="price">{{money}}</text>
		</view>

		<view class="pay-type-list">

			<view class="type-item b-b" @click="changePayType(1)">
				<text class="icon yticon icon-weixinzhifu"></text>
				<view class="con">
					<text class="tit">微信支付</text>
					<text>推荐使用微信支付</text>
				</view>
				<label class="radio">
					<radio value="" color="#fa436a" :checked='payType == 1' />
					</radio>
				</label>
			</view>
			<view class="type-item b-b" @click="changePayType(2)">
				<text class="icon yticon icon-alipay"></text>
				<view class="con">
					<text class="tit">支付宝支付</text>
				</view>
				<label class="radio">
					<radio value="" color="#fa436a" :checked='payType == 2' />
					</radio>
				</label>
			</view>
		</view>

		<text class="mix-btn" @click="confirm">确认支付</text>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				payType: 1, //1为微信支付 2为支付宝支付
				orderInfo: {},
				money: 0,
				orderId: 0
			};
		},
		computed: {

		},
		onLoad(options) {
			this.money = options.money;
			this.orderId = options.orderId;
		},

		methods: {
			//选择支付方式
			changePayType(type) {
				this.payType = type;
			},
			//确认支付
			confirm: async function() {
					//确认支付的时候 保证订单已经创建 把订单号和支付方式传入后台
					this.$Request.post(this.$httpApi.index.createOrder, {
						orderId: this.orderId,
						payType: this.payType
					}).then(res => {
						if (this.payType == 1) {
							this.callpay(res.data);
						}else {
							 uni.navigateTo({
							 	url:'/pages/money/aliPay?orderId='+this.orderId,
							 })
						}
					})
				
			},
			callpay(d) {
				if (typeof WeixinJSBridge == "undefined") {
					if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady', jsApiCall(d), false);
					} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady', jsApiCall(d));
						document.attachEvent('onWeixinJSBridgeReady', jsApiCall(d));
					}
				} else {
					this.jsApiCall(d);
				}
			},
			jsApiCall(d) {
				var json = eval('(' + d + ')');
				WeixinJSBridge.invoke(
					'getBrandWCPayRequest',
					json,
					function(res) {
						WeixinJSBridge.log(res.err_msg);
						if (res.err_msg == 'get_brand_wcpay_request:ok') {
							uni.redirectTo({
								url: '/pages/money/paySuccess'
							})
						} else if (res.err_msg == 'get_brand_wcpay_request:cancel') {
							msg("取消支付");
						} else if (res.err_msg == 'get_brand_wcpay_request:fail') {
							msg("支付失败");
						}
					}
				);
			}
		}
	}
</script>

<style lang='scss'>
	.app {
		width: 100%;
	}

	.price-box {
		background-color: #fff;
		height: 265upx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 28upx;
		color: #909399;

		.price {
			font-size: 50upx;
			color: #303133;
			margin-top: 12upx;

			&:before {
				content: '¥';
				font-size: 40upx;
			}
		}
	}

	.pay-type-list {
		margin-top: 20upx;
		background-color: #fff;
		padding-left: 60upx;

		.type-item {
			height: 120upx;
			padding: 20upx 0;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding-right: 60upx;
			font-size: 30upx;
			position: relative;
		}

		.icon {
			width: 100upx;
			font-size: 52upx;
		}

		.icon-erjiye-yucunkuan {
			color: #fe8e2e;
		}

		.icon-weixinzhifu {
			color: #36cb59;
		}

		.icon-alipay {
			color: #01aaef;
		}

		.tit {
			font-size: $font-lg;
			color: $font-color-dark;
			margin-bottom: 4upx;
		}

		.con {
			flex: 1;
			display: flex;
			flex-direction: column;
			font-size: $font-sm;
			color: $font-color-light;
		}
	}

	.mix-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 630upx;
		height: 80upx;
		margin: 80upx auto 30upx;
		font-size: $font-lg;
		color: #fff;
		background-color: $base-color;
		border-radius: 10upx;
		box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
	}
</style>

后端 php

    public function createOrder()

    {

        $orderId = input('post.orderId');

		// 根据订单号获取这笔订单数据
        $orders = db('orders')->where('id', $orderId)->find();

        $payType = input('post.payType');

        if ($orders['money']) {

            $domain = request()->domain();
			//作者是将每个用户的openid 存入session 所以从session中获取
            $uid = Session::get('openid', 'user');

            if ($payType == '1') { //微信支付
				// 微信支付回调接口
                $url = $domain . '/index/api/wxpay_back';
                $wxtid = $orders['tid'];
                $common = new \Common();
                $data = $common->create_wxpay_order($wxtid, $uid, $orders['money'], $url);
                return ['code' => 0, 'msg' => '微信支付', 'data' => $data];
            } elseif ($payType == '2') { //支付宝支付
                $url = $domain . '/index/api/alipay_back';
                $common = new \Common();
                $data = $common->alipay_trade_create($orders['tid'], $uid, $orders['money'], $url);
                return ['code' => 1, 'msg' => '支付宝支付', 'data' => $data];

            }


        }

    }

这里需要引入微信支付的js sdk 作者使用的thinkphp 以tp举例
导入sdk 放入exten目录下
在这里插入图片描述

    public function create_wxpay_order($tid, $uid, $money, $url)

    {

        import('wxpay.WxPay');

        $app = config('app');

        $wpa = new \WxPayApi();

        $input = new \WxPayUnifiedOrder();

        $input->SetBody("买单");

        $input->SetAttach("test");

        $input->SetOut_trade_no($tid);

        $input->SetTotal_fee($money * 100);

        $input->SetTime_start(date('YmdHis'));

        $input->SetTime_expire(date('YmdHis', time() + 600));

        $input->SetGoods_tag("test");

        $input->SetNotify_url($url);

        $input->SetTrade_type('JSAPI');

        $input->SetOpenid($uid);

        $GLOBALS['wappid'] = $app['appid'];
		//商户号
        $GLOBALS['wmchid'] = $app['mchid'];
		//微信支付密钥
        $GLOBALS['wkey'] = $app['key'];

        $GLOBALS['wappsecret'] = $app['appsecret'];

        $config = new \WxPayConfig();

        $order = $wpa->unifiedOrder($config, $input);

        return $this->GetJsApiParameters($order);

    }
    public function GetJsApiParameters($UnifiedOrderResult)

    {

        if (!array_key_exists("appid", $UnifiedOrderResult)

            || !array_key_exists("prepay_id", $UnifiedOrderResult)

            || $UnifiedOrderResult['prepay_id'] == "") {

            return ['code' => 1, 'msg' => '参数错误'];

        }



        import('wxpay.WxPay');



        $jsapi = new \WxPayJsApiPay();

        $jsapi->SetAppid($UnifiedOrderResult["appid"]);

        $timeStamp = time();

        $jsapi->SetTimeStamp("$timeStamp");



        $wpa = new \WxPayApi();



        $jsapi->SetNonceStr($wpa->getNonceStr());

        $jsapi->SetPackage("prepay_id=" . $UnifiedOrderResult['prepay_id']);



        $config = new \WxPayConfig();

        $jsapi->SetPaySign($jsapi->MakeSign($config));

        $parameters = json_encode($jsapi->GetValues());

        //file_put_contents('1.txt',$parameters);

        return $parameters;

    }

微信回调接口

  public function wxpay_back()

    {

        $post = file_get_contents('php://input');

        $data = (array)simplexml_load_string($post, 'SimpleXMLElement', LIBXML_NOCDATA);

        $app = config('app');
        $config = array(
            'mch_id' => $app['mchid'],
            'appid' => $app['appid'],
            'key' => $app['key'],
        );

        $arr = $data;
        unset($arr['sign']);
        // 验证签名是否一致
        if (self::getSign($arr, $config['key']) != $data['sign']) {
            return false;
        }
			//这里加入业务代码
			//当业务处理成功后 需要给微信返回下面的xml 否则微信会一直回调
                echo('<xml><return_code><![CDATA[SUCCESS]]></return_code><return_msg><![CDATA[OK]]></return_msg></xml>');
                return;

    }
   /**
     * 获取签名
     */
    public static function getSign($params, $key)
    {
        ksort($params);
        $unSignParaString = self::formatQueryParaMap($params, false);
        $string = $unSignParaString . "&key=".$key;
        $signStr = strtoupper(hash_hmac("sha256",$string , $key));
        return $signStr;
    }

    protected static function formatQueryParaMap($params, $urlEncode = false)
    {
        $buff = "";
        foreach ($params as $k => $v)
        {
            if($k != "sign" && $v != "" && !is_array($v)){
                $buff .= $k . "=" . $v . "&";
            }
        }

        $buff = trim($buff, "&");
        return $buff;
    }

支付宝支付

    public function alipay_trade_create($tid, $uid, $money, $url)

    {

        $app = config('app');

        $aliPay = new \AlipayServices();

        $aliPay->setAppid($app['alipayAppid']);

        $domain = request()->domain();

        $returnUrl = $domain . '/index/index/alipay_return';

        $aliPay->setReturnUrl($returnUrl);

        $aliPay->setNotifyUrl($url);

        $aliPay->setRsaPrivateKey($app['rsaPrivateKey']);

        $aliPay->setTotalFee(sprintf('%.2f', $money));

        $aliPay->setOutTradeNo($tid);

        $aliPay->setOrderName('买单');

        $sHtml = $aliPay->doPay();

        return $sHtml;

    }
<?php

header("Content-type:text/html;charset=utf-8");



class AlipayServices

{

    protected $appId;

    protected $charset;

    protected $returnUrl;

    protected $notifyUrl;

    //私钥值

    protected $rsaPrivateKey;

    protected $totalFee;

    protected $outTradeNo;

    protected $orderName;

    protected $alipayPublicKey;



    public function __construct()

    {

        $this->charset = 'utf-8';

    }



    public function setAppid($appid)

    {

        $this->appId = $appid;

    }



    public function setReturnUrl($returnUrl)

    {

        $this->returnUrl = $returnUrl;

    }





    public function setNotifyUrl($notifyUrl)

    {

        $this->notifyUrl = $notifyUrl;

    }



    public function setRsaPrivateKey($rsaPrivateKey)

    {

        $this->rsaPrivateKey = $rsaPrivateKey;

    }



    public function setAlipayPublicKey($alipayPublicKey)

    {

        $this->alipayPublicKey = $alipayPublicKey;

    }



    public function setTotalFee($payAmount)

    {

        $this->totalFee = $payAmount;

    }



    public function setOutTradeNo($outTradeNo)

    {

        $this->outTradeNo = $outTradeNo;

    }



    public function setOrderName($orderName)

    {

        $this->orderName = $orderName;

    }



    /**

     * 发起订单

     * @return array

     */

    public function doPay()

    {

        //请求参数

        $requestConfigs = array(

            'out_trade_no' => $this->outTradeNo,

            'product_code' => 'QUICK_WAP_WAY',

            'total_amount' => $this->totalFee, //单位 元

            'subject' => $this->orderName,  //订单标题

        );

        $commonConfigs = array(

            //公共参数

            'app_id' => $this->appId,

            'method' => 'alipay.trade.wap.pay',             //接口名称

            'format' => 'JSON',

            'return_url' => $this->returnUrl,

            'charset' => $this->charset,

            'sign_type' => 'RSA2',

            'timestamp' => date('Y-m-d H:i:s'),

            'version' => '1.0',

            'notify_url' => $this->notifyUrl,

            'biz_content' => json_encode($requestConfigs),

        );

        $commonConfigs["sign"] = $this->generateSign($commonConfigs, $commonConfigs['sign_type']);

        return $this->buildRequestForm($commonConfigs);

    }



    /**

     * 建立请求,以表单HTML形式构造(默认)

     * @param $para_temp 请求参数数组

     * @return 提交表单HTML文本

     */

    protected function buildRequestForm($para_temp)

    {

        $sHtml = "<form id='alipaysubmit' name='alipaysubmit' action='https://openapi.alipay.com/gateway.do?charset=" . $this->charset . "' method='POST'>";

        foreach ($para_temp as $key => $val) {

            if (false === $this->checkEmpty($val)) {

                $val = str_replace("'", "&apos;", $val);

                $sHtml .= "<input type='hidden' name='" . $key . "' value='" . $val . "'/>";

            }

        }

        //submit按钮控件请不要含有name属性

        $sHtml = $sHtml . "<input type='submit' value='ok' style='display:none;''></form>";

        $sHtml = $sHtml . "<script>document.forms['alipaysubmit'].submit();</script>";

        return $sHtml;

    }



    public function generateSign($params, $signType = "RSA")

    {

        return $this->sign($this->getSignContent($params), $signType);

    }



    protected function sign($data, $signType = "RSA")

    {

        $priKey = $this->rsaPrivateKey;

        $res = "-----BEGIN RSA PRIVATE KEY-----\n" .

            wordwrap($priKey, 64, "\n", true) .

            "\n-----END RSA PRIVATE KEY-----";

        ($res) or die('您使用的私钥格式错误,请检查RSA私钥配置');

        if ("RSA2" == $signType) {

            openssl_sign($data, $sign, $res, version_compare(PHP_VERSION, '5.4.0', '<') ? SHA256 : OPENSSL_ALGO_SHA256); //OPENSSL_ALGO_SHA256是php5.4.8以上版本才支持

        } else {

            openssl_sign($data, $sign, $res);

        }

        $sign = base64_encode($sign);

        return $sign;

    }



    /**

     * 校验$value是否非空

     *  if not set ,return true;

     *    if is null , return true;

     **/

    protected function checkEmpty($value)

    {

        if (!isset($value))

            return true;

        if ($value === null)

            return true;

        if (trim($value) === "")

            return true;

        return false;

    }



    public function getSignContent($params)

    {

        ksort($params);

        $stringToBeSigned = "";

        $i = 0;

        foreach ($params as $k => $v) {

            if (false === $this->checkEmpty($v) && "@" != substr($v, 0, 1)) {

                // 转换成目标字符集

                $v = $this->characet($v, $this->charset);

                if ($i == 0) {

                    $stringToBeSigned .= "$k" . "=" . "$v";

                } else {

                    $stringToBeSigned .= "&" . "$k" . "=" . "$v";

                }

                $i++;

            }

        }

        unset ($k, $v);

        return $stringToBeSigned;

    }



    /**

     * 转换字符集编码

     * @param $data

     * @param $targetCharset

     * @return string

     */

    function characet($data, $targetCharset)

    {

        if (!empty($data)) {

            $fileType = $this->charset;

            if (strcasecmp($fileType, $targetCharset) != 0) {

                $data = mb_convert_encoding($data, $targetCharset, $fileType);

                //$data = iconv($fileType, $targetCharset.'//IGNORE', $data);

            }

        }

        return $data;

    }

    /**

     *  验证签名

     **/

    public function rsaCheck($params) {

        $sign = $params['sign'];

        $signType = $params['sign_type'];

        unset($params['sign_type']);

        unset($params['sign']);

        return $this->verify($this->getSignContent($params), $sign, $signType);

    }



    function verify($data, $sign, $signType = 'RSA') {

        $pubKey= $this->alipayPublicKey;

        $res = "-----BEGIN PUBLIC KEY-----\n" .

            wordwrap($pubKey, 64, "\n", true) .

            "\n-----END PUBLIC KEY-----";

        ($res) or die('支付宝RSA公钥错误。请检查公钥文件格式是否正确');



        //调用openssl内置方法验签,返回bool值

        if ("RSA2" == $signType) {

            $result = (bool)openssl_verify($data, base64_decode($sign), $res, version_compare(PHP_VERSION,'5.4.0', '<') ? SHA256 : OPENSSL_ALGO_SHA256);

        } else {

            $result = (bool)openssl_verify($data, base64_decode($sign), $res);

        }

//        if(!$this->checkEmpty($this->alipayPublicKey)) {

//            //释放资源

//            openssl_free_key($res);

//        }

        return $result;

    }

}

结语

总结的也就这么多 支付宝支付可能还需要一个第三方页面 来完成支付后用于跳转

//微信充值 //支付接口测试 function balance(url, data) { uni.request({ url: cfg.originUrl + '/wx/mp/js_sig.do', data: { route: url }, method: 'GET', success: (res) => { jweixin.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来 appId: res.data.appId, // 必填,公众号的唯一标识 timestamp: res.data.timestamp, // 必填,生成签名的时间戳 nonceStr: res.data.nonceStr, // 必填,生成签名的随机串 signature: res.data.signature, // 必填,签名 jsApiList: ['chooseWXPay'] // 必填,需要使用的JS接口列表 }); jweixin.ready(function() { uni.request({ url: cfg.originUrl + '/wx/recharge/pay.do', method: 'POST', header: { 'Content-type': "application/x-www-form-urlencoded", }, data: JSON.stringify(data), success: function(res) { alert("下单成功"); alert(JSON.stringify(res)); alert(res.data.order_id); all.globalData.orderId = res.data.order_id; uni.setStorageSync('orderId', res.data.order_id); jweixin.chooseWXPay({ timestamp: res.data.payParams.timeStamp, // 支付签名时间戳 nonceStr: res.data.payParams.nonceStr, // 支付签名随机串 package: res.data.payParams.package, // 接口返回的prepay_id参数 signType: res.data.payParams.signType, // 签名方式 paySign: res.data.payParams.paySign, // 支付签名 success: function(e) { alert("支付成功"); alert(JSON.stringify(e)); // 支付成功后的回调函数 } }); } }) }); jweixin.error(function(res) { // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。 console.log("验证失败!") }); } }) }
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值