Phương thức Đăng nhập thiết bị bằng Facebook

Nếu bạn đang tìm kiếm sự trợ giúp cho Cổng thông tin Facebook của mình, vui lòng truy cập vào Trung tâm trợ giúp về cổng thông tin.

Để nhập mã Facebook cho thiết bị nhằm đăng nhập vào TV thông minh, camera, máy in và các thiết bị khác, hãy truy cập vào Trang Facebook cho thiết bị.

Triển khai Đăng nhập thiết bị bằng Facebook để cho phép mọi người đăng nhập ứng dụng hoặc dịch vụ của bạn bằng tài khoản Facebook của họ. Tính năng này cho phép mọi người đăng nhập thiết bị có khả năng hiển thị hoặc đầu vào hạn chế, chẳng hạn như TV thông minh, khung ảnh kỹ thuật số hoặc các thiết bị trong Mạng lưới thiết bị kết nối Internet.

Khi bạn sử dụng đăng nhập thiết bị, thiết bị sẽ hiển thị một mã gồm chữ và số, đồng thời yêu cầu mọi người nhập mã này vào trang web trên máy tính hoặc điện thoại thông minh của họ. Sau đó, những người dùng ứng dụng hoặc dịch vụ có thể cấp quyền. Sau khi ứng dụng nhận được quyền, thiết bị sẽ nhận được mã truy cập mà ứng dụng dùng để tạo yêu cầu API Đồ thị nhằm xác định người đó và tìm hiểu thông tin để tạo ra trải nghiệm riêng cho họ trên thiết bị.

Nếu đang tạo ứng dụng TV dành cho Apple TV, Android TV hay Fire TV, thì bạn nên sử dụng Facebook SDK dành cho tvOS hoặc Facebook SDK dành cho Android.

Hướng dẫn này mô tả cách tích hợp thủ công Đăng nhập thiết bị mà không cần dùng các SDK ở trên.

Trải nghiệm người dùng
Triển khai đăng nhập cho thiết bị
Khắc phục sự cố

Trải nghiệm người dùng

Những hướng dẫn này mô tả cách thiết kế một trải nghiệm đăng nhập rõ ràng, an toàn và nhất quán trên các thiết bị và dịch vụ.

1. Nút kêu gọi hành động

Đầu tiên, hãy xem xét bạn muốn yêu cầu mọi người đăng nhập hoặc kết nối với Facebook ở đâu trong trải nghiệm người dùng. Đối với một số thiết bị, đây sẽ là hành động ngay lập tức còn đối với các thiết bị khác, hành động này có thể xảy ra sau trong trải nghiệm.

Để đảm bảo trải nghiệm người dùng tiện lợi, nhất quán và đáng tin cậy nhất, hãy thiết kế nút này giống tối đa có thể với nút Đăng nhập Facebook chính thức.

Từ khía cạnh thiết kế trực quan, điều này nghĩa là bạn nên

