Xác thực người dùng

Các giao thức xác thực web sử dụng các tính năng HTTP, nhưng Ứng dụng Chrome chạy bên trong vùng chứa ứng dụng; chúng không tải qua HTTP và không thể thực hiện các lệnh chuyển hướng hoặc đặt cookie.

Sử dụng API Chrome Identity để xác thực người dùng: getAuthToken cho người dùng đã đăng nhập vào Tài khoản Google của họ và launchWebAuthFlow cho người dùng đăng nhập vào tài khoản không phải Tài khoản Google. Nếu ứng dụng của bạn dùng máy chủ riêng để xác thực người dùng, thì bạn sẽ cần sử dụng máy chủ sau.

Cách thức hoạt động

Người dùng Ứng dụng Chrome được liên kết với hồ sơ của họ đã có Tài khoản Google. Các ứng dụng có thể nhận mã thông báo OAuth2 cho những người dùng này bằng cách sử dụng API getAuthToken.

Các ứng dụng muốn xác thực với nhà cung cấp danh tính không phải của Google phải gọi launchWebAuthFlow. Phương thức này sử dụng một cửa sổ bật lên của trình duyệt để hiển thị các trang của nhà cung cấp và ghi lại lệnh chuyển hướng đến các mẫu URL cụ thể. Các URL chuyển hướng được chuyển đến ứng dụng và ứng dụng sẽ trích xuất mã thông báo từ URL.

Xác thực Tài khoản Google

Dưới đây là 5 bước bạn cần hoàn thành:

  1. Thêm quyền vào tệp kê khai rồi tải ứng dụng lên.
  2. Sao chép khoá trong manifest.json đã cài đặt vào tệp kê khai nguồn để mã nhận dạng ứng dụng của bạn sẽ không đổi trong quá trình phát triển.
  3. Nhận mã ứng dụng khách OAuth2 cho ứng dụng Chrome.
  4. Cập nhật tệp kê khai để thêm mã ứng dụng khách và phạm vi.
  5. Lấy mã thông báo xác thực.

Thêm quyền và tải ứng dụng lên

Bạn cần đảm bảo quyền truy cập danh tính có trong tệp kê khai. Sau đó, bạn có thể tải ứng dụng lên trang quản lý ứng dụng và tiện ích (xem phần Phát hành).

"permissions": [
  "identity"
]

Sao chép khoá vào tệp kê khai

Khi đăng ký ứng dụng của mình trong bảng điều khiển OAuth của Google, bạn sẽ cung cấp mã nhận dạng của ứng dụng. Mã này sẽ được kiểm tra trong các yêu cầu mã thông báo. Do đó, điều quan trọng là phải có một mã ứng dụng nhất quán trong quá trình phát triển.

Để giữ cho mã ứng dụng không đổi, bạn cần sao chép khoá trong manifest.json đã cài đặt vào tệp kê khai nguồn. Đây không phải là nhiệm vụ hay nhất, nhưng sau đây là cách thực hiện:

  1. Chuyển đến thư mục dữ liệu người dùng. Ví dụ trên MacO: ~/Library/Application\ Support/Google/Chrome/Default/Extensions
  2. Liệt kê các ứng dụng và tiện ích đã cài đặt, đồng thời so khớp mã ứng dụng của bạn trên trang quản lý ứng dụng và tiện ích với cùng một mã tại đây.
  3. Chuyển đến thư mục ứng dụng đã cài đặt (đây sẽ là phiên bản trong mã ứng dụng). Mở manifest.json đã cài đặt (pico là một cách nhanh chóng để mở tệp).
  4. Sao chép "khoá" trong manifest.json đã cài đặt rồi dán vào tệp kê khai nguồn của ứng dụng.

Nhận mã ứng dụng OAuth2

Bạn cần đăng ký ứng dụng của mình trong Google APIs Console để nhận mã ứng dụng khách:

  1. Đăng nhập vào Bảng điều khiển API Google bằng chính tài khoản Google đã dùng để tải ứng dụng của bạn lên Cửa hàng Chrome trực tuyến.
  2. Tạo một dự án mới bằng cách mở rộng trình đơn thả xuống ở góc trên cùng bên trái, rồi chọn mục trong trình đơn Create... (Tạo).
  3. Sau khi tạo và đặt tên, hãy chuyển đến mục trong trình đơn điều hướng "Dịch vụ" rồi bật mọi dịch vụ của Google mà ứng dụng của bạn cần.
  4. Chuyển đến mục trong trình đơn điều hướng "API Access" (Quyền truy cập API) rồi nhấp vào nút màu xanh dương Create an OAuth 2.0 client ID... (Tạo mã ứng dụng khách OAuth 2.0...).
  5. Nhập thông tin thương hiệu theo yêu cầu, chọn loại Ứng dụng đã cài đặt.
  6. Chọn Ứng dụng Chrome rồi nhập mã ứng dụng của bạn (cùng một mã hiển thị trên trang quản lý ứng dụng và tiện ích).

Cập nhật tệp kê khai bằng mã ứng dụng khách OAuth2 và phạm vi

Bạn cần cập nhật tệp kê khai để thêm mã ứng dụng khách và phạm vi. Sau đây là mẫu " OAuth2" cho mẫu gdrive:

"oauth2": {
    "client_id": "665859454684.apps.googleusercontent.com",
    "scopes": [
      "https://www.googleapis.com/auth/drive"
    ]
  }

Nhận mã truy cập

Giờ đây, bạn đã sẵn sàng nhận mã thông báo xác thực bằng cách gọi identity.getAuthToken.

chrome.identity.getAuthToken({ 'interactive': true }, function(token) {
  // Use the token.
});

Tương tác của người dùng

Khi gọi getAuthToken, bạn có thể chuyển một cờ ('interactive': true trong ví dụ trên) cho biết bạn muốn gọi API ở chế độ tương tác hay chế độ im lặng. Nếu bạn gọi API ở chế độ tương tác, thì người dùng sẽ thấy giao diện người dùng đăng nhập và/hoặc phê duyệt khi cần, như trong ảnh chụp màn hình dưới đây:

ảnh chụp màn hình cho thấy giao diện người dùng khi một ứng dụng sử dụng Identity API để xác thực Tài khoản Google

Nếu bạn gọi API ở chế độ im lặng, API sẽ chỉ trả về mã thông báo nếu có thể tạo mã mà không hiển thị bất kỳ giao diện người dùng nào. Điều này hữu ích trong các trường hợp khi một ứng dụng đang thực hiện luồng khi khởi động ứng dụng, hoặc nói chung trong trường hợp không có cử chỉ nào của người dùng.

Phương pháp hay nhất là sử dụng chế độ im lặng khi không có cử chỉ của người dùng và sử dụng chế độ tương tác nếu có cử chỉ của người dùng (ví dụ: người dùng đã nhấp vào nút Đăng nhập trong ứng dụng của bạn). Xin lưu ý rằng chúng tôi không thực thi bất kỳ yêu cầu cử chỉ nào.

Chức năng lưu vào bộ nhớ đệm

Chrome có bộ nhớ đệm của mã truy cập trong bộ nhớ đệm, vì vậy, bạn có thể gọi getAuthToken bất cứ khi nào cần sử dụng mã thông báo. Thời gian hết hạn của mã thông báo được bộ nhớ đệm xử lý tự động.

Bạn có thể xem trạng thái hiện tại của bộ nhớ đệm mã thông báo trên chrome://identity-internals.

Có một số trường hợp, chẳng hạn như khi người dùng thay đổi mật khẩu, khi mã truy cập chưa hết hạn sẽ ngừng hoạt động. Các lệnh gọi API sử dụng mã thông báo sẽ bắt đầu quay lại với mã trạng thái HTTP 401. Nếu phát hiện thấy điều này đã xảy ra, bạn có thể xoá mã thông báo không hợp lệ khỏi bộ nhớ đệm của Chrome bằng cách gọi identity.removeCachedAuthToken.

Ví dụ về cách sử dụng removeCachedAuthToken:

// callback = function (error, httpStatus, responseText);
function authenticatedXhr(method, url, callback) {
  var retry = true;
  function getTokenAndXhr() {
    chrome.identity.getAuthToken({/* details */},
                                 function (access_token) {
      if (chrome.runtime.lastError) {
        callback(chrome.runtime.lastError);
        return;
      }

      var xhr = new XMLHttpRequest();
      xhr.open(method, url);
      xhr.setRequestHeader('Authorization',
                           'Bearer ' + access_token);

      xhr.onload = function () {
        if (this.status === 401 && retry) {
          // This status may indicate that the cached
          // access token was invalid. Retry once with
          // a fresh token.
          retry = false;
          chrome.identity.removeCachedAuthToken(
              { 'token': access_token },
              getTokenAndXhr);
          return;
        }

        callback(null, this.status, this.responseText);
      }
    });
  }
}

Xác thực tài khoản không phải là Tài khoản Google

Dưới đây là 3 bước bạn cần hoàn tất:

  1. Hãy đăng ký với nhà cung cấp.
  2. Thêm quyền cho các tài nguyên của nhà cung cấp mà ứng dụng của bạn sẽ truy cập.
  3. Lấy mã thông báo xác thực.

Đăng ký với nhà cung cấp

Bạn cần đăng ký mã ứng dụng khách OAuth2 với nhà cung cấp và định cấu hình mã ứng dụng khách làm trang web. Để nhập URI chuyển hướng trong quá trình đăng ký, hãy sử dụng URL có dạng: https://<extension-id>.chromiumapp.org/<anything-here>

Ví dụ: nếu mã ứng dụng của bạn là abcdefghijklmnopqrstuvwxyzabcdef và bạn muốn provider_cb là đường dẫn, thì để phân biệt mã ứng dụng này với URI chuyển hướng của các nhà cung cấp khác, bạn nên sử dụng: https://abcdefghijklmnopqrstuvwxyzabcdef.chromiumapp.org/provider_cb

Thêm quyền cho nhà cung cấp

Để tạo XHR trên nhiều nguồn gốc cho điểm cuối API của nhà cung cấp, bạn cần đưa các mẫu thích hợp vào danh sách cho phép:

"permissions": [
  ...
  "https://www.website-of-provider-with-user-photos.com/photos/*"
]

Lấy mã thông báo

Cách nhận mã thông báo:

chrome.identity.launchWebAuthFlow(
  {'url': '<url-to-do-auth>', 'interactive': true},
  function(redirect_url) { /* Extract token from redirect_url */ });

<url-to-do-auth> là URL để xác thực trình cung cấp từ một trang web. Ví dụ: giả sử bạn đang thực hiện quy trình OAuth2 với một nhà cung cấp và đã đăng ký ứng dụng của mình với mã ứng dụng khách 123456789012345 và bạn muốn truy cập vào ảnh của người dùng trên trang web của nhà cung cấp đó:https://www.website-of-provider-with-user-photos.com/dialog/oauth?client_id=123456789012345& redirect_uri=https://abcdefghijklmnopqrstuvwxyzabcdef.chromiumapp.org/provider_cb&response_type=token&scope=user_photos

Nhà cung cấp sẽ thực hiện quá trình xác thực và nếu thích hợp, nhà cung cấp sẽ hiển thị giao diện người dùng đăng nhập và/hoặc phê duyệt. Sau đó, trang này sẽ chuyển hướng đến https://abcdefghijklmnopqrstuvwxyzabcdef.chromiumapp.org/provider_cb#authToken=<auth-token>

Chrome sẽ ghi lại thông tin đó và thực hiện lệnh gọi lại ứng dụng bằng URL chuyển hướng đầy đủ. Ứng dụng sẽ trích xuất mã thông báo từ URL.

Chế độ tương tác và chế độ im lặng

Khi gọi launchWebAuthFlow, bạn có thể chuyển một cờ ('interactive': true trong ví dụ trên) cho biết bạn có muốn gọi API ở chế độ tương tác hay không (còn gọi là chế độ im lặng). Nếu bạn gọi API ở chế độ tương tác, thì người dùng sẽ thấy giao diện người dùng (nếu cần) để lấy mã thông báo (giao diện người dùng đăng nhập và/hoặc giao diện người dùng phê duyệt; hoặc đối với trường hợp đó bất kỳ giao diện người dùng cụ thể nào của nhà cung cấp).

Nếu bạn gọi API ở chế độ im lặng, API sẽ chỉ trả về mã thông báo nếu trình cung cấp có thể cung cấp mã thông báo mà không hiển thị bất kỳ giao diện người dùng nào. Ví dụ: điều này hữu ích trong trường hợp một ứng dụng đang thực hiện luồng khi khởi động ứng dụng, hoặc nói chung trong trường hợp không có cử chỉ nào của người dùng.

Phương pháp hay nhất là sử dụng chế độ im lặng khi không có cử chỉ của người dùng và sử dụng chế độ tương tác nếu có cử chỉ của người dùng (ví dụ: người dùng đã nhấp vào nút Đăng nhập trong ứng dụng của bạn). Xin lưu ý rằng chúng tôi không thực thi yêu cầu về cử chỉ.