Lòng vòng lấy Access Token của Facebook API
White

Mòe viết ngày 24/08/2021

Mình đang cần dùng Facebook API để lấy các bài viết trên tường của một user, sau đây là cách để lấy được access token dài hạn, dùng trong 60 ngày, để app backend của bạn không phải xin đi xin lại token sau mỗi giờ đồng hồ nếu dùng access token ngắn hạn.

Tóm tắt những điểm cần chú ý:

Đối với app chưa qua Facebook Review và đang ở Development mode (bài này chỉ nói trong phạm vi đó):

  • Chỉ có thể sử dụng được trong nội bộ thành viên của app.
  • Phải để app ở Development mode mới xin được nhiều quyền, nếu để Live mode chỉ được quyền cơ bản (email, public profile)
  • Về redirect uri:
    • Nếu là tự build login flow ở server side:
      • Nếu là localhost thì không cần https và port nào cũng được
      • Nếu là domain khác thì vừa cần https, vừa cần điền vào app domain + valid oauth uri (xem cụ thể ở phần dưới)
    • Nếu là dùng client side Javascript SDK: bắt buộc https, bắt buộc port 80, bắt buộc điền vào app domain + valid oauth uri, xem hướng dẫn tạo https cho localhost của live server ở đây alt text

Bước 1: Đăng kí tài khoản Facebook Developer

Vào đây tạo: https://developers.facebook.com/async/registration/

Bước 2: Tạo một app

Vào đây tạo: https://developers.facebook.com/apps/

Bước 3: Lưu lại các thông số cần thiết cho các bước tiếp theo

3.1. Đưa những tài khoản Facebook cần lấy dữ liệu vào làm thành viên của app

Vì chưa được facebook review nên chỉ admin, developer, tester... của app mới được dùng app
Thêm những vị này vào Roles
alt text

3.2. Client ID (App ID) và Client Secret (App Secret)

Vào Settings > Basic lưu lại App ID và App Secret lát nữa dùng
alt text

3.3. Điền app domain với redirect uri

Nếu là localhost thì không cần điền.
Nếu là domain khác thì phải dùng https và điền vào Settings > Basic > App domain, và Facebook login > Valid OAuth redirect URIsFacebook login > Allowed domains for the Javascript SDK

alt text
alt text

Chú ý: Trong doc có đề cập đến uri https://www.facebook.com/connect/login_success.html này làm redirect uri, nhưng hình như không phải là dành cho trường hợp này

Bước 4. Một loạt request để trao đổi

Bước 4.1. Dùng client id đổi lấy auth code

Đưa url sau cho người dùng (xóa dấu xuống dòng đi)

https://www.facebook.com/{graph-api-version}/dialog/oauth?
  client_id={app-id}
  &redirect_uri={redirect-uri}
  &state={state-param}
  &scope={scope}

Trong đó:

  • scope: các quyền mà bạn muốn xin người dùng. Có thể tham khảo danh sách các quyền trong doc hoặc trong Graph Explorer. Nếu không nhắc đến scope thì quyền truy cập mặc định là public_profile.

VD: https://www.facebook.com/v11.0/dialog/oauth?client_id=123&redirect_uri=https://localhost/&scope=user_posts

Họ click vào đó, xuất hiện hộp thoại xin quyền,
alt text

Nếu người dùng cho phép, thì họ sẽ được đưa tới một url khác có param là auth code, chúng ta cần nắm lấy cái auth code này để thực hiện các bước sau

VD: https://localhost/?code=abc#_=_

Chú ý:

  • Nếu gặp lỗi "Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings." thì coi lại phần đầu bài viết về các redirect uri hợp lệ.
  • Để trình duyệt ở trạng thái đăng nhập tài khoản facebook mà bạn muốn xin quyền. Có thể là chính bạn tác giả app, hoặc tài khoản của các vai trò khác như dev, tester...
  • Nếu đã từng cấp quyền rồi thì hộp thoại xin quyền sẽ không hiện lại nữa mà trên thanh địa chỉ đi thẳng đến URI luôn. Nếu muốn xuất hiện lại cái hộp này thì vào Facebook gỡ app ra ở Settings & Privacy > Settings > Apps and Websites

