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

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

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

1.user 模型

use Laravel\Passport\HasApiTokens; 新增

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

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. 新增一条路由

?

1 2 3 4

//前端小程序拿到的地址：https://域名/api/v1/自己写的接口 Route::group([ 'prefix' => '/v1' ], function () {    Route::post( '/user/login' , 'UserController@weappLogin' ); });

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

?

1 2 3 4

use App\User; use Carbon\Carbon; use Illuminate\Http\Request; use Illuminate\Support\Facades\Storage;

写两个 function weappLogin (),avatarUpyun ()

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72

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",

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

{   "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

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77

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

?

1 2 3 4

< 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 >

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

原文链接：https://learnku.com/weapp/t/28680