WeChat 支払いを呼び出すために、WeChat では WeChat で WeChat 支払いを呼び出す機能を実装するのに役立つ JS SDK を提供しています。具体的な実装手順は次のとおりです。
最初の手順は、WeChat 支払いの実装に必要なパッケージをインストールすることです。
当社では、引き続き Omnipay Wechat Pay パッケージを使用して支援しています。 WeChat Payment の実装は、使用されるインターフェイスが異なることを除いて、実際には以前のネイティブ スキャン コード支払い方法と似ています。以下は私が開発した WeChat Web サイトで使用されているライブラリです。言うまでもなく、最初の 2 つは明らかに WeChat 支払いに使用される Omnipay ライブラリです。WordPress Dispatcher はカスタム URL の実装に使用される WordPress Router システムです。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' );
フロントエンド実装: WeChat JS SDK の構成と WeChat 支払いの実装
ここでの jssdk.php は WeChat 公式によって提供され、WeChat JS SDK の初期化に使用されます。署名パッケージをご利用いただけます。 WeChat 決済を実装する必要があるページにこのファイルを導入し、JSSDK クラスを初期化します。
require_once( get_template_directory() . '/inc/jssdk.php' ); $jssdk = new JSSDK( "xxxxx", "xxxxxxxxxxxxxxxx" ); $signPackage = $jssdk->GetSignPackage();
WeChat JS SDK を初期化し、WeChat 支払いメソッドを呼び出して WeChat 支払いを実装します
まず、WeChat JS SDK の JavaScript ファイルが先頭にあることを確認します。ページ: jweixin-1.0 .0.js。上記で取得した $signPackage に基づいて、以下のコードで次の操作を完了しました。
wx.config を使用して js sdk を初期化し、wx.ready を使用して js sdk が正常に初期化されたかどうかを検出します。初期化が成功すると、WeChat js sdk が提供するインターフェースを使用して動作できます。支払いボタンをクリックすると、WeChat 注文を取得するために Ajax リクエストがサーバーに送信され、その後、wx.chooseWXPay を使用して WeChat 支払いが開始されます。これは、WeChat パスワードを入力するために WeChat で表示されるポップアップ インターフェイスです。
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; }); });});
次の状況で支払いウィンドウが点滅したり消えたりします
WeChat で WeChat 支払いをテストすると、WeChat 支払いウィンドウが点滅したり消えたりすることがよくあります。支払いパスワードを入力する画面をご覧ください。以下の理由が考えられますので、よくご確認ください。
jssdk が設定されていません。上記コードの wx.config および wx.readyAjax によって返されるデータが間違っていることを確認してください。Ajax リクエストの返されるデータのセキュリティ ドメイン名の設定が間違っていることを確認してください。テスト ドメイン名が WeChat 管理バックグラウンドで設定されているかどうか 安全なドメイン名に追加されました
バックエンドの実装: 注文データの検証と送信
バックエンドの実装:最終的な実装は非常に簡単で、上記の Ajax によって送信されたデータを受信し、WeChat を処理します。支払いに必要な 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://www.wpzhiku.com/order/return' ); $response = $gateway->purchase( $order )->send(); $wechat_return = $response->getJsOrderData(); wp_send_json( $wechat_return ); },] );
WeChat 支払い成功通知を受け入れて注文を自動的に完了するか、自動的にリチャージしてください
支払いが完了すると、WeChat は指定した通知 URL に支払い成功通知を返します。コンテンツでは、注文を自動的に完了したり、自動的にチャージしたりするなどの操作を実行します。ここで注意すべき点が 2 つあります。
通知 URL はアクセス可能である必要があります。アクセスできない場合、WeChat は通知を送信しません。支払い URL と同じディレクトリにある必要があります。
WeChat 公式が提供する SDK とインターフェース データは非常に非標準的なものです。使用するときは、コード内の大文字と小文字に注意する必要があります。ドキュメントによると、使用する言語または開発フレームワークが WeChat 開発に使用するライブラリを提供している場合は、これらのライブラリを直接開発に使用することをお勧めします。 WeChat が大小さまざまな穴を掘ってくれたので、デバッグの難易度が下がり、開発がスピードアップしました。
WordPress 関連の技術記事をさらに詳しく知りたい場合は、wordpress チュートリアル 列にアクセスして学習してください。
以上がWordPress で WeChat 決済を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。