Lời dẫn
Khi sử dụng Laravel như một API Restful, việc cấu hình để xác thực với JWT (Json Web Token) là ko thể thiếu.
Mặc định Laravel có hai thư viện là Passport và Sanctum. Trong khi Sanctum ly trà nhài – thanh nhã; thì Passport đích thị là một ly trà sữa full topping.
Điều thuận lợi là Passport được xây dụng theo chuẩn OAuth2, nên danh sách các route, response đều được chuẩn hóa.
Vấn đề
Tuy nhiên, nếu ai đã từng đọc documents của Passport tại đây, thì ít nhiều sẽ bối rối, bởi thư viện này có khác nhiều cách sử dụng – để lấy được mã access_token, refresh_token.
Làm rõ
Ở bài viết đầu tiên của loạt bài “Laravel Passport” này, tôi sẽ đề cập tới cách lấy các token bằng “Issuing Access Tokens”.
No.1/ Sau khi đã cài đặt Passport, chạy migrate. Ta cần chạy lệnh `php artisan passport:client` để tạo client.
No.2/ Bây giờ ta đã có các thông tin cơ bản sau: clientId, clientSecret, redirectUri.
No.3/ Tại End-User App (có thể là project ReactJs, VueJs, hoặc một site Laravel khác), thêm xử lý khi người dùng click vào button “Đăng nhập”: ta sẽ redirect sang API có URL là: `http://127.0.0.1:8000/oauth/authorize?` với query_string sau:
No.4/ Phía API sẽ xử lý request, và tự động chuyển hướng về đường dẫn REDIRECT_URI tại End-User App, với tham số `code`.
No.5/ Tại End-User App, ta xử lý nhận tham số `code` tại query_string; và gửi tiếp một request dạng POST tới địa chỉ `http://127.0.0.1:8000/oauth/token`, để lấy các token. Payload gồm các thông tin sau:
No.6/ Nếu thành công, phía API sẽ gửi về một JSON Response, với các thông tin như:
No.7/ Yeah, Our mission completed! Chúng ta lưu lại các token và chuyển trang tới màn hình khác, như Profile chẳng hạn.
Tham chiếu
Còn đây là code demo cho bài viết, gồm cả BE (Laravel + Passport) và FE (VueJs + Nuxt). Source code on Github
