Xác thực đăng nhập cho doanh nghiệp

Đăng nhập cho doanh nghiệp (còn gọi là Đăng nhập bằng Facebook) là điểm bắt đầu cho phép chủ doanh nghiệp kết nối doanh nghiệp trên nền tảng của bạn với trang cá nhân Facebook hoặc Instagram của họ, thông qua một nút được đặt trên trang web của bạn.

Đăng nhập cho doanh nghiệp hiển thị trên giao diện nền tảng của bạn (thường nằm trong một bảng điều khiển quản trị nội bộ) và kích hoạt quy trình Đăng nhập cho doanh nghiệp. Chủ doanh nghiệp có thể dùng quy trình này để liên kết trang cá nhân Facebook của họ với sự hiện diện của doanh nghiệp trên trang web của bạn và bật các tính năng của Tiện ích Facebook Business (FBE).

Một Giải pháp thay mặt cho doanh nghiệp (OBO) kết nối đối tác và doanh nghiệp của khách hàng sẽ được tạo trong quá trình cài đặt FBE. Giải pháp này cho phép đối tác lấy mã truy cập của người dùng hệ thống FBE bằng cách sử dụng thông tin đăng nhập của người dùng hệ thống quản trị Trình quản lý kinh doanh của đối tác, bên cạnh thông tin đăng nhập của quản trị viên Trình quản lý kinh doanh của khách hàng (phương thức hiện tại).

Yêu cầu

Có thể ứng dụng của bạn cần hoàn tất quy trình Xét duyệt ứng dụng để nhận được các quyền sau đây:

• catalog_management - Chỉ khi ứng dụng của bạn bật các tính năng liên quan đến Danh mục. Hoặc bạn có thể yêu cầu quyền ads_management nếu cũng muốn thay mặt khách hàng quản lý các quảng cáo của người bán.
• business_creative_management - Nếu ứng dụng của bạn là một ứng dụng nội dung sử dụng API Draper.

Thiết lập quy trình đăng nhập

Để thiết lập quy trình đăng nhập, hãy xem xét các tùy chọn sau đây:

• Tải tính năng Đăng nhập cho doanh nghiệp qua URL - Khuyên dùng nếu bạn không định sử dụng Facebook JavaScript SDK. Tùy chọn này yêu cầu bạn liên kết đến một URL được tạo tự động cho mỗi doanh nghiệp từ một nút trên trang web của bạn.

• Tải tính năng Đăng nhập cho doanh nghiệp qua Facebook SDK - Facebook SDK cung cấp chức năng phổ biến phía ứng dụng. Chúng tôi khuyên những nhà phát triển đã quen dùng Facebook SDK sử dụng tùy chọn này vì đây là phương pháp khởi chạy chuẩn hơn cho quy trình Đăng nhập cho doanh nghiệp.

Tải tính năng Đăng nhập cho doanh nghiệp qua URL

Để kích hoạt tính năng Đăng nhập cho doanh nghiệp qua URL, hãy đặt một nút trên trang web của bạn để mở URL.

URL Đăng nhập cho doanh nghiệp phải có các thông số truy vấn sau:

Nếu ứng dụng của bạn yêu cầu URI chuyển hướng động, hãy dùng thông số trạng thái để chuyển lại thông tin động cho URI chuyển hướng của bạn sau khi hoàn tất quy trình Đăng nhập cho doanh nghiệp.

Trong ví dụ bên dưới, thông số truy vấn extras được định dạng đúng cách, đồng thời chỉ định cả đối tượng business_config và setup.

URL mẫu

https://facebook.com/dialog/oauth?
client_id=<FB_APP_ID>
&display=page
&redirect_uri="https://partner-site.com/redirectlanding"
&response_type=token
&scope=manage_business_extension
//   alternatively use catalog_management or ads_management
//   &scope=manage_business_extension,catalog_management,ads_management
&extras={
  "setup": {
    "external_business_id": "foo-123",
    "timezone": "America/Los_Angeles",
    "currency": "USD",
    "business_vertical": "APPOINTMENTS"
  },
  "business_config": {
    "business": {
      "name": "Foo Business"
    },
    "page_cta": {
      "enabled": true,
      "cta_button_text": "Book Now",
      "cta_button_url": "https://partner-site.com/foo-business",
      "below_button_text": "Powered by FBE Partner"
    },
    "page_card": {
      "enabled": true,
      "see_all_text": "See All",
      "see_all_url": "https://partner-site.com/foo-business",
      "cta_button_text": "Book"
    },
    "ig_cta": {
      "enabled": true,
      "cta_button_text": "Book Now",
      "cta_button_url": "https://partner-site.com/foo-business"
    },
    "messenger_menu": {
      "enabled": true,
      "cta_button_text": "Book Now",
      "cta_button_url": "https://partner-site.com/foo-business"
    },
    "thread_intent": {
      "enabled": true,
      "cta_button_url": "https://partner-site.com/foo-business"
    }
  },
  "repeat": false
}

