Laravel はフロントエンドとバックエンドを分離して WeChat 認証を取得し、laravel-wechat と組み合わせます

1. 始める前に、WeChat 開発者向けドキュメント をよくお読みください。このドキュメントには、合計でいくつかの手順があります:

• 1. appId とリダイレクトが必要なルートを介して承認をリクエストします。
• 2. 承認後にジャンプ ルートで返されるコード 注: フロントエンドで必要なのは、これら 2 つの手順を理解してください
• 3. コードに基づいて access_token を取得します
##4. access_token に基づいてユーザー情報を取得します (snsapi_userinfo 認可)

2.フロントエンドが認可リクエストを開始します。このステップでは、フロントエンドがルートをつなぎ合わせ、ページをつなぎ合わせたルートにジャンプする必要があります。ルーティング ルールは次のとおりです:

https://open.weixin.qq.com/connect/oauth2/authorize ?appid=パブリック アプリ ID 番号&redirect_uri= コールバック ルート&response_type=code&scope=選択したメソッド&state=STATE#wechat_redirect
Note 認証メソッドは snsapi_userinfo または snsapi_base です。詳細についてはドキュメントを参照してください。違いジャンプ後の認可 ページは次のとおりです (開発者ツールの影響)

3. [同意する] をクリックすると、コードに基づいてコードが返されます。次のように、前にまとめたコールバック ルート:

http://test.***.com/index?code=021Azdiu12zdXd05kkju1ZYkiu1AzdiR&state=1

4.パスルート内のコードをバックエンドに直接送信し、バックエンドに一連のユーザー情報のフェッチ論理処理を実行させます。
注: 次は、laravel ミドルウェアでの処理メソッドです。セッションは、このリクエストにのみ使用されます。リクエストにユーザーの WeChat 情報を含めて、論理処理のためにコントローラーに送信することもできます、個人の好みに応じて

  public function handle($request, Closure $next, $scopes = null)
  {
         $wechatCacheKey = 'wechat.oauth_user.default';
            if (config("qa.mock_user") == 1){
                $user = new SocialiteUser(config('wechat.mock_user'));
            } else {
                $code = $request->get("code", "");
                if ($code === ""){
                    $appId = $this->config["app_id"];
                    return Response::toJson(["aid" => $appId], "请重新获取授权CODE！",10006);
                }
                // 开始拉取用户信息
                $app = Factory::officialAccount($this->config);
                $user = $app->oauth->user();
            }
            session([$wechatCacheKey => $user]);
        }
        return $next($request);
  }

注: この例では承認ロジックのみを記述します。

落とし穴を排除するためにトークン関連の検証を実行しました:

1. Vue ルーティングコードは、www.****.com/?code=XXXXX/#/index のように、URL と # の間に接続されます。このコードは処理する必要があります。別々に＃＃＃

以上がLaravel はフロントエンドとバックエンドを分離して WeChat 認証を取得し、laravel-wechat と組み合わせますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。