(easywechat + Laravel 5.8) Organisieren Sie den gesamten Prozess der WeChat-Scancode-Zahlung auf dem PC

Beschreibung des Geschäftsszenarios:

Der Benutzer klickt auf der Website-Seite auf „Kaufen“ –> Ein QR-Code wird angezeigt –> Der Benutzer scannt den QR-Code mit WeChat --> ; Schließen Sie die Zahlung gemäß den Anweisungen von WeChat ab. --> Nach erfolgreicher Zahlung wird auf der Seite angezeigt, dass die Zahlung erfolgreich war :

1 . Übergeben Sie Parameter, fordern Sie die einheitliche Bestellschnittstelle von WeChat an und erhalten Sie den Zahlungs-QR-Code

2. Erhalten Sie Benachrichtigungen von WeChat (WeChat sendet die Zahlungsergebnisse über die Rückrufadresse in den Parametern im vorherigen Schritt)

3. Fordern Sie die WeChat-Schnittstelle an, um die Bestellung anzuzeigen. Wenn die Zahlung erfolgreich ist, springt die Seite

Die folgenden Datensätze folgen grundsätzlich den oben genannten Prozess.

Vorbereitungsarbeiten:

Installierenovertrue/laravel-wechat

composer require "overtrue/laravel-wechat:~5.0"

Konfigurationsdatei erstellen:

php artisan vendor:publish --provider="Overtrue\LaravelWeChat\ServiceProvider"

Ändern Sie die entsprechende config/wechat.php im Stammverzeichnis der Anwendung. Parameter (kopieren/fügen Sie einfach diesen Teil ein):

'payment' => [
         'default' => [
             'sandbox'            => env('WECHAT_PAYMENT_SANDBOX', false),
             'app_id'             => env('WECHAT_PAYMENT_APPID', ''),
             'mch_id'             => env('WECHAT_PAYMENT_MCH_ID', 'your-mch-id'),
             'key'                => env('WECHAT_PAYMENT_KEY', 'key-for-signature'),
             'cert_path'          => env('WECHAT_PAYMENT_CERT_PATH', 'path/to/cert/apiclient_cert.pem'),    // XXX: 绝对路径！！！！
             'key_path'           => env('WECHAT_PAYMENT_KEY_PATH', 'path/to/cert/apiclient_key.pem'),      // XXX: 绝对路径！！！！
             'notify_url'         => env('WECHAT_PAYMENT_NOTIFY_URL',''),                           // 默认支付结果通知地址
         ],
         // ...
     ],

Was konfiguriert werden muss, ist der Inhalt im Array oben, aber tatsächlich sind sie es Alle müssen in der .env-Datei konfiguriert werden:

# wechat_payment
WECHAT_PAYMENT_SANDBOX=false
# 真正需要配置的就下面这四行
WECHAT_PAYMENT_APPID=xxxxxxxxxxxxxxx // 自己的
WECHAT_PAYMENT_MCH_ID=xxxxxxx  // 自己的
WECHAT_PAYMENT_KEY=xxxxxxxxxxxxxxxxxxxx  // 自己的
WECHAT_PAYMENT_NOTIFY_URL='test.abc.com/payment/notify' // 这个地址只要是外网能够访问到项目的任何地址都可以, 不是需要在微信那里配置的那种, 现在还不知道怎么定义没关系, 后面用到的时候自然就有了
SWAGGER_VERSION=3.0

Installieren

Simple QrCode

Paket zum Generieren von QR-CodeFügen Sie Folgendes im Composer hinzu .json-Datei:

"require": {
    "simplesoftwareio/simple-qrcode": "~2"
}

Im Terminal ausführen: Composer-Update, wird später verwendet.

---------------------------------- --------------------- ----Das Obige ist die Vorbereitungsarbeit. Beginnen wir mit der Verfolgung des Prozesses ------------- -------------------------------- --

Der Benutzer klickt auf „Kaufen“

Orte eine Bestellung

--> Ein QR-Code erscheint