Bước 4.2. Dùng auth code đổi lấy user access token ngắn hạn

Access token ngắn hạn có hiệu lực trong vòng hơn 1 tiếng

Truy cập url sau hoặc gọi GET request (xóa dấu xuống dòng đi)

https://graph.facebook.com/{graph-api-version}/oauth/access_token?
   client_id={app-id}
   &redirect_uri={redirect-uri}
   &client_secret={app-secret}
   &code={code-parameter}

Trong đó:

  • redirect_uri phải có dấu slash / ở cuối nếu không là toang! VD https://localhost là toang mà https://localhost/ thì được.
  • code: là auth code đã lấy được ở bước trước

VD:
https://graph.facebook.com/v11.0/oauth/access_token?client_id=123&redirect_uri=http://localhost/&client_secret=abc&code=xyz

Nếu bị trả về cái lỗi "Error validating verification code. Please make sure your redirect_uri is identical to the one you used in the OAuth dialog request" dù tất cả redirect_uri ở mọi chỗ của bạn đã giống nhau rồi, thì xem redirect_uri có dấu slash ở cuối không.

Nếu thành công bạn sẽ nhận được 1 response với body có object chứa access token ngắn hạn

{
  access_token: 'EAAHjvCSg630BAFrFwDHYEjZCetpE9tIZA40i2lZAEkTUxdJ4d8UOp5wYitqZCd75XZCY5ceqMZBrzomXsVceIOVyt1bTLHx0pDhkNYzKfVQNB7863hoaL4GxUFpZAZC5PQyCvCOWviYgadAuZBUDgdEwalSf2MOsjgDdZAZCEb5eqnlRAZDZD',
  token_type: 'bearer',
  expires_in: 5183383
}

Bước 4.3. Dùng access token ngắn hạn đổi lấy access token dài hạn

Access token dài hạn có hiệu lực trong vòng 60 ngày.

Truy cập url sau hoặc gọi GET request (xóa dấu xuống dòng đi)

https://graph.facebook.com/{graph-api-version}/oauth/access_token?  
    grant_type=fb_exchange_token&          
    client_id={app-id}&
    client_secret={app-secret}&
    fb_exchange_token={short-lived-access-token}

Trong đó:

  • fb exchange token: là access token ngắn hạn vừa đạt được ở bước trước

VD:
https://graph.facebook.com/v11.0/oauth/access_token?grant_type=fb_exchange_token&client_id=123&client_secret=abc&fb_exchange_token=def

Nếu thành công bạn sẽ nhận được 1 response với body có object chứa access token dài hạn

 {
  access_token: 'EAAHjvCSg630BABuyF9fuRgly9SKAQIQFcLUZAXL3U5ftw7dI4XTi3lAsFx6PZAAvAZCvPbE205n3kHVvjU1CY4ZCSP18mVJz9WNH2ARb2UiwHgDgW540bQW2jjeCHeTuCHnkmNXnWJCMEeVuIS2DM1J0LIz5skhKPfaSgK36tZB0v86RjgxtN',
  token_type: 'bearer',
  expires_in: 5183014
}

Bài tham khảo

https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow
https://stackoverflow.com/questions/38477149/facebook-login-please-make-sure-your-redirect-uri-is-identical-to-the-one-you-u

Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

White

Mòe

8 bài viết.
362 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
White
135 45
Google cách học tốt Tiếng Anh thì ra hàng đống kết quả nhưng bạn mãi không dùng được cái nào. Vậy thay vì tìm cách học tốt hãy đọc thử những cách h...
Mòe viết hơn 3 năm trước
135 45
White
44 10
(Ảnh) Dùng CSS để "sửa" nội dung HTML Ngoài nguyên nhân là muốn chơi nổi thì lí do phải dùng code CSS để tác động vào HTML là khi bạn không được...
Mòe viết gần 3 năm trước
44 10
White
36 16
Các khái niệm riêng của Wordpress dễ gây nhầm lẫn Ai muốn làm theme động luôn và không muốn hiểu lý thuyết có thể bỏ qua phần này. Ngay ở documen...
Mòe viết hơn 2 năm trước
36 16
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


White
{{userFollowed ? 'Following' : 'Follow'}}
8 bài viết.
362 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!