[ Laravel ] email 인증을 통한 회원가입.

Gmail을 이용해서 사용하는 경우! 

우선 Google의 계정 설정을 만져줘야할 필요성이 있다. 

 

<참고>

m.blog.naver.com/wecissoid/221387867680

구글 메일(gmail) 연동 설정방법

 

Laravel .env파일 설정

MAIL_MAILER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=아이디
MAIL_PASSWORD=비번
MAIL_ENCRYPTION=tls
MAIL_FROM_ADDRESS=null
MAIL_FROM_NAME="${APP_NAME}"

.env 파일 설정까지 해주면, Gmail을 이용할 준비는 끝났다.

 

 

Laravel의 로그인 관련 기능을 사용하기 위해서는 composer을 이용해서 설치해야하는 것이 있다.

composer require laravel/ui

php artisan ui vue --auth

 

database

public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->string('email')->unique();
            $table->timestamp('email_verified_at')->nullable();
            $table->string('password');
            $table->string('verification_code')->nullable();
            $table->integer('is_verified')->default(0);
            $table->rememberToken();
            $table->timestamps();
        });
    }

인증코드로 사용할 verification_code와 현재 회원이 email인증을 했는지 안했는지 확인하기 위한 is_verified 필드를 추가

 

 

App/Http/Controllers/RegisterController

public function register(Request $request)
    {
        $user = new User();
        $user->name = $request->name;
        $user->email = $request->email;
        $user->password = Hash::make($request->password);
        $user->verification_code = sha1(time());    
        $user->save();        

        if($user != null){
            //Send Email
            MailController::sendSignupEmail($user -> name, $user->email, $user->verification_code);
            //Show a message
            return redirect()->back()->with(session()->flash('alert-success', 'Your account has been created. Please check email for verification link.'));
        }

        return redirect()->back()->with(session()->flash('alert-danger', 'Something went wrong!'));

        //Show error message
    }

User instance를 생성해서, User 테이블에 저장하는 과정이다. 

sha1()는??
sha1 () 함수는 문자열의 SHA-1 해시를 계산합니다.
sha1 () 함수는 US Secure Hash Algorithm 1을 사용합니다.
RFC 3174-미국 보안 해시 알고리즘 1 : "SHA-1은 메시지 다이제스트라고하는 160 비트 출력을 생성합니다. 
그런 다음 메시지 다이제스트를 메시지에 대한 서명을 생성하거나 확인하는 서명 알고리즘에 입력 할 수 
있습니다. 메시지가 아닌 메시지 다이제스트에 서명하면 대개 메시지 다이제스트의 크기가 메시지보다 
훨씬 작기 때문에 프로세스의 효율성이 향상됩니다. 생성자가 사용한 것과 동일한 해시 알고리즘을 디지털 
서명의 검증자가 사용해야합니다.

App/Http/Controllers/MailController

class MailController extends Controller
{
    public static function sendSignupEmail($name, $email, $verification_code){
        $data = [
            'name' => $name,
            'verification_code' => $verification_code
        ];
        Mail::to($email)->send(new SignupEmail($data));
    }
}

 

메일을 발송하기 위해서는 Mail 파사드에서 to 메소드를 사용하면 됩니다. to 메소드는 이메일 주소, 하나의 사용자 인스턴스, 그리고 사용자들의 컬렉션을 전달 받습니다. 하나의 객체나 객체들의 컬렉션이 전달된다면 메일러는 자동으로 이것들의 email 과 name 속성을 이메일 수신자로 설정할 것입니다. 따라서 객체에서 이 속성들이 사용가능한지 확인해야 합니다. 수신자들을 지정하고 나면, mailable 클래스의 인스턴스를 send 메소드에 전달합니다:

 

App/Mail/SignupEmail

public function build()
    {
        return $this->from(env('MAIL_USERNAME'), 'GameMatching')->subject("Welcome to GameMatching!")
        ->view('mail.signup-email', ['email_data' => $this->email_data]);
    }

from -> 보내는 사람 주소 

subject -> 메일 제목

view -> mail 디렉토리에 signup-email.blade.php을 view 시켜줌 + email_data 변수를 같이 보내줌 

 

resources/mail/signup-email.blade.php

Hello {{ $email_data['name'] }}
<br><br>
Welcome to GameMatching!
<br>
Please click the below link to verify your email end activate your account!
<br><br>
<a href="http://127.0.0.1:8000/verify?code={{ $email_data['verification_code'] }}">Click Here!</a>

<br><br>
Thank you!
<br>
 GameMatching

메일에 본문에 해당하는 blade 파일이다. 

