Bản chất của việc login thông qua bên thứ 3 là gì? (VD: Login via Facebook, Github)

Hình thức này mình tìm được tên của nó là Social Login, giờ mình muốn biết bản chất của việc này, tức là “Cần get được cái gì từ dịch vụ bên thứ 3”, thường có vẻ người ta dùng OAuth2, nhưng rốt cuộc nó như thế nào (Tại sao access token của bên thứ 3 lại có thể dùng để đăng nhập vào dịch vụ của mình)?? Mình đã tìm google nhưng toàn là sử dụng thư viện viết sẵn - không phải thứ mình kì vọng.

Xin nhờ ai có kinh nghiệm việc này chỉ bảo. Lưu ý:

  • Không đưa code, hãy đưa ý tưởng;
  • Không sử dụng thư viện lo từ A đến Z, vì có thể mình muốn dùng cái này bất kì nơi nào mình muốn (chưa chắc đã có thư viện mà dùng);
  • Mình muốn hiểu nó, chứ không chỉ dùng nó;
3 Likes

Hồi lâu m có viết 1 cái component để login fb, google ko sài thư viện ngoài. ( vì m thấy nó khó hiểu)
Đầu tiên bác sẽ lên google / fb để đăng ký là m sẽ login thông qua nó, bác sẽ đc cấp ClientID, ClientSecret và bác phải điền RedirectUri của web của bác vào google/fb, chẳng hạn của m điền là "https://xxx.net/api/oauth/facebook"

Ở web của bác nút login via Facebook sẽ dẫn đến đường link dạng như sau

`https://www.facebook.com/v2.10/dialog/oauth?%20client_id=${this.FB_ClientID}&redirect_uri=${this.FB_RedirectUri}`

Ok sau khi user click vào đó nó sẽ redirect đến trang của facebook như các bác đã thấy khi đăng nhập daynhauhoc chẳng hạn :smiley:
Sau khi bạn chấp nhận cho kết nối thông qua fb rồi thì facebook sẽ gửi 1 get request đến RedirectUri của bạn có dạng như sau:
GET https://xxx.net/api/oauth/facebook?code=xxxxxxxxxxxxxxxxxxxxxx
Tại chỗ này bạn sẽ có được code để có thể làm những bước tiếp theo trên server của bạn.
Đối với fb thì tiếp theo bước này là bước lấy access token;

 let accessToken = (await axios.get(`https://graph.facebook.com/v2.10/oauth/access_token?client_id=${this.ClientID}&redirect_uri=${this.RedirectUri}&client_secret=${this.ClientSecret}&code=${this.code}`)).data['access_token']

Lấy đc access_token rồi thì bác có thể lấy đc profile của user

(await axios.get(`https://graph.facebook.com/me?access_token=${accessToken}`)).data

Lấy đc profile rồi thì bác có thể lưu vào database của m là xong.
3 trường chủ yếu của profile là avatar_url, display_name và facebook_id
Profile này có facebook_id nên nếu facebook_id chưa tồn tại trong database thì chúng ta sẽ tạo mới tài khoản, còn nêu đã tồn tại thì cho đăng nhập bình thường.
p/s: facebook_id ở đây khác id trên trang timeline của chúng ta và mỗi ClientID , dù đăng nhập cùng 1 tài khoản facebook nhưng sẽ cho facebook_id khác nhau --> có lẽ vì lý do bảo mật

9 Likes

OK, vậy là kết hợp giữa access_token với facebook_id là ổn, cảm ơn bạn nhiều :grin:

2 Likes
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?