README

安装

Laravel Authentication Log 需要 Laravel 5.5 或更高版本，以及 PHP 7.0+。

您可以使用 Composer 将 Laravel Authentication Log 安装到您的 Laravel 项目中

composer require outgive/laravel-authentication-otp

配置

安装 Laravel Authentication Log 后，使用 Artisan 命令 vendor:publish 发布其配置、迁移和视图

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

接下来，您需要迁移您的数据库。Laravel Authentication Log 迁移将创建您的应用程序存储身份验证日志所需的表

php artisan migrate

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

namespace App\Http\Controllers\Auth;

use Outgive\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 Authentication OTP 贡献。

许可协议

Laravel Authentication Log 是开源软件，受 MIT 许可协议 许可。