Laravel 微信小程序后端实现用户登录的示例代码

接上篇微信小程序后端搭建:分享:Laravel 微信小程序后端搭建

后端搭建好后第一件事就是用户登录认证,简单实现小程序登录" title="微信小程序登录">微信小程序登录认证

1.user 模型

use Laravel\Passport\HasApiTokens; 新增

use HasApiTokens, Notifiable;

protected $fillable = [

'id',

'name',

'email',

'email_verified_at',

'username',

'phone',

'avatar',//我用来把微信头像的/0清晰图片,存到又拍云上

'weapp_openid',

'nickname',

'weapp_avatar',

'country',

'province',

'city',

'language',

'location',

'gender',

'level',//用户等级

'is_admin',//is管理员

];

2. 新增一条路由

//前端小程序拿到的地址:https://域名/api/v1/自己写的接口

Route::group(['prefix' => '/v1'], function () {

Route::post('/user/login', 'UserController@weappLogin');

});

3. 在 UserController 控制器里新建 function weappLogin (),别忘了 use 这些

use App\User;

use Carbon\Carbon;

use Illuminate\Http\Request;

use Illuminate\Support\Facades\Storage;

写两个 function weappLogin (),avatarUpyun ()

public function weappLogin(Request $request)

{

$code = $request->code;

// 根据 code 获取微信 openid 和 session_key

$miniProgram = \EasyWeChat::miniProgram();

$data = $miniProgram->auth->session($code);

if (isset($data['errcode'])) {

return $this->response->errorUnauthorized('code已过期或不正确');

}

$weappOpenid = $data['openid'];

$weixinSessionKey = $data['session_key'];

$nickname = $request->nickname;

$avatar = str_replace('/132', '/0', $request->avatar);//拿到分辨率高点的头像

$country = $request->country?$request->country:'';

$province = $request->province?$request->province:'';

$city = $request->city?$request->city:'';

$gender = $request->gender == '1' ? '1' : '2';//没传过性别的就默认女的吧,体验好些

$language = $request->language?$request->language:'';

//找到 openid 对应的用户

$user = User::where('weapp_openid', $weappOpenid)->first();

//没有,就注册一个用户

if (!$user) {

$user = User::create([

'weapp_openid' => $weappOpenid,

'weapp_session_key' => $weixinSessionKey,

'password' => $weixinSessionKey,

'avatar' => $request->avatar?$this->avatarUpyun($avatar):'',

'weapp_avatar' => $avatar,

'nickname' => $nickname,

'country' => $country,

'province' => $province,

'city' => $city,

'gender' => $gender,

'language' => $language,

]);

}

//如果注册过的,就更新下下面的信息

$attributes['updated_at'] = now();

$attributes['weixin_session_key'] = $weixinSessionKey;

$attributes['weapp_avatar'] = $avatar;

if ($nickname) {

$attributes['nickname'] = $nickname;

}

if ($request->gender) {

$attributes['gender'] = $gender;

}

// 更新用户数据

$user->update($attributes);

// 直接创建token并设置有效期

$createToken = $user->createToken($user->weapp_openid);

$createToken->token->expires_at = Carbon::now()->addDays(30);

$createToken->token->save();

$token = $createToken->accessToken;

return response()->json([

'access_token' => $token,

'token_type' => "Bearer",

'expires_in' => Carbon::now()->addDays(30),

'data' => $user,

], 200);

}

//我保存到又拍云了,版权归腾讯所有。。。头条闹的

private function avatarUpyun($avatar)

{

$avatarfile = file_get_contents($avatar);

$filename = 'avatars/' . uniqid() . '.png';//微信的头像链接我也不知道怎么获取后缀,直接保存成png的了

Storage::disk('upyun')->write($filename, $avatarfile);

$wexinavatar = config('filesystems.disks.upyun.protocol') . '://' . config('filesystems.disks.upyun.domain') . '/' . $filename;

return $wexinavatar;//返回链接地址

}

微信的头像 / 0

小头像默认 / 132

4. 后端上面就写好了,再看下小程序端怎么做的哈,打开小程序的 app.json,添加 "pages/auth/auth",

{

"pages": [

"pages/index/index",

"pages/auth/auth",//做一个登录页面

"pages/logs/logs"

],

"window": {

"backgroundTextStyle": "light",

"navigationBarBackgroundColor": "#fff",

"navigationBarTitleText": "WeChat",

"navigationBarTextStyle": "black"

},

"sitemapLocation": "sitemap.json",

"permission": {

"scope.userLocation": {

"desc": "你的位置信息将用于小程序位置接口的效果展示"

}

}

}

5. 打开 auth.js

const app = getApp();

Page({

/**

* 页面的初始数据

*/

data: {

UserData: [],

isClick: false,

},

/**

* 生命周期函数--监听页面加载

*/

onLoad: function(options) {

},

login: function(e) {

let that=this

that.setData({

isClick: true

})

wx.getUserInfo({

lang: "zh_CN",

success: response => {

wx.login({

success: res => {

let data = {

code:res.code,

nickname: response.userInfo.nickName,

avatar: response.userInfo.avatarUrl,

country: response.userInfo.country ? response.userInfo.country : '',

province: response.userInfo.province ? response.userInfo.province : '',

city: response.userInfo.city ? response.userInfo.city : '',

gender: response.userInfo.gender ? response.userInfo.gender : '',

language: response.userInfo.language ? response.userInfo.language : '',

}

console.log(data)

app.globalData.userInfo = data;

wx.request({

url: '你的后端地址',//我用的valet,http://ak.name/api/v1/user/login

method: 'POST',

data: data,

header: {

'Content-Type': 'application/x-www-form-urlencoded'

},

success: function (res) {

console.log(res)

if (res.statusCode != '200') {

return false;

}

wx.setStorageSync('access_token', res.data.access_token)

wx.setStorageSync('UserData', res.data.data ? res.data.data : '')

wx.redirectTo({

url: '/pages/index/index',

})

},

fail: function (e) {

wx.showToast({

title: '服务器错误',

duration: 2000

});

that.setData({

isClick: false

})

},

});

}

})

},

fail: function (e) {

that.setData({

isClick: false

})

},

})

}

})

6. 打开 auth.wxml

<view class='padding-xl'>

<button class='cu-btn margin-top bg-green shadow lg block' open-type="getUserInfo" bindgetuserinfo="login" disabled="{{isClick}}" type='success'>

<text wx:if="{{isClick}}" class='cuIcon-loading2 iconfont-spin'></text> 微信登录</button>

</view>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

以上是 Laravel 微信小程序后端实现用户登录的示例代码 的全部内容, 来源链接: utcz.com/p/223917.html

回到顶部