您现在的位置是:首页 > cms教程 > WordPress教程WordPress教程
wordpress实现微信支付功能详解
梦琪2023-06-26WordPress教程已有人查阅
导读对于调用微信支付,微信提供了 JS SDK 来帮助我们实现在微信里面调用微信支付的功能。下面是具体的实现步骤,

对于调用微信支付,微信提供了 JS SDK 来帮助我们实现在微信里面调用微信支付的功能。下面是具体的实现步骤,
头一步、安装实现微信支付所需的包
我们依然使用Omnipay Wechat Pay这个包来帮助我们实现微信支付,其实和之前的原生扫码支付方法是类似的,只不过使用的接口不同罢了。下面是我开发的微信网站中使用的库。其中前两个不用说了,很明显是微信支付所用的 Omnipay 库,Wordpress Dispatcher 是一个 WordPress Router 系统,用来实现自定义 URL,Valitron 主要用来验证用户提交数据。
"require": {
"omnipay/omnipay": "~2.0",
"lokielse/omnipay-wechatpay": "^1.0",
"thefold/wordpress-dispatcher": "^1.0",
"vlucas/valitron": "^1.2",
},
运行composer install命令安装完成后,在主题或插件中引入自动加载文件。
require_once( get_template_directory() . '/vendor/autoload.php' );
前端实现:配置微信 JS SDK,并实现微信支付
这里的 jssdk.php 是微信官方提供的,用来实现为初始化微信 JS SDK 提供签名包。在需要实现微信支付的页面引入这个文件,然后初始化 JSSDK 类即可。
require_once( get_template_directory() . '/inc/jssdk.php' );
$jssdk = new JSSDK( "xxxxx", "xxxxxxxxxxxxxxxx" );
$signPackage = $jssdk->GetSignPackage();
初始化微信 JS sdk, 调用微信支付方法实现微信支付
首先、确保在页面的 head 因为了微信 JS SDK 的 JavaScript 文件:jweixin-1.0.0.js。根据上面获取的 $signPackage,我们在下面代码中完成了以下几个操作。
使用 wx.config 初始化 js sdk使用 wx.ready 检测 js sdk 是否初始化成功,如果初始化成功,我们就可以使用微信 js sdk 提供的接口进行操作了。点击支付按钮时,发送一个 Ajax 请求到服务器,获取微信订单,然后使用 wx.chooseWXPay 发起微信支付,就是我们在微信里面看到的弹出输入微信密码的界面。
jQuery(document).ready(function ($) {
// 配置 js sdk
wx.config({
debug: false,
appId: '<?php echo $signPackage[ "appId" ];?>',
timestamp: <?php echo $signPackage[ "timestamp" ];?>,
nonceStr: '<?php echo $signPackage[ "nonceStr" ];?>',
signature: '<?php echo $signPackage[ "signature" ];?>',
jsApiList: ['chooseWXPay']
// 这里的 jsApiList 需要什么就填写什么
});
// 要检查 js sdk 是否已经准备好了
wx.ready(function () {
$("#topay").click(function () {
$.ajax({
url: '/order/',
type: 'POST',
dataType: 'json',
data: $("#wepay").serialize(),
success: function (order) {
var params = {
'timestamp': order.timeStamp,
'nonceStr': order.nonceStr,
'package': order.package,
'signType': order.signType,
'paySign': order.paySign };
wx.chooseWXPay(params);
},
error: function (order) {
c-alert(order.message);
}
});
return false;
});
});});
支付窗口闪一下消失有以下几种情况
在微信上测试微信支付的时候,经常会遇到微信支付窗口闪一下就消失了,看不到输入支付密码的界面,可能的原因有以下几点,仔细检查一下。
jssdk 没有配置,检查上面代码中的 wx.config 和 wx.readyAjax 返回的数据有错误,检查 Ajax 请求的返回数据安全域名设置错误,检查在微信管理后台中,是否把测试域名加入到了安全域名中
后端实现:验证并发送订单数据
后端实现很简单,就是接收上面 Ajax 提交过来的数据,然后处理微信支付需要的 Json 数据,同时保存订单到站点的数据库中,供后续查询和后面的通知回调中使用。
// 获取微信支付 的函数function get_wechat_gateway() {
$gateway = Omnipay::create( 'WechatPay_Js' );
$gateway->setAppId( ' xxxxxxxx' );
$gateway->setMchId( 'xxxxxxxx' );
$gateway->setApiKey( 'xxxxxxxx' ); //注意这里的 ApiKey 是我们在微信商户后台设置的一个32位的随机字符串,和微信公众号里面的 App Secrit 不是一回事。
return $gateway;}/**
* 处理订单信息, 跳转到微信支付
*/new Dispatch( [
'wepay/order' => function ( $request ) {
// 检查用户提交的数据是否有错,如果有错误,返回错误信息
$v = new Validator( $_POST );
$v->rule( 'required', [ 'count', 'buyer_name', 'buyer_phone', 'buyer_address' ] );
if ( ! $v->validate() ) {
$msg = [
'success' => '0',
'message' => '下单失败, 请检查所有必填项。',
];
wp_send_json( $msg );
}
$user = wp_get_current_user();
$req = Request::createFromGlobals();
$pid = $req->get( 'pid' );
$count = $req->get( 'count' );
$open_id = $req->cookies->get( 'open_id' );
$prod = get_post( $pid );
$price = get_post_meta( $pid, '_prod_price', true );
$total_fee = $price * $count * 100;
$tn = date( 'YmdHis' ) . mt_rand( 1000, 9999 );
// 在实际开发过程中,我们需要把用户提交的订单数据保存到数据库一份
// 订单参数
$order = [
'body' => $prod->post_title',
'out_trade_no' => $tn,
'total_fee' => $total_fee,
'spbill_create_ip' => wizhi_get_real_ip(),
'fee_type' => 'CNY',
'open_id' => $open_id,
];
// 发送支付请求到微信并获取返回信息
$gateway = get_wechat_gateway();
$gateway->setNotifyUrl( 'https:// .wpzhiku.com/order/return' );
$response = $gateway->purchase( $order )->send();
$wechat_return = $response->getJsOrderData();
wp_send_json( $wechat_return );
},] );
接受微信支付成功通知,实现自动完成订单或自动充值,支付完成后,微信会返回一个支付成功的通知到我们提供的通知 URL,我们可以根据返回的内容,进行自动完成订单或者自动充值等操作。这里有两点需要注意。
通知 URL 要能访问,如果不能访问,微信不会发送通知。要和支付URL在一个目录下
微信官方提供的 SDK 和接口数据非常不规范,在使用的时候 要代码中的注意大小写,出现了问题,仔细和微信官方提供的开发文档相对照,如果你使用的语言或开发框架提供了微信开发所用到库,建议直接使用这些库进行开发,这些库可以帮助我们绕过微信为我们挖下的各种大坑小坑,减少调试难度、加快开发速度。
本文标签:
很赞哦! ()
相关教程
图文教程
wordpress搬家的方法步骤教程
wordpress是很流行的博客建站程序,在使用中难免会碰到一些要搬服务器的情况,下面我以服务器上的网站搬到本地127.0.0.1为例
DIY制作wordpress留言板页面的方法
做一个wordpress留言板很简单,我们知道一般可以用新建一个主题名字叫“留言板”的页面,让访客以评论留言的方式来实现。但是这种方式建立的留言板,其实是一个一般主题(post)或
Ubuntu16.04搭建WordPress的步骤教程
Ubuntu16.04搭建WordPress的方法,希望对需要的朋友有所帮助!Ubuntu16.04搭建WordPress安装Apache安装apt-get install apache2
WordPress评论禁止针对指定内容全英文的方法
WordPress评论怎么禁止针对指定内容全英文?本文实例讲述了WordPress评论禁止针对指定内容全英文的方法。
相关源码
-
pbootcms响应式蓝色旅游旅行社pbootcms网站源码下载为旅游公司、旅行社定制的响应式网站模板,聚焦旅游线路展示、景点推荐及预约服务场景。采用PbootCMS内核开发,自适应技术确保PC与手机端数据实时同步查看源码 -
(PC+WAP)蓝色公司注册财务会计公证律师网站源码下载本模板基于PbootCMS内核开发,为财务会计事务所、律师公证机构等专业服务机构打造。采用自适应设计,确保在各类设备上都能呈现专业视觉效果,帮助机构建立值得信赖的线上形象。查看源码 -
帝国cms7.5淘宝客电商品牌特价带手机站带会员模板下载为电商品牌特价展示设计的帝国CMS模板,集成PC端与移动端双平台适配。采用瀑布流商品布局,支持品牌分类聚合展示,突出特价促销视觉冲击力。查看源码 -
(PC+WAP)聚氨酯粉末涂料防腐耐用材料粘合剂网站源码下载为化工涂料企业设计的展示系统,集成产品技术参数库、颜色样板展示器和配方查询模块。支持粉末涂料、环氧树脂等多类产品分类展示查看源码 -
(PC+手机)帝国cms7.5漫画图片连载网站源码免费下载本模板基于帝国CMS7.5深度开发,为漫画阅读类网站打造。整体设计风格贴合漫画行业特性,界面布局充分考虑漫画作品的展示需求,支持多种漫画阅读模式。模板采用响应式设计,能够自动适配PC端和移动端设备,为读者提供流畅的阅读体验。查看源码 -
(自适应)响应式文章博客互联网新闻pbootcms模板下载本模板基于PbootCMS开发,专为科技新闻、互联网资讯和文章博客类网站设计。采用响应式布局技术,确保在电脑、平板和手机上都能获得最佳浏览体验。适用于科技媒体、行业博客查看源码
| 分享笔记 (共有 篇笔记) |

