jslmariano/basic-authentication-otp

通过 nexmo 发送短信的 Laravel OTP 代码功能

1.0.0 2020-09-24 07:55 UTC

This package is not auto-updated.

Last update: 2024-09-21 02:46:30 UTC


README

Total Downloads GitHub license

安装

Laravel 认证日志需要 Laravel 5.5 或更高版本,以及 PHP 7.0+。

您可以使用 Composer 将 Laravel 认证日志安装到您的 Laravel 项目中

composer require jslmariano/basic-authentication-otp

配置

安装 Laravel 认证日志后,使用 vendor:publish Artisan 命令发布其配置、迁移和视图

php artisan vendor:publish --provider="Jslmariano\AuthenticationOtp\Providers\OtpServiceProvider"

接下来,您需要迁移您的数据库。Laravel 认证日志迁移将创建应用程序存储认证日志所需表

php artisan migrate

然后,将 Services\Auth\OTP 集成到您的用户登录路由中(默认为 App\Http\Controllers\Auth\AuthController 控制器,但请参考您的路由以找到您的登录控制器)。此服务提供了一种阻止认证过程并确保首先验证 OTP 代码的方法。您应该在创建会话或身份验证令牌之前将其包含在登录逻辑中。

namespace App\Http\Controllers\Auth;

use Jslmariano\AuthenticationOtp\Services\Auth\OTP as OTPService;

class AuthController extends Controller
{
    ...
    
    public function login(Request $request)
    {
        ...
        
        /**
         * OTP FEATURE
         */
        $otp_service = new OTPService();
        if ($otp_service->resolveUser($credentials)->isUserNeedsOTP($request)) {
            $otp_service->processOtp($request);
            return $otp_service->getResponse();
        }
        /**
         * OTP FEATURE END
         * This is to avoid generation of token
         */
    
        ...
        /* Should be before this code below  */
        /* Code below may vary depending on how you authenticate your users  */
        
        if (!$token = JWTAuth::attempt($credentials)) {
            return response([
                'status' => 'error',
                'error' => 'invalid.credentials',
                'msg' => 'Invalid Credentials.',
            ], 400);
        }

        Auth::loginUsingId(Auth::User()->id);
    
    ...
}

对于 vuejs 前端,您首先需要安装 @bachdgvn/vue-otp-input

npm install --save @bachdgvn/vue-otp-input

最后,将 OTP 弹出窗口作为 vue 组件添加到您的 vue 登录中。(代码也可能根据您在前端处理用户登录的方式而有所不同)

<template>
   <container>
   
       ...
       
       <v-text-field v-model="email"></v-text-field>
       <v-text-field v-model="password"></v-text-field>
       
       <!--  Handle on login button click method -->
       <v-btn type="submit" @click="otp_check()">
            Log In
       </v-btn>
       
       ...
       
   </container>
    <auth-login-otp
      :password.sync="password"
      :email.sync="email"
      ref="authLoginOtp"
      @on-check-error="onOtpCheckError"
      @on-verify-error="onOtpVerifyError"
      @on-verified="onOtpVerified"
      @on-resend-error="onOtpResendError"
      @on-resend="onOtpResend"
    />
  </v-content>
</template>

<script>
import AuthOtpInput from '../../components/auth/login/otp.vue';

export default {
  components: {
    'auth-login-otp' : AuthOtpInput,
  },

  ...
  
  methods: {
    otp_check() {
      this.$validator.validate().then(result => {
        if (!result) {
          return false;
        }
        this.$refs.authLoginOtp.check();
      });
    },
    ...
}

...
</script>

贡献

感谢您考虑为 Laravel 认证 OTP 做出贡献。

许可

Laravel 认证日志是开源软件,许可协议为 MIT 许可