Tải tính năng Đăng nhập cho doanh nghiệp qua Facebook SDK

Bước 1. Tải Facebook JavaScript SDK

Bạn có thể tải SDK xuống và lưu trữ trên nền tảng của mình hoặc lấy SDK lưu trữ trên Facebook. Bạn nên dùng SDK lưu trữ trên Facebook.

Bước 2. Đính kèm chức năng fbAsyncInit vào đối tượng Window để thiết lập chế độ cài đặt SDK.

Trước khi tải Javascript SDK, cần phải có hàm fbAsyncInit trên đối tượng window. SDK sẽ gọi hàm này để thiết lập window.fbAsyncInit() phù hợp.

Thiết lập này bao gồm:

• appId: ID ứng dụng trên Facebook.
• cookie: Bật cookie để cho phép máy chủ truy cập phiên này.
• xfbml: Phân tích cú pháp các plugin xã hội trên trang này.
• version: Cho SDK biết bạn muốn dùng phiên bản API đồ thị nào (tài liệu này được viết vào thời điểm v10.0 là phiên bản mới nhất)

Trước khi tải JavaScript SDK, hãy đính kèm fbAsyncInit vào đối tượng window.

Bước 3. Khởi chạy FBE qua hàm FB.login() (còn gọi là "Đăng nhập cho doanh nghiệp").

Sau khi tải SDK và khởi tạo bằng thông tin thích hợp, hãy dùng SDK để tải FB.login(). Thông số quan trọng cần chuyển vào hàm FB.login() là:

1. Hàm gọi lại phản hồi
2. Đối tượng cho trường scope và extras

Hãy xem phần Đối tượng và loại API tiện ích Facebook Business để biết thông tin chi tiết.

Ví dụ:

<script>
    window.fbAsyncInit = function() {
    //2. FB JavaScript SDK configuration and setup
        FB.init({
            appId      : '<app_id>', // FB App ID
            cookie     : true,  // enable cookies to allow the server to access the session
            xfbml      : true,  // parse social plugins on this page
            version    : 'v4.0' // uses graph api version v4.0
        });
    };

    //1. Load the JavaScript SDK asynchronously
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "https://connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

     //3. Facebook login with JavaScript SDK
    function launchFBE() {
        FB.login(function (response) {
            if (response.authResponse) {
                // returns a User Access Token with scopes requested
                const accessToken = response.authResponse.accessToken;
                const message = {
                    'success':true,
                    'access_token':accessToken,
                };
                // store access token for later  
            } else {
              console.log('User cancelled login or did not fully authorize.');
            }
        }, {
            scope: 'catalog_management,manage_business_extension',
          // refer to the extras object table for details
            extras: {
                "setup":{
                  "external_business_id":"<external_business_id>",
                  "timezone":"America\/Los_Angeles",
                  "currency":"USD",
                  "business_vertical":"ECOMMERCE"
                },
                "business_config":{
                  "business":{
                     "name":"<business_name>"
                  },
                  "ig_cta": {
                    "enabled": true,
                    "cta_button_text": "Book Now",
                    "cta_button_url": "https://partner-site.com/foo-business"
                  }
                },
                "repeat":false
            }
        });
    }
</script>

Bước 4. Tạo nút hoặc liên kết để khởi chạy FBE.

Để tải màn hình, hãy thêm nút hoặc liên kết hàm onClick sẽ gọi launchFBE():

<button onclick="launchFBE()"> Launch FBE Workflow </button>

Di động

Để biết cách triển khai FBE trên di động, hãy xem Tài liệu về thiết bị di động.

Tìm hiểu thêm

• Cách tạo một tiện ích tích hợp Ứng dụng kinh doanh
• Tìm hiểu về phương thức Đăng nhập bằng Facebook
• Hãy xem phần Các loại và đối tượng API FBE
• Tìm hiểu thêm về quy trình Xét duyệt ứng dụng và các quyền
• Cách gỡ cài đặt FBE