Hier wurde WeChat angefordert Einheitliche Bestellung

Schnittstelle.

Die Logik, mit der ich umgehe, ist:

Wenn ein Benutzer eine Kaufanfrage initiiert, wird zunächst ein Datensatz im Zahlungsprotokoll erstellt, und dann wird der Bestelldatensatz erstellt, nachdem der Benutzer die Zahlung abgeschlossen hat.

Erstellen Sie einen neuen PaymentController speziell für die Abwicklung Logik der WeChat-Zahlung (die sich vom OrderController unterscheidet) Um die Anfrage des Benutzers, auf „Kaufen“ zu klicken, verwende ich die Methode „place_order“, d. h. die Schnittstelle [Unified Order] von WeChat 🎜>Der Teil auf der Seite, der die Bestellanfrage initiiert

Html-Teil:

(Das modale Feld des QR-Codes ist gemäß der Bootstrap-Dokumentation geschrieben)

<button type="button" id="order" class="btn btn-secondary btn-block">
    扫码支付
</button>
<!-- 二维码, 随便放在当前页面的那里都可以, 因为是通过 axios 控制, 请求成功后才会弹出的 -->
<div class="modal fade" id="qrcode" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-sm" role="document">
            <div class="modal-content bg-transparent" style="border:none">
                <div class="modal-body align-items-center text-center">
                    <p class="modal-title" id="exampleModalLabel" style="color:white">微信扫码支付</p>
                    <br>
                    {{--生成的二维码会放在这里--}}
                    <div id="qrcode2"></div>
                </div>
            </div>
        </div>
    </div>

JS-Teil:

$('#order').click(function () {
    /** 请求下单接口 **/
    axios.get("/payment/place_order", {
        params: {
            id: "{{ $post->id }}"
        }
    }).then(function (response) {
        if (response.data.code == 200) {
            /** 把生成的二维码放到页面上 */
            $('#qrcode2').html(response.data.html);
            /** 弹出二维码 **/
            $('#qrcode').modal('show');
            /** 设置定时器, 即一弹出二维码就开始不断请求查看支付状态, 直到收到支付成功的返回, 再终止定时器 **/
            var timer = setInterval(function () {
                /** 在这里请求微信支付状态的接口 **/
                axios.get('/payment/paid', {
                    params: {
                    'out_trade_no':response.data.order_sn,
                    }
                }).then(function (response) {
                    if (response.data.code == 200) {
                        /** 如果支付成功, 就取消定时器, 并重新加载页面 */
                        window.clearInterval(timer);
                        window.location.reload();
                        }
                    }).catch(function (error) {
                            console.log(error);
                        });
                    }, 3000);
                }
            }).catch(function (error) {
                    console.log(error);
                });
            });

Route erstellen

Fügen Sie hier zunächst die beiden im obigen JS-Teil angeforderten Routen ein geschrieben, erklären wir das erste:

// 请求微信统一下单接口
Route::get('/payment/place_order', 'PaymentController@place_order')->name('web.payment.place_order');
// 请求微信接口, 查看订单支付状态
Route::get('/payment/paid', 'PaymentController@paid')->name('web.payment.paid');
PaymentController 里的支付逻辑
下面是具体的逻辑，用户点击支付后，先创建一条记录在 PayLog (用来记录支付的详细信息，所以这里还需要建 Paylog 的 model 和 migration, migration 的内容我附在最后了，都是微信返回的字段，基本可以直接 copy 来用的)
class PaymentController extends Controller
{
    // 请求微信接口的公用配置, 所以单独提出来
    private function payment()
    {
        $config = [
            // 必要配置, 这些都是之前在 .env 里配置好的
            'app_id' => config('wechat.payment.default.app_id'),
            'mch_id' => config('wechat.payment.default.mch_id'),
            'key'    => config('wechat.payment.default.key'),   // API 密钥
            'notify_url' => config('wechat.payment.default.notify_url'),   // 通知地址
        ];
        // 这个就是 easywechat 封装的了, 一行代码搞定, 照着写就行了
        $app = Factory::payment($config);
        return $app;
    }
    // 向微信请求统一下单接口, 创建预支付订单
    public function place_order($id)
    {
        // 因为没有先创建订单, 所以这里先生成一个随机的订单号, 存在 pay_log 里, 用来标识订单, 支付成功后再把这个订单号存到 order 表里
        $order_sn = date('ymd').substr(time(),-5).substr(microtime(),2,5);
        // 根据文章 id 查出文章价格
        $post_price = optional(Post::where('id', $id)->first())->pirce;
        // 创建 Paylog 记录
        PayLog::create([
            'appid' => config('wechat.payment.default.app_id'),
            'mch_id' => config('wechat.payment.default.mch_id'),
            'out_trade_no' => $order_sn,
            'post_id' => $id
        ]);
        $app = $this->payment();
        $total_fee = env('APP_DEBUG') ? 1 : $post_price;
        // 用 easywechat 封装的方法请求微信的统一下单接口
        $result = $app->order->unify([
            'trade_type'       => 'NATIVE', // 原生支付即扫码支付，商户根据微信支付协议格式生成的二维码，用户通过微信“扫一扫”扫描二维码后即进入付款确认界面，输入密码即完成支付。  
            'body'             => '投资平台-订单支付', // 这个就是会展示在用户手机上巨款界面的一句话, 随便写的
            'out_trade_no'     => $order_sn,
            'total_fee'        => $total_fee,
            'spbill_create_ip' => request()->ip(), // 可选，如不传该参数，SDK 将会自动获取相应 IP 地址
        ]);
        if ($result['result_code'] == 'SUCCESS') {
            // 如果请求成功, 微信会返回一个 'code_url' 用于生成二维码
            $code_url = $result['code_url'];
            return [
                'code'     => 200,
                // 订单编号, 用于在当前页面向微信服务器发起订单状态查询请求
                'order_sn' => $order_sn,
                // 生成二维码
                'html' => QrCode::size(200)->generate($code_url),
            ];
        }
    }
}

----------- Der erste Schritt bei der Interaktion mit WeChat (Anforderung einer einheitlichen Bestellschnittstelle) Abgeschlossen------ --- --

WeChats

Benachrichtigung erhalten

Routing

WeChat-Anfrage gemäß der oben genannten notify_url des Übertragungsparameters fordert meinen Server an und sendet das Zahlungsergebnis an mich, es muss also eine Post-Anfrage sein:

Route::post('/payment/notify', 'paymentController@notify');

CSRF-Überprüfung abbrechen

Allerdings der WeChat-Server initiiert Die Post-Anfrage kann die CSRF-Token-Überprüfung nicht bestehen, daher muss die Überprüfung der für WeChat verwendeten Route abgebrochen werden. In der Datei app/Http/Middleware/VerifyCsrfToken:

protected $except = [
        //
        'payment/notify'
    ];
在 PaymentController.php 文件中处理接收微信信息的逻辑
    // 接收微信支付状态的通知
    public function notify()
    {
        $app = $this->payment();
        // 用 easywechat 封装的方法接收微信的信息, 根据 $message 的内容进行处理, 之后要告知微信服务器处理好了, 否则微信会一直请求这个 url, 发送信息
        $response = $app->handlePaidNotify(function($message, $fail){
            // 首先查看 order 表, 如果 order 表有记录, 表示已经支付过了
            $order = Order::where('order_sn', $message['out_trade_no'])->first();
            if ($order) {
                return true; // 如果已经生成订单, 表示已经处理完了, 告诉微信不用再通知了
            }
            // 查看支付日志
            $payLog = PayLog::where('out_trade_no', $message['out_trade_no'])->first();
            if (!$payLog || $payLog->paid_at) { // 如果订单不存在 或者 订单已经支付过了
                return true; // 告诉微信，我已经处理完了，订单没找到，别再通知我了
            }
            // return_code 表示通信状态，不代表支付状态
            if ($message['return_code'] === 'SUCCESS') {
                // 用户是否支付成功
                if ($message['result_code'] === 'SUCCESS') {
                    // 更新支付时间为当前时间
                    $payLog->paid_at = now();
                    $post_id = $payLog->post_id;
                    // 联表查询 post 的相关信息
                    $post_title = $payLog->post->title;
                    $post_price = $payLog->post->price;
                    $post_original_price = $payLog->post->original_price;
                    $post_cover = $payLog->post->post_cover;
                    $post_description = $payLog->post->description;
                    $user_id = $payLog->post->user_id;
                    // 创建订单记录
                    Order::create([
                        'order_sn' => $message['out_trade_no'],
                        'total_fee' => $message['total_fee'],
                        'pay_log_id' => $payLog->id,
                        'status' => 1,
                        'user_id' => $user_id,
                        'paid_at' => $payLog->paid_at,
                        'post_id' => $post_id,
                        'post_title' => $post_title,
                        'post_price' => $post_price,
                        'post_original_price' => $post_original_price,
                        'post_cover' => $post_cover,
                        'post_description' => $post_description,
                    ]);
                    // 更新 PayLog, 这里的字段都是根据微信支付结果通知的字段设置的(https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=9_7&index=8)
                    PayLog::where('out_trade_no', $message['out_trade_no'])->update([
                        'appid' => $message['appid'],
                        'bank_type' => $message['bank_type'],
                        'total_fee' => $message['total_fee'],
                        'trade_type' => $message['trade_type'],
                        'is_subscribe' => $message['is_subscribe'],
                        'mch_id' => $message['mch_id'],
                        'nonce_str' => $message['nonce_str'],
                        'openid' => $message['openid'],
                        'sign' => $message['sign'],
                        'cash_fee' => $message['cash_fee'],
                        'fee_type' => $message['fee_type'],
                        'transaction_id' => $message['transaction_id'],
                        'time_end' => $payLog->paid_at,
                        'result_code' => $message['result_code'],
                        'return_code' => $message['return_code'],
                    ]);
                }
            } else {
                // 如果支付失败, 也更新 PayLog, 跟上面一样, 就是多了 error 信息
                PayLog::where('out_trade_no', $message['out_trade_no'])->update([
                    'appid' => $message['appid'],
                    'bank_type' => $message['bank_type'],
                    'total_fee' => $message['total_fee'],
                    'trade_type' => $message['trade_type'],
                    'is_subscribe' => $message['is_subscribe'],
                    'mch_id' => $message['mch_id'],
                    'nonce_str' => $message['nonce_str'],
                    'openid' => $message['openid'],
                    'sign' => $message['sign'],
                    'cash_fee' => $message['cash_fee'],
                    'fee_type' => $message['fee_type'],
                    'transaction_id' => $message['transaction_id'],
                    'time_end' => $payLog->paid_at,
                    'result_code' => $message['result_code'],
                    'return_code' => $message['return_code'],
                    'err_code' => $message['err_code'],
                    'err_code_des' => $message['err_code_des'],
                ]);
                return $fail('通信失败，请稍后再通知我');
            }
            return true; // 返回处理完成
        });
        // 这里是必须这样返回的, 会发送给微信服务器处理结果
        return $response;
    }

Das Obige ist eine gemeinsame Abfrage unter Verwendung der pay_logs Tabelle und die Posts-Tabelle können mehrere pay_logs haben, es handelt sich also um eine Eins-zu-viele-Beziehung. Legen Sie sie in PayLog.php fest:

public function post()
{
    return $this->belongsTo(Post::class);
}

------------ --- Mit WeChat interagieren Der zweite Schritt (Empfangen von Informationen), abgeschlossen --------------

WeChat anfordern

Bestellung anzeigen

Schnittstelle

Fordern Sie WeChat auf, die Bestellstatusschnittstelle anzuzeigen. Die Weiterleitung wurde im ersten Schritt der Interaktion geschrieben

public function paid(Request $request)
    {
        $out_trade_no = $request->get('out_trade_no');
        $app = $this->payment();
        // 用 easywechat 封装的方法请求微信
        $result = $app->order->queryByOutTradeNumber($out_trade_no);
        if ($result['trade_state'] === 'SUCCESS') 
            return [
                'code' => 200,
                'msg' => 'paid'
            ];
        }else{
            return [
                'code' => 202,
                'msg' => 'not paid'
            ];
        }
    }

--------------- -Der dritte Schritt der Interaktion mit WeChat (Bestellstatus prüfen) wurde abgeschlossen--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------) Bei den Feldern in dieser Tabelle handelt es sich im Wesentlichen um WeChat-Zahlungen. Die Felder für die Ergebnisbenachrichtigung sind unten angehängt, damit sie beim nächsten Mal einfacher verwendet werden können:

public function up()
    {
        Schema::create('pay_logs', function (Blueprint $table) {
            $table->bigIncrements('id');
            // 根据自身业务设计的字段
            $table->integer('post_id')->default(0)->comment('文章id');
            // 以下均是微信支付结果通知接口返回的字段
            $table->string('appid', 255)->default('')->comment('微信分配的公众账号ID');
            $table->string('mch_id', 255)->default('')->comment('微信支付分配的商户号');
            $table->string('bank_type', 16)->default('')->comment('付款银行');
            $table->integer('cash_fee')->default(0)->comment('现金支付金额');
            $table->string('fee_type', 8)->default('')->comment('货币种类');
            $table->string('is_subscribe', 1)->default('')->comment('是否关注公众账号');
            $table->string('nonce_str', 32)->default('')->comment('随机字符串');
            $table->string('openid', 128)->default('')->comment('用户标识');
            $table->string('out_trade_no', 32)->default('')->comment('商户系统内部订单号');
            $table->string('result_code', 16)->default('')->comment('业务结果');
            $table->string('return_code', 16)->default('')->comment('通信标识');
            $table->string('sign', 32)->default('')->comment('签名');
            $table->string('prepay_id', 64)->default('')->comment('微信生成的预支付回话标识，用于后续接口调用中使用，该值有效期为2小时');
            $table->dateTime('time_end')->nullable()->comment('支付完成时间');
            $table->integer('total_fee')->default(0)->comment('订单金额');
            $table->string('trade_type', 16)->default('')->comment('交易类型');
            $table->string('transaction_id', 32)->default('')->comment('微信支付订单号');
            $table->string('err_code', 32)->default('')->comment('错误代码');
            $table->string('err_code_des', 128)->default('')->comment('错误代码描述');
            $table->string('device_info', 32)->default('')->comment('设备号');
            $table->text('attach')->nullable()->comment('商家数据包');
            $table->nullableTimestamps();
        });
    }

Das Obige ist eine Aufzeichnung des gesamten Prozesses von der Seite über die Bestellung und die Zahlung bis zum Seitensprung. Abgesehen davon, dass ich vor langer Zeit einmal dem Laravel-China-Tutorial gefolgt bin, ist dies das erste Mal, dass ich es wirklich selbst erforscht und es nach meinen eigenen Bedürfnissen erstellt habe. Es gibt viele Artikel und Tutorials, die im Internet geteilt werden, aber sie sind alle auf Master-Niveau und viele Orte werden auf einen Schlag erwähnt. Für einen Junior wie mich fühlt es sich an einer Stelle wie ein Hammer und an der anderen wie ein Hammer an. Es ist schwierig, den Notizen zu folgen. Ich hoffe, dass sie für Anfänger wie mich hilfreich sind. Es sieht sehr lang aus, aber es erfordert wirklich so viel Inhalt, zumindest auf meinem aktuellen Niveau

Das obige ist der detaillierte Inhalt von(easywechat + Laravel 5.8) Organisieren Sie den gesamten Prozess der WeChat-Scancode-Zahlung auf dem PC. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!