SugnupEmail에서 email_data변수를 같이 보내줬기 때문에 name과 verification_code 값을 이용할 수 있다. 

 

링크를 클릭했을 경우, /verify 파싱을하고 code 값을 get방식으로 보냄

 

web.php

Route::get('/verify', [RegisterController::class, 'verifyUser'])->name('verify.user');

/verify가 파싱되었을 경우에는 RegisterController 클래스의 verifyUser 메소드를 사용한다.

 

App/Http/Controller/Auth/RegisterController.php

public function verifyUser(Request $request){
        $verification_code = \Illuminate\Support\Facades\Request::get('code');
        $user = User::where(['verification_code' => $verification_code])->first();
        if($user != null){
            $user->is_verified = 1;
            $user->save();
            return redirect()->route('login')->with(session()->flash('alert-success', 'Your account is verified. Please login'));
        }

        return redirect()->route('login')->with(session()->flash('alert-danger', 'Invalid verification code!'));
    }

$request 에는 code라는 이름으로 verification_code 값이 들어있기 때문에 

get('code')로 값을 가져와서 변수에 저장했고. 

 

DB의 User 테이블에서 verification_code 필드의 값이 request로 받아온 verification_code의 값과 일치하면, 그 user 데이터를 가져와서 $user에 저장

 

$user가 존재한 경우에는,

mail 인증을 했는지 안했는지 확인하기 위해서 만들어둔 필드 is_verified의 값을 1로 바꿔줌으로써 인증이 되었다고 표시한다. 

그리고 그값을 $user->save()로 업데이트

 

그리고 redirect를 통해서 login화면으로 보내주는데 session의 flash 메소드를 이용해서 메세지를 전달한다. 

 

flash()
때로는 바로 다음번의 요청에서만 사용하기 위해서 세션에 아이템을 저장할 수 있습니다. 
바로 flash 메소드를 사용하는 것입니다. 이 메소드를 사용하여 세션에 저장된 데이터는 바로 
이어지는 HTTP 요청에 대해서만 사용이 가능하고, 이후에는 삭제됩니다. 임시 데이터는 주로 
상태 메세지등 잠깐동안 사용하데 유용합니다:

 

resources/auth/register.blade.php

<div class="flash-message">
	@foreach (['danger', 'warning', 'success', 'info'] as $msg)
		@if (Session::has('alert-' . $msg))
			{{-- <p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}<a href="#" class="close" data-dismiss="alert" aria-label="close">times;</a></p> --}}
			<p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}<span class="float-right"><a href="https://mail.google.com/" class="Google">Google</a>
			Or <a href="https://mail.naver.com/" class="Naver">Naver</a></span></p>
		@endif
	@endforeach
</div>

RegisterController에서 Session의 flash 메소드로 보냈던 메세지를 받아서 메세지의 내용을 보여준다.

링크를 통해서 Google 또는 Naver의 메일 페이지로 바로갈 수 있도록 했다.

<div class="flash-message">
	@foreach (['danger', 'warning', 'success', 'info'] as $msg)
		@if (Session::has('alert-' . $msg))
			<p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}<a href="#" class="close" data-dismiss="alert" aria-label="close">close</a></p>
		@endif
	@endforeach
</div>

RegisterController에서 Session의 flash 메소드로 보냈던 메세지를 받아서 메세지의 내용을 보여준다.

 

 

App/Http/Controllers/Auth/LoginController.php

public function credentials(Request $request)
    {
        return array_merge($request->only($this->username(), 'password'), ['is_verified' => 1]); 
    }

로그인할 때 자격을 검증한다. 

이름, password가 일치하는지, 그리고 검증을 했는지 안했는지 (is_verified필드가 1이면 검증 o , 0이면 검증x)

자격이 있는 경우, 만족한 경우에만 로그인이 가능하다.

 

---

실제 구현 스크린샷

 

정보를 모두 입력하고 회원가입 버튼을 누르게되면, 상단에 계정을 만들었고 email로가서 인증을 해달라는 문구가 나온다.

 

메일에 가보게되면 메일이 도착해있는 것을 확인할 수 있다.

Click Here 링크를 클릭하게 되면, 

 

로그인 화면으로 이동이되고, 상단에 인증이 완료되었으니 로그인 하라는 문구가 나온다.

 

 

다시 이메일과 패스워드를 입력하게 되면, 제대로 된 로그인이 되게 된다.

 

 

만약에 인증을 하지않고, 로그인을 할려고 하면???

인증이 안된 아이디로 로그인하게 되면 credentials 문제가 있기 때문에 에러 메세지가 나오게된다. !! 

 

끝!!!