Dán nhãn nút là “Đăng nhập bằng Facebook” hoặc “Kết nối với Facebook”.
Sử dụng màu trắng và màu xanh lam thương hiệu chính thức của Facebook: #1877F2.
Nếu thiết bị của bạn hỗ trợ hiển thị đồ họa, bạn cũng có thể kết hợp logo chữ “f” chính thức. Theo Nguyên tắc về thương hiệu của Facebook, logo luôn phải là màu trắng hoặc xanh lam của Facebook (#1877F2).

Nếu phù hợp, hãy mô tả lợi ích của việc đăng nhập. Ví dụ: “tìm hiểu nội dung bạn bè đang xem” hoặc "xem ảnh từ album của bạn trên Facebook”.

2. Hiển thị mã

Khi ai đó nhấp vào nút kêu gọi hành động, thiết bị thực hiện lệnh gọi đến API của Facebook. API này trả về một mã.

Trong giao diện của bạn, cho mọi người biết rằng họ cần truy cập một trang web và nhập mã bằng thông báo sau: “Tiếp theo, hãy truy cập facebook.com/device (http://facebook.com/device) trên máy tính hoặc điện thoại thông minh và nhập mã này”. Hiển thị toàn bộ mã bạn đã nhận được từ API Đăng nhập thiết bị của Facebook. Mã này dài từ 6 đến 12 ký tự.

Bạn có thể thêm nút Close hoặc Cancel để mọi người có thể hủy quy trình đăng nhập thiết bị. Hành động này sẽ đưa họ về màn hình đăng nhập ban đầu.

Khi mã hiển thị trên màn hình, thiết bị sẽ thăm dò API Đăng nhập thiết bị để xem ai đó đã ủy quyền cho ứng dụng của bạn chưa. Sau vài phút, nếu họ không nhập mã, API Đăng nhập thiết bị sẽ trả về một lỗi code_expired. Khi thiết bị nhận được lỗi này, bạn nên hủy quy trình đăng nhập và giao diện nên hiển thị nút kêu gọi hành động.

Bạn cũng có thể tạo mã QR bằng mã người dùng nhúng trong URL. Cách thực hiện điều này là thêm thông số user_code vào URL:

https://www.facebook.com/device?user_code=<USER_CODE>

3. Ủy quyền

Đây là luồng mọi người nhìn thấy khi họ truy cập facebook.com/device trên máy tính hoặc trình duyệt di động của mình. Đầu tiên, họ sẽ nhìn thấy một trường văn bản để nhập mã:

Sau khi nhập mã và nhấp vào Continue, họ có thể chọn quyền mình muốn cấp:

Thông báo xác nhận sẽ hiển thị để mọi người biết quá trình đăng nhập của mình thành công:

4. Xác nhận đăng nhập thành công

Trên giao diện của thiết bị, bạn cũng sẽ nhìn thấy một thông báo xác nhận. Thông báo lý tưởng bao gồm tên và ảnh đại diện của họ trên Facebook, nếu có thể.

Hiển thị xác nhận này trên thiết bị đến khi người đó nhấp vào nút Continue. Ai đó có thể phải nhập mã vào máy tính ở vị trí khác nên họ có thể cần thời gian để quay lại thiết bị của bạn và xem xác nhận trước khi tiếp tục.

Sau khi người đó nhấp vào Continue, thiết bị của bạn có thể hiển thị một trải nghiệm người dùng tuyệt vời dành riêng cho từng cá nhân.

5. Đăng xuất hoặc ngắt kết nối

Mọi người phải đăng xuất được khỏi thiết bị và thiết bị của bạn không được lưu trữ kết nối của họ với Facebook. Để thực hiện việc này, hãy cung cấp một tùy chọn Log out from Facebook hoặc Disconnect from Facebook trong menu của thiết bị.

Khi ai đó chọn tùy chọn này, thiết bị của bạn phải xóa mã truy cập đã lưu trữ khỏi bộ nhớ. Nếu bạn lưu trữ mã truy cập trong cơ sở dữ liệu hoặc dịch vụ lưu trữ đám mây, bạn cũng nên xóa dữ liệu tại đó. Bạn không cần thực hiện lệnh gọi API để vô hiệu hóa mã truy cập.

Sau khi ai đó đăng xuất, thiết bị phải hiển thị nút kêu gọi hành động ban đầu trong Bước 1.

Triển khai đăng nhập cho thiết bị

Đăng nhập Facebook dành cho thiết bị là để dành cho thiết bị thực hiện trực tiếp lệnh gọi HTTP qua Internet. Sau đây là các lệnh gọi API và phản hồi mà thiết bị của bạn có thể thực hiện.

Tải bảng điều khiển của ứng dụng và thay đổi Sản phẩm > Đăng nhập Facebook > Cài đặt > Đăng nhập từ thiết bị thành "Có".

2. Tạo mã

Khi người dùng nhấp vào nút kêu gọi hành động Connect to Facebook hoặc Log in with Facebook, thiết bị của bạn sẽ tạo yêu cầu HTTP POST và gửi đến:

POST https://graph.facebook.com/v2.6/device/login
       access_token=<YOUR_APP_ID|CLIENT_TOKEN>
       scope=<COMMA_SEPARATED_PERMISSION_NAMES> // e.g. public_profile,user_likes
       redirect_uri=<VALID_OAUTH_REDIRECT_URL>

Thông số scope là không bắt buộc và phải bao gồm một danh sách Quyền đăng nhập phân tách bằng dấu phẩy và được phê duyệt để sử dụng trong bước Xét duyệt đăng nhập.

CLIENT_TOKEN có trong Cài đặt ứng dụng -> Nâng cao và phải được kết hợp với ID ứng dụng của bạn (được phân cách bằng dấu sổ thẳng, |) để tạo thành access_token hoàn chỉnh.

redirect_uri là thông số tùy chọn. Khi bạn cung cấp một URL, người dùng sẽ được chuyển hướng đến URL sau khi đăng nhập thành công. Điều này cho phép bạn đăng nhập người đó vào trang web của ứng dụng để quản lý tài khoản bổ sung. URL này phải là URL chuyển hướng OAuth hợp lệ như được cấu hình trong Cài đặt ứng dụng -> Nâng cao. Phản hồi có dạng sau:

{
  "code": "92a2b2e351f2b0b3503b2de251132f47",
  "user_code": "A1NWZ9",
  "verification_uri": "https://www.facebook.com/device",
  "expires_in": 420,
  "interval": 5
}

Phản hồi này nghĩa là:

Hiển thị chuỗi “A1NWZ9” trên thiết bị của bạn
Yêu cầu người đó truy cập “facebook.com/device” và nhập mã này
Mã sẽ hết hạn sau 420 giây. Bạn nên hủy luồng đăng nhập sau thời gian đó nếu bạn không nhận được mã truy cập
Thiết bị của bạn nên thăm dò API Đăng nhập thiết bị 5 giây một lần để xem đã ủy quyền thành công chưa.

3. Hiển thị mã

Thiết bị của bạn sẽ hiển thị user_code và yêu cầu mọi người truy cập verification_uri, chẳng hạn như facebook.com/device trên PC hoặc điện thoại thông minh của họ. Xem Trải nghiệm người dùng.

4. Thăm dò ủy quyền

Thiết bị của bạn nên thăm dò API Đăng nhập thiết bị để xem người đó đã ủy quyền thành công cho ứng dụng chưa. Bạn nên thực hiện việc này vào interval để phản hồi lệnh gọi trong Bước 1 (diễn ra 5 giây một lần). Thiết bị của bạn nên thăm dò đến:

POST https://graph.facebook.com/v2.6/device/login_status
       access_token=<YOUR_APP_ID|CLIENT_TOKEN>
       code=<LONG_CODE_FROM_STEP_1> // e.g. "92a2b2e351f2b0b3503b2de251132f47"

Phản hồi lệnh gọi API này phụ thuộc vào vị trí của ai đó trong quy trình ủy quyền. Bạn sẽ nhận được mã truy cập hoặc đối tượng lỗi với mã phụ cụ thể để phân tích cú pháp:

Mã phụ lỗi	Ví dụ về phản hồi	Ý nghĩa
`N/A`	`{"access_token": "ABCD...", "expires_in" : 5183996 }`	Người dùng đã ủy quyền thành công cho thiết bị. Giờ đây, thiết bị có thể sử dụng giá trị `access_token` để thực hiện lệnh gọi API được ủy quyền.
`1349174`	`{"error":{"message":"This request requires the user to take a pending action","code":31,"error_subcode":1349174,"error_user_title":"Device Login Authorization Pending","error_user_msg":"User has not yet authorized your application. Continue polling."}}`	Người dùng chưa ủy quyền cho ứng dụng của bạn. Tiếp tục thăm dò ở tốc độ đã chỉ định trong phản hồi ở Bước 1.
`1349172`	`{"error":{"message":"User request limit reached","code":17,"error_subcode":1349172,"error_user_title":"OAuth Device Excessive Polling","error_user_msg":"Your device is polling too frequently. Space your requests with a minium interval of 5 seconds."}}`	Thiết bị đang thăm dò quá thường xuyên. Hãy giảm bớt hoạt động thăm dò về khoảng thời gian đã chỉ định trong lệnh gọi API đầu tiên.
`1349152`	`{"error":{"message":"The session has expired""code":463,"error_subcode":1349152, "error_user_title":"Activation Code Expired","error_user_msg":"The code you entered has expired. Please go back to your device for a new code and try again."}}`	Mã thiết bị đã hết hạn. Hủy luồng đăng nhập thiết bị và chuyển người dùng về màn hình ban đầu.

5. Xác nhận đăng nhập thành công

Khi bạn nhận được mã truy cập thì người đó đã ủy quyền thành công cho ứng dụng. Bạn nên giữ lại mã truy cập này trên thiết bị.

Để mọi người biết quá trình đăng nhập đã thành công, thiết bị của bạn nên hiển thị tên của họ và một ảnh đại diện, nếu có, đến khi họ nhấp vào Continue. Để lấy tên và ảnh đại diện của người đó, thiết bị của bạn phải thực hiện lệnh gọi API Đồ thị tiêu chuẩn:

GET https://graph.facebook.com/v2.3/me?
      fields=name,picture&amp;
      access_token=<USER_ACCESS_TOKEN>

Bạn sẽ nhận được phản hồi ở dạng:

{
  "name": "John Doe", 
  "picture": {
    "data": {
      "is_silhouette": false, 
      "url": "https://fbcdn.akamaihd.net/hmac...ile.jpg"
    }
  }, 
  "id": "2023462875238472"
}

Hãy hiển thị tên và ảnh đại diện của người đó cho đến khi họ nhấp vào Continue trên thiết bị của bạn.

6. Lưu trữ mã truy cập

Thiết bị của bạn nên giữ lại mã truy cập để tạo các yêu cầu khác đến API Đồ thị.

Mã truy cập đăng nhập thiết bị có thể hợp lệ trong tối đa 60 ngày nhưng có thể bị vô hiệu hóa trong nhiều trường hợp. Ví dụ: khi một người đổi mật khẩu Facebook thì mã truy cập của họ bị vô hiệu hóa.

Nếu mã không hợp lệ, thiết bị của bạn nên xóa mã khỏi bộ nhớ. Người dùng thiết bị cần thực hiện lại luồng đăng nhập thiết bị từ Bước 1 để truy xuất mã mới, hợp lệ.

Khắc phục sự cố

Tôi có thể tạo yêu cầu quy trình thiết bị qua HTTP không?
OAuth 2 yêu cầu TLS/HTTPS.

Tôi có thể tạo yêu cầu quy trình thiết bị bằng phương thức GET không?
Tất cả yêu cầu quy trình thiết bị đều phải là yêu cầu POST.

Làm cách nào để làm mới mã truy cập đăng nhập thiết bị?
Mã truy cập đăng nhập thiết bị có thể hợp lệ trong tối đa 60 ngày.

Nếu mã không hợp lệ, thiết bị của bạn nên xóa mã khỏi bộ nhớ. Người dùng thiết bị cần thực hiện lại quy trình đăng nhập thiết bị được mô tả tại đây trong Bước 1 để truy xuất mã mới, hợp lệ.

Hãy tham khảo phần Mã truy cập để tìm hiểu thêm về cách làm mới mã.

Tôi gặp lỗi Invalid API method khi tạo yêu cầu POST. Nguyên nhân là gì?
Nếu bạn đang tạo yêu cầu POST và gặp lỗi như sau:

{"error":{"message":"Invalid API method","type":"OAuthException","code":3}}

Bạn có thể cần bật phương thức Đăng nhập từ thiết bị trong ứng dụng.

Tải bảng điều khiển của ứng dụng và đặt Sản phẩm > Đăng nhập Facebook > Cài đặt > Đăng nhập từ thiết bị thành "Có".

Mã truy cập đăng nhập thiết bị của tôi không hợp lệ. Tôi cần làm gì?
Nếu mã truy cập không hợp lệ, thiết bị của bạn nên xóa mã đó khỏi bộ nhớ và nhận mã mới. Người dùng thiết bị cần thực hiện lại quy trình đăng nhập thiết bị được mô tả tại đây trong Bước 1 để truy xuất mã mới, hợp lệ.