h5内嵌微信小程序,调用微信支付功能

时间:2024-10-12 14:36:19

在小程序中不能使用之前在浏览器中配置的支付功能,只能调用小程序专属的api进行支付。

因为需要在现在实现的基础上,再添加在小程序中调用微信支付功能,所以我的思路是这样的

1.在点击支付按钮时,判断是不是在小程序中

2.调用小程序支付的页面,并传过去需要的值

3.在小程序支付的js文件中进行调用

实现:

首先需要引入wx的解析文件

下载地址:https://github.com/wangvv9264/jweixin

<script type="text/javascript" src="/index/js/jweixin-1.3.2.js"></script>

判断是不是在小程序中

var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
//ios的ua中无miniProgram,但都有MicroMessenger(表示是微信浏览器)
wx.miniProgram.getEnv((res)=>{
if (res.miniprogram) {
console.log('在小程序内')
wx.miniProgram.navigateTo({
url: "/pages/prowxpay/prowxpay?info="+queryParam //小程序的支付地址,queryParam是需要传递的商品id等数据
});
return false;
}else{
console.log('在微信内,但是不在小程序内')
return false;
}
})
}else{
console.log('在微信外')
return false;
}

在小程序支付的js文件中进行调用

var app = getApp();
Page({
data: {
bt: 'bt'
}, onLoad: function (options) {
var that = this;
if (options.goods_id) {
that.setLoading(options);
} else { wx.navigateBack();}
}, setLoading: function(a) {
var that = this
wx.login({
success: function(res) {
// 成功会返回:
// {errMsg: "login:ok", code: "获取用户OpenID的ticket"}
that.getOpenId(res.code,a)
}
})
},
getOpenId: function (jsCode,a) {
var that = this
wx.request({
url: baseURL + '/index/Xcxpay/login', //baseURL引入的https地址
data: {
js_code: jsCode // wx.login()时得到的ticket
},
success: function (res) {
that.getPrePayId(res.data.openid,a)
},
fail: function (res) {
console.log(res)
that.setData({
bt: ''
}),
wx.showModal({ title: "网络超时", content: "刷新重试", showCancel: !1 });
}
})
},
getPrePayId: function (openId, a) {var that = this
wx.request({
url: baseURL + '/index/Xcxpay/index?openid='+openId+'&goods_id=' + a.goods_id ,
success: function (res) {
console.log(res.data);
if(res.data.status == 1) {
that.pay(res.data.data,a);
} else {
var msg = String(res.data.msg);
wx.showModal({
title: "提醒",
content: msg,
showCancel: !1,
success(res) {
if(res.confirm) {
wx.navigateBack({
delta: 1
})
}
}
})
return false;
}
},
fail:function (res) {
console.log(res);
that.setData({
bt: ''
})
}
})
},
// data是服务端返回的JSON
// 加上success、fail回调后,正好符合wx.requestPayment()参数的格式
pay: function (res, a) {
console.log(res)
wx.requestPayment({ //成功之后,调用小程序微信支付
'timeStamp': res.timeStamp,
'nonceStr': res.nonceStr,
'package': res.package,
'signType': 'MD5',
'paySign': res.paySign,
success: function (res) {
console.log(res)
wx.request({
url: baseURL + '/index/Xcxpay/callback?goods_id=' + a.goods_id + '&msg=' + res.errMsg,
success: function(res){
console.log(res.data.status)
if(res.data.status == 1) {
wx.showToast({
title: '支付成功',
icon: 'success',
duration: 2000
})
setTimeout(()=>{
wx.redirectTo({
url: '/pages/order/order',
})
},2001)
} },
fail: function(){}
}) },
fail: function (res) {
console.log('付款失败');
console.log(res)
wx.showModal({
title: '提醒',
content: '付款失败',
showCancel: false,
success:function(res){
if(res.confirm) {
wx.navigateBack({
delta: 1
})
}
}
})
return
},
})
}, wdxreload: function(){
var pages = getCurrentPages();
var currentPage = pages[pages.length - 1]; //获取当前页面的对象
var url = currentPage.route; //当前页面url
var options = currentPage.options; //如果要获取url中所带的参数可以查看options
wx.navigateTo({ url: "/pages/wxpay/wxpay?goods_id=" + options.goods_id});
} })

我对接的后台是php,下面附上代码

public function login() {
$appid='微信小程序的appId';
$secret='微信小程序的密钥'; $params = array(
'appid' => $appid,
'secret' => $secret,
'js_code' => $_GET['js_code'], // 小程序传来的ticket
'grant_type' => 'authorization_code',
); $ch = curl_init();
curl_setopt($ch, CURLOPT_URL, 'https://api.weixin.qq.com/sns/jscode2session');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
$output = curl_exec($ch); if (false === $output) {
echo 'CURL Error:' . curl_error($ch);
}
echo $output; } //https://blog.****.net/u010505805/article/details/76861853
public function index(){
$order_id = isset($_GET['goods_id']) ? intval($_GET['goods_id']) : '';
$openid = $_GET['openid']; $this->pub_index($openid,$order_id); }
public function pub_index($openid,$order_id){
$appid='小程序appId';
$secret='微信小程序的密钥';
$url="https://api.mch.weixin.qq.com/pay/unifiedorder"; $mch_id = '';//受理商ID(即微信支付商户号)
$mch_key = '';//商户支付密钥Key
$order = $orderinfo=Db::name('order_info')->where('order_code="'.$order_id.'"')->find();
$total_fee=$order['order_amount'] * 100; $params = array(
'appid' => $appid, // 小程序appid
'mch_id' => $mch_id,
'nonce_str' => (string)mt_rand(10000, 99999), // 随机串,32字符以内
'body' => ' ', // 商品名
'out_trade_no' => $order['order_code'],
//'out_trade_no' => substr( $order['order_code'].'A'.($order['order_amount']*100).'B' ,0,32),
//订单号32字符以内。串接后取前32位。多次支付时如果重复的话,微信会返回“重复下单”
'spbill_create_ip' => $_SERVER['REMOTE_ADDR'],
'notify_url' => '', // 支付成功后的回调地址,由腾讯服务端回调
'trade_type' => 'JSAPI',
'openid' => $openid, // 小程序传来的OpenID
'total_fee' =>(string)$total_fee, // 订单费用,单位:分
); //var_dump($params);die;
// 按照要求计算sign
ksort($params);
$sequence = '';
foreach ($params as $key => $value) {
$sequence .= "$key=$value&";
} $sequence = $sequence . "key=".$mch_key;
//echo $sequence;die;
$params['sign'] = strtoupper(md5($sequence)); $xml =$this->arrayToXml($params); $ch = curl_init();
curl_setopt($ch, CURLOPT_URL,$url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $xml);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
$output = curl_exec($ch); if (false === $output) {
echo 'CURL Error:' . curl_error($ch);
}
// 下单成功的话,微信返回个XML,里面包含prepayID,提取出来 $match=$this->xml_to_array($output);
//var_dump($match);die; if($match['result_code']=='FAIL'){
$result['status']=3;
$result['msg']=$match['err_code_des'];
die(json_encode($result));
} // 这里不是给小程序返回个prepayID,而是返回一个包含其他字段的JSON
// 这个JSON小程序自己也可以生成,放在服务端生成是出于两个考虑:
// 1. 小程序的appid不用写在小程序的代码里,appid、secret信息全部由服务器管理,比较安全
// 2. 计算paySign需要用到md5,小程序端使用的是JavaScript,没有内置的md5函数,放在服务端计算md5比较方便 @$prepayId = $match['prepay_id']; if(!$match['prepay_id']){
$result['status']=4;
$result['msg']='prepay_id为空,请查看具体原因';
die(json_encode($result));
}
$response= array(
'appId' => $appid, //小程序appid
'nonceStr' => (string) mt_rand(10000, 99999), // 随机串,32个字符以内
'package' => (string)'prepay_id=' . $prepayId,
'signType' => 'MD5',
'timeStamp' => (string) time(), // 时间戳,注意得是字符串形式的
);
$sequence = '';
foreach ($response as $key => $value) {
$sequence .= "$key=$value&";
}
$response['paySign'] = strtoupper(md5("{$sequence}key=".$mch_key)); //$info['aaa']=(string)$prepayId; $result['status']=1;
$result['msg']='成功';
$result['data']=$response;
die(json_encode($result));
}
function callback(){
$order_id = $_GET['goods_id']; $result = Db::name('')->where("order_code='".$order_id."'")->update(array('pay_status'=>1,'order_status'=>1,'pay_time'=>time(),'pay_id'=>1,'pay_name'=>'微信','pay_platform'=>'小程序支付')); $orderinfo = Db::name("")->field('order_amount,add_time')->where("order_code='".$order_id."'")->find();
Db::name('order_log')->insert(array('order_code'=>$order_id,'type'=>'小程序微信支付','addtime'=>date('Y-m-d H:i:s',$orderinfo['add_time']),'paytime'=>date('Y-m-d H:i:s',time()),'order_amount'=>$orderinfo['order_amount'],'remark'=>'SUCCESS'));
$data['status']=1;
die(json_encode($data));
}
function notify($data)
{
$inputdata = file_get_contents("php://input");
if (! empty($inputdata)) { $payment = model('Payment')->get_payment("wxpay");
$postdata = json_decode(json_encode(simplexml_load_string($inputdata, 'SimpleXMLElement', LIBXML_NOCDATA)), true);
/* 检查插件文件是否存在,如果存在则验证支付是否成功,否则则返回失败信息 */
// 微信端签名
$wxsign = $postdata['sign'];
unset($postdata['sign']); // 微信附加参数
$attach = $postdata['attach']; foreach ($postdata as $k => $v) {
$Parameters[$k] = $v;
}
// 签名步骤一:按字典序排序参数
ksort($Parameters); $buff = "";
foreach ($Parameters as $k => $v) {
$buff .= $k . "=" . $v . "&";
}
$String;
if (strlen($buff) > 0) {
$String = substr($buff, 0, strlen($buff) - 1);
}
// 签名步骤二:在string后加入KEY
$String = $String . "&key=" . $payment['wxpay_key'];
// 签名步骤三:MD5加密
$String = md5($String);
// 签名步骤四:所有字符转为大写
$sign = strtoupper($String);
// 验证成功
if ($wxsign == $sign) {
// 交易成功
$returndata['return_code'] = 'SUCCESS';
} else {
$returndata['return_code'] = 'FAIL';
}
} else {
$returndata['return_code'] = 'FAIL';
$returndata['return_msg'] = '无数据返回';
}
// 数组转化为xml
$xml =$this->arrayToXml($returndata); echo $xml;
exit();
}
function arrayToXml($arr)
{ $xml = "<xml>";
foreach ($arr as $key=>$val)
{
if (is_array($val)){
$xml.="<".$key.">".arrayToXml($val)."</".$key.">";
}else{
$xml.="<".$key.">".$val."</".$key.">";
}
}
$xml.="</xml>"; return $xml;
}
function xml_to_array($xml){
if(!$xml){
return false;
}
//将XML转为array
//禁止引用外部xml实体
libxml_disable_entity_loader(true);
$data = json_decode(json_encode(simplexml_load_string($xml, 'SimpleXMLElement', LIBXML_NOCDATA)), true);
return $data;
}

欢迎各位同仁交流~

加油哦~小王