Tổng quan về thông báo đẩy

Tổng quan về thông báo đẩy là gì, lý do bạn nên sử dụng và cách hoạt động của thông báo đẩy.

Thông báo đẩy là gì?

Thông báo đẩy cho phép bạn thu hút sự chú ý của người dùng người dùng ngay cả khi họ không sử dụng trang web của bạn. Chúng được gọi là đẩy vì bạn có thể "đẩy" thông tin cho người dùng ngay cả khi họ không hoạt động. So sánh Đẩy công nghệ với Pull công nghệ để tìm hiểu khái niệm cụ thể hơn.

Thông báo hiển thị một số phần thông tin nhỏ cho người dùng. Các trang web có thể sử dụng thông báo để cho người dùng biết về các sự kiện hoặc hành động quan trọng, có giới hạn thời gian mà người dùng cần thực hiện. Giao diện của thông báo có sự khác biệt giữa các nền tảng:

Ví dụ về thông báo trên macOS và Android.
Ví dụ về thông báo trên macOS và Android.

Thông báo đẩy và thông báo là hai công nghệ riêng biệt nhưng bổ sung cho nhau. Đẩy là công nghệ gửi thông báo từ máy chủ của bạn đến người dùng ngay cả khi họ không tích cực sử dụng trang web của bạn. Thông báo là công nghệ để hiển thị thông tin được đẩy trên thiết bị của người dùng. Bạn có thể sử dụng không có thông báo đẩy. Một ngày nào đó, bạn cũng có thể sử dụng thông báo đẩy không có thông báo dành cho người dùng (thông báo đẩy im lặng) nhưng trình duyệt hiện không cho phép điều đó. Trong thực tế, chúng thường được sử dụng cùng nhau. Người dùng không có chuyên môn kỹ thuật có thể sẽ không hiểu sự khác biệt giữa phương thức đẩy tin nhắn và thông báo. Trong bộ sưu tập này khi chúng tôi nói thông báo đẩy ở đây nghĩa là sự kết hợp của việc gửi thông báo rồi hiện thông báo dưới dạng thông báo. Khi chúng tôi nói đẩy thông báo thì hiện tại bạn đang đề cập đến chính công nghệ đẩy. Khi chúng tôi đề cập đến thông báo chúng ta đang nói đến công nghệ thông báo.

Tại sao bạn nên dùng thông báo đẩy?

  • Đối với người dùng, thông báo đẩy là một cách để nhận được thông báo kịp thờiphù hợp. và thông tin chính xác.
  • Đối với bạn (chủ sở hữu trang web), thông báo đẩy là một cách giúp tăng lượng người dùng tương tác.

Thông báo đẩy hoạt động như thế nào?

Nhìn chung, các bước chính để triển khai thông báo đẩy là:

  1. Thêm logic ứng dụng để yêu cầu người dùng cấp quyền gửi thông báo đẩy, và sau đó gửi thông tin mã nhận dạng ứng dụng khách đến máy chủ của bạn để lưu trữ trong cơ sở dữ liệu.
  2. Thêm logic máy chủ để đẩy thông báo đến các thiết bị khách.
  3. Thêm logic ứng dụng để nhận thông báo đã được đẩy đến thiết bị rồi hiển thị chúng dưới dạng thông báo.

Phần còn lại của trang này sẽ giải thích chi tiết hơn về các bước này.

Nhận quyền gửi thông báo đẩy

Trước tiên, trang web của bạn cần được người dùng cho phép gửi thông báo đẩy. Hoạt động này sẽ được kích hoạt bằng một cử chỉ của người dùng, chẳng hạn như nhấp vào nút bên cạnh câu lệnh Do you want to receive push notifications?. Sau khi xác nhận, gọi Notification.requestPermission(). Hệ điều hành hoặc trên thiết bị của người dùng sẽ có thể hiển thị một số loại giao diện người dùng để chính thức xác nhận rằng người dùng muốn chọn nhận thông báo đẩy. Giao diện người dùng này khác nhau giữa các nền tảng.

Đăng ký khách hàng nhận thông báo đẩy

Sau khi bạn được cấp quyền, trang web của bạn cần bắt đầu quy trình đăng ký người dùng nhận thông báo đẩy. Việc này được thực hiện thông qua JavaScript, thông qua API đẩy. Bạn cần cung cấp khoá xác thực công khai trong quá trình đăng ký. Bạn sẽ tìm hiểu thêm về việc này sau. Sau bạn bắt đầu quá trình đăng ký, trình duyệt sẽ gửi yêu cầu kết nối mạng sang một dịch vụ web được gọi là dịch vụ đẩy mà bạn cũng sẽ tìm hiểu thêm về dịch vụ này sau.

Giả sử gói thuê bao đã thành công, trình duyệt sẽ trả về một PushSubscription . Bạn cần phải lưu trữ dữ liệu này trong thời gian dài. Thông thường, việc này được thực hiện bằng cách gửi thông tin đến máy chủ mà bạn kiểm soát, sau đó yêu cầu máy chủ lưu trữ mã này trong cơ sở dữ liệu.

Nhận quyền gửi thông báo đẩy. Nhận gói thuê bao đẩy. Gửi
Đẩy đăng ký đến máy chủ của bạn.

Gửi thông báo đẩy

Máy chủ của bạn không thực sự gửi thông báo đẩy trực tiếp đến máy khách. Đáp dịch vụ đẩy sẽ thực hiện việc đó. Dịch vụ đẩy là dịch vụ web do nhà cung cấp trình duyệt của người dùng. Khi bạn muốn gửi thông báo đẩy đến khách hàng mà bạn cần để gửi yêu cầu dịch vụ web đến dịch vụ đẩy. Yêu cầu dịch vụ web mà mà bạn gửi đến dịch vụ đẩy được gọi là yêu cầu giao thức đẩy web. Chiến lược phát hành đĩa đơn Yêu cầu giao thức đẩy web phải bao gồm:

  • Dữ liệu cần đưa vào thông báo.
  • Khách hàng nào sẽ gửi tin nhắn.
  • Hướng dẫn về cách dịch vụ đẩy sẽ gửi thông báo. Ví dụ: bạn có thể chỉ định rằng dịch vụ đẩy nên ngừng tìm cách gửi thông báo sau 10 phút.

Thông thường, bạn đưa ra yêu cầu giao thức đẩy web thông qua một máy chủ mà bạn kiểm soát. Tất nhiên, máy chủ của bạn không nhất thiết phải tạo yêu cầu dịch vụ web thô . Có các thư viện có thể xử lý việc đó cho bạn, chẳng hạn như web-push-libs. Nhưng cơ chế cơ bản là yêu cầu dịch vụ web qua HTTP.

Máy chủ của bạn sẽ gửi yêu cầu giao thức đẩy web đến dịch vụ đẩy và dịch vụ này sẽ gửi thông báo đến thiết bị của người dùng.

Dịch vụ đẩy nhận yêu cầu của bạn, xác thực yêu cầu đó và định tuyến yêu cầu đẩy nhắn tin cho khách hàng thích hợp. Nếu trình duyệt của khách hàng không có kết nối mạng, lệnh đẩy dịch vụ sẽ xếp thông báo đẩy vào hàng đợi cho đến khi trình duyệt hoạt động trực tuyến.

Mỗi trình duyệt sử dụng bất kỳ dịch vụ đẩy nào mà trình duyệt muốn. Bạn trong vai trò nhà phát triển trang web không kiểm soát được việc đó. Đây không phải là vấn đề vì giao thức đẩy web sẽ được chuẩn hoá. Nói cách khác, bạn không cần quan tâm đến việc nhà cung cấp trình duyệt là dịch vụ đẩy nào đang sử dụng. Bạn chỉ cần đảm bảo rằng yêu cầu giao thức đẩy web của mình tuân thủ các thông số kỹ thuật. Thông số kỹ thuật cho biết rằng yêu cầu phải bao gồm một số tiêu đề nhất định và dữ liệu phải được gửi dưới dạng luồng byte.

Tuy nhiên, bạn cần đảm bảo rằng mình đang gửi giao thức đẩy web yêu cầu dịch vụ đẩy chính xác. Dữ liệu PushSubscription mà mà trình duyệt trả về cho bạn trong quá trình đăng ký sẽ cung cấp của bạn. Đối tượng PushSubscription có dạng như sau:

{
  "endpoint": "https://fcm.googleapis.com/fcm/send/c1KrmpTuRm…",
  "expirationTime": null,
  "keys": {
    "p256dh": "BGyyVt9FFV…",
    "auth": "R9sidzkcdf"
  }
}

Về cơ bản, miền của endpoint là dịch vụ đẩy. Đường dẫn của endpoint là thông tin nhận dạng ứng dụng khách giúp dịch vụ đẩy xác định chính xác khách hàng cần đẩy thông báo đến.

keys được dùng để mã hoá, phần tiếp theo sẽ được giải thích.

Mã hoá thông báo đẩy

Dữ liệu mà bạn gửi đến một dịch vụ đẩy phải được mã hoá. Điều này giúp ngăn chặn thì dịch vụ đẩy không thể xem dữ liệu mà bạn đang gửi đến khách hàng. Hãy nhớ rằng nhà cung cấp trình duyệt sẽ quyết định sử dụng dịch vụ đẩy nào và điều đó về mặt lý thuyết thì dịch vụ đẩy có thể không an toàn hoặc không an toàn. Máy chủ của bạn phải sử dụng keys được cung cấp trong PushSubscription để mã hoá giao thức đẩy web yêu cầu.

Ký yêu cầu giao thức đẩy web

Dịch vụ đẩy cung cấp một cách thức để ngăn người khác gửi thư đến doanh nghiệp của bạn người dùng. Về mặt kỹ thuật, bạn không cần phải làm điều này, nhưng cách triển khai dễ dàng nhất trên Chrome cần có tính năng này. Bạn không bắt buộc phải sử dụng trình duyệt này trên Firefox. Các trình duyệt khác có thể yêu cầu trong tương lai.

Quy trình công việc này bao gồm một khoá riêng tư và khoá công khai dành riêng cho bạn . Quá trình xác thực diễn ra đại khái như sau:

  • Bạn sẽ tạo khoá riêng tư và khoá công khai dưới dạng tác vụ một lần. Kết hợp của khoá riêng tư và khoá công khai. khoá máy chủ ứng dụng. Bạn cũng có thể thấy chúng được gọi là VAPID khoá. VAPID mới là thông số xác định quá trình xác thực này.
  • Khi bạn đăng ký cho khách hàng nhận thông báo đẩy từ mã JavaScript của mình, bạn cung cấp khoá công khai của mình. Khi dịch vụ đẩy tạo một endpoint cho thiết bị này, khoá này sẽ liên kết khoá công khai đã cung cấp với endpoint.
  • Khi gửi yêu cầu giao thức đẩy web, bạn ký một số thông tin JSON bằng khoá riêng tư của bạn.
  • Khi nhận được yêu cầu giao thức đẩy web của bạn, dịch vụ đẩy sẽ sử dụng khoá công khai để xác thực thông tin đã ký. Nếu chữ ký hợp lệ thì dịch vụ đẩy biết rằng yêu cầu đến từ một máy chủ có khoá riêng tư phù hợp.

Tuỳ chỉnh cách gửi thông báo đẩy

Quy cách yêu cầu giao thức đẩy web cũng xác định các tham số cho phép bạn tuỳ chỉnh cách dịch vụ đẩy gửi thông báo đẩy đến máy khách. Ví dụ, bạn có thể tuỳ chỉnh:

  • Thời gian tồn tại (TTL) của một thông báo, giúp xác định thời gian mà dịch vụ đẩy sẽ cung cấp cố gắng gửi thư.
  • Tính khẩn cấp của thông báo, hữu ích trong trường hợp dịch vụ đẩy đang duy trì thời lượng pin của máy khách bằng cách chỉ gửi các tin nhắn có mức độ ưu tiên cao.
  • Chủ đề của bài viết, thay thế mọi bài viết đang chờ xử lý của cùng một chủ đề với tin nhắn mới nhất.

Nhận và hiển thị thông báo được đẩy dưới dạng thông báo

Sau khi bạn gửi yêu cầu giao thức đẩy web đến dịch vụ đẩy, dịch vụ đẩy sẽ yêu cầu của bạn đã được đưa vào hàng đợi cho đến khi một trong các sự kiện sau xảy ra:

  1. Khách hàng lên mạng và dịch vụ đẩy đưa ra thông điệp đẩy.
  2. Tin nhắn sẽ hết hạn.

Khi trình duyệt máy khách nhận được thông báo được đẩy, trình duyệt này sẽ giải mã thông báo đẩy dữ liệu và gửi sự kiện push đến dịch vụ của bạn Worker. Trình chạy dịch vụ là về cơ bản là mã JavaScript có thể chạy ở chế độ nền, ngay cả khi trang web của bạn không mở hoặc trình duyệt bị đóng. Trong sự kiện push của trình chạy dịch vụ trình xử lý bạn gọi là ServiceWorkerRegistration.showNotification() để hiển thị thông tin dưới dạng thông báo.

Tin nhắn đến trên thiết bị. Trình duyệt sẽ đánh thức trình chạy dịch vụ. Sự kiện đẩy đã được gửi đi.

Điểm đến tiếp theo

Phòng thí nghiệm lập trình