1、開始之前,請一定仔細閱讀微信開發者文檔文檔中,總共寫了幾個步驟:
- 1、通過appId和需要跳轉的路由去請求授權
- 2、授權之後跳轉路由中返回的code 注:前端只需要知道這兩個步驟
- 3、根據code獲取access_token
- 4、根據access_token獲取用戶信息(snsapi_userinfo授權)
2、前端發起授權請求。這一步需要前端拼湊路由,並且將頁面跳轉到拼湊路由,路由規則如:https://open.weixin.qq.com/connect/oauth2/authorize?appid=你的公眾appId號&redirect_uri=你的回調路由&response_type=code&scope=你選擇的方式&state=STATE#wechat_redirect
注 授權方式可選擇為snsapi_userinfo或者snsapi_base,差別請看文檔
跳轉之後授權頁面如下(開發者工具效果)
3、點擊同意之後,會根據你之前拼湊的回調路由返回code,如下:
http://test.***.com/index?code=021Azdiu12zdXd05kkju1ZYkiu1AzdiR&state=1
4、將路由中的code直接傳遞給後端,讓後端做獲取用戶信息的系列的邏輯處理。
注:如下是laravel中間件中處理方式,session只用於這次請求,也可以將用戶的微信信息放在request中到controller進行邏輯處理,看個人喜好
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
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);
}
注:這個例子只是寫了授權的邏輯,token相關驗證我已經做了剔除
坑點:
1、vue的路由會將code拼接在url和#之間,如www.****.com/?code=XXXXX/#/index,這個code需要單獨處理
以上就是laravel前後端分離獲取微信授權,結合laravel-wechat的詳細內容,更多請關注其它相關文章!
-
更多技巧請《轉發 + 關注》哦!
閱讀更多 科技i關注 的文章