Quảng bá tiện ích bổ sung với người dùng thông qua tính năng chia sẻ màn hình

Quảng bá tiện ích bổ sung thông qua tính năng chia sẻ màn hình.

Trang này mô tả cách quảng bá tiện ích bổ sung cho người dùng trong khi chia sẻ màn hình một thẻ bằng Google Meet bằng cách đặt một lượng nhỏ mã trên một trang web khác.

Phương thức exposeToMeetWhenScreensharing() cho phép trang web gửi thông tin đến Meet khi thẻ của trang web được chia sẻ màn hình. Thông tin này được dùng trong trải nghiệm tiện ích bổ sung với Meet khi người dùng nhấp vào "Bắt đầu hoạt động" trên biểu ngữ trình bày nếu họ đã cài đặt tiện ích bổ sung. Nếu người dùng chưa cài đặt tiện ích bổ sung khi chia sẻ màn hình một thẻ, họ sẽ được nhắc cài đặt tiện ích bổ sung.

Đối tượng AddonScreenshareInfo chứa 5 thuộc tính có thể được thêm dựa trên trường hợp sử dụng:

  • additionalData: Thông tin mà tiện ích bổ sung có thể sử dụng để tự khởi chạy. Chỉ có thể đặt nếu thuộc tính startActivityOnOpen là true và có thể truy cập bằng ActivityStartingState. Để biết thêm thông tin, hãy xem phần Nhận trạng thái bắt đầu hoạt động.

  • cloudProjectNumber: Bắt buộc. Số dự án của dự án Google Cloud.

  • mainStageUrl: URL mà giai đoạn chính mở ra sau khi tiện ích bổ sung khởi động, chẳng hạn như https://www.example.com. URL phải có cùng nguồn gốc với các URL được chỉ định trong tệp kê khai tiện ích bổ sung.

  • sidePanelUrl: URL mà bảng điều khiển bên mở ra sau khi tiện ích bổ sung khởi động, chẳng hạn như https://www.example.com. URL phải thuộc cùng một nguồn gốc với các URL được chỉ định trong tệp kê khai tiện ích bổ sung.

  • startActivityOnOpen: Bắt buộc. Liệu có bắt đầu trải nghiệm tiện ích bổ sung hoạt động trong Meet ngay khi người dùng bắt đầu tiện ích bổ sung từ biểu ngữ trình bày hay không. Giá trị này phải là true nếu bạn sử dụng thuộc tính mainStageUrl.

Cài đặt và nhập SDK

Bạn có thể truy cập vào SDK bằng npm hoặc bằng gstatic.

Nếu dự án của bạn sử dụng npm, bạn có thể làm theo hướng dẫn cho gói npm SDK của tiện ích bổ sung Meet.

Trước tiên, hãy cài đặt gói npm:

npm install @googleworkspace/meet-addons

Sau đó, bạn có thể sử dụng SDK Tiện ích bổ sung của Meet bằng cách nhập giao diện MeetAddonScreenshareExport:

import {meet} from '@googleworkspace/meet-addons/meet.addons.screenshare';

Đối với người dùng TypeScript, các định nghĩa TypeScript được đóng gói cùng với mô-đun.

tĩnh

SDK Tiện ích của Google Meet có sẵn dưới dạng gói JavaScript từ gstatic, một miền phân phát nội dung tĩnh.

Để sử dụng SDK tiện ích bổ sung cho Meet, hãy thêm thẻ tập lệnh sau vào ứng dụng của bạn:

<script src="https://www.gstatic.com/meetjs/addons/1.1.0/meet.addons.screenshare.js"></script>

Bạn có thể sử dụng SDK Tiện ích bổ sung của Meet thông qua giao diện MeetAddon trong window.meet.addon.

Ví dụ: Tải trong bảng điều khiển bên mà không cần bắt đầu một hoạt động

Trong mã mẫu sau, màn hình người dùng chia sẻ một trang với một tiện ích bổ sung phải điều chỉnh quyền truy cập vào tài nguyên trước khi có thể bắt đầu hoạt động. Do yêu cầu này, bạn nên bắt đầu tiện ích bổ sung trong bảng điều khiển bên mà không cần bắt đầu hoạt động cho mọi người.

<script>
meet.addon.screensharing.exposeToMeetWhenScreensharing(
  {
    cloudProjectNumber: CLOUD_PROJECT_NUMBER,
    startActivityOnOpen: false,
    sidePanelUrl: SIDE_PANEL_URL,
  }
);
</script>

Thay thế nội dung sau:

  • CLOUD_PROJECT_NUMBER: Chuỗi. Số dự án của dự án trên Google Cloud.
  • SIDE_PANEL_URL: Chuỗi. URL của bảng điều khiển bên.

Khi người dùng trong màn hình cuộc gọi Meet chia sẻ trang, họ sẽ thấy một biểu ngữ trình bày trong Meet. Khi nhấp vào nút trên biểu ngữ, tiện ích bổ sung cho số dự án trên đám mây cụ thể sẽ mở ra trong bảng điều khiển bên. Vì thuộc tính startActivityOnOpen được đặt thành false, nên nút bắt đầu hoạt động sẽ bị tắt cho đến khi bạn đặt ActivityStartingState. Để biết thêm thông tin, hãy xem phần Sử dụng trạng thái bắt đầu hoạt động.

Sau khi hoạt động này bắt đầu, những người dùng khác trong cuộc gọi sẽ được nhắc chạy hoặc cài đặt tiện ích bổ sung.

Tiện ích bổ sung mẫu"Ảnh động" trên GitHub bao gồm ví dụ này trong một tiện ích bổ sung đầy đủ. Khi hiển thị trang chỉ mục của ứng dụng web liên kết với tiện ích bổ sung, người dùng trình bày sẽ được nhắc cài đặt hoặc thiết lập tiện ích bổ sung.

Ví dụ: Tải trong giai đoạn chính

Trong mã mẫu sau đây, một người dùng chia sẻ màn hình một trang web trong Meet chứa mã sau đây sẽ được nhắc chạy tiện ích bổ sung:

<script>
meet.addon.screensharing.exposeToMeetWhenScreensharing(
  {
    cloudProjectNumber: CLOUD_PROJECT_NUMBER,
    startActivityOnOpen: true,
    mainStageUrl: MAIN_STAGE_URL,
    additionalData: "{\"selected_item\": \"42\"}",
  }
);
</script>

Thay thế nội dung sau:

  • CLOUD_PROJECT_NUMBER: Chuỗi. Số dự án của dự án Google Cloud.
  • MAIN_STAGE_URL: Chuỗi. URL cho giai đoạn chính.

Khi người dùng trong màn hình cuộc gọi Meet chia sẻ trang, họ sẽ thấy một biểu ngữ trình bày trong Meet. Khi nhấp vào nút trên biểu ngữ, tiện ích bổ sung cho số dự án trên đám mây đã cho sẽ mở ra trong màn hình chính. Thuộc tính mainStageUrl được tải và thuộc tính additionalData dùng để đặt trạng thái bắt đầu hoạt động của tiện ích bổ sung. Những người dùng khác trong cuộc gọi sẽ được nhắc ngay để cài đặt hoặc chạy tiện ích bổ sung.

Ví dụ: Tải trong bảng điều khiển bên

Trong mã mẫu sau, màn hình người dùng chia sẻ một trang với một tiện ích bổ sung muốn bắt đầu trong bảng điều khiển bên thay vì trên sân khấu chính:

<script>
meet.addon.screensharing.exposeToMeetWhenScreensharing(
  {
    cloudProjectNumber: CLOUD_PROJECT_NUMBER,
    startActivityOnOpen: true,
    sidePanelUrl: SIDE_PANEL_URL,
    additionalData: "{\"selected_item\": \"42\"}",
  }
);
</script>

Thay thế nội dung sau:

  • CLOUD_PROJECT_NUMBER: Chuỗi. Số dự án của dự án trên Google Cloud.
  • SIDE_PANEL_URL: Chuỗi. URL của bảng điều khiển bên.

Khi người dùng trong màn hình cuộc gọi Meet chia sẻ trang, họ sẽ thấy một biểu ngữ trình bày trong Meet. Khi nhấp vào nút trên biểu ngữ, tiện ích bổ sung cho số dự án trên đám mây cụ thể sẽ mở ra trong bảng điều khiển bên. Thuộc tính sidePanelUrl được tải và thuộc tính additionalData dùng để đặt trạng thái bắt đầu hoạt động của tiện ích bổ sung. Những người dùng khác trong cuộc gọi sẽ được nhắc ngay để cài đặt hoặc chạy tiện ích bổ sung.

So khớp nguồn gốc

Nguồn gốc được cung cấp trong thuộc tính mainStageUrl và thuộc tính sidePanelUrl được so sánh với nguồn gốc trong tệp kê khai tiện ích bổ sung của số dự án trên đám mây được cung cấp. Nếu mọi thông tin đều khớp, người dùng sẽ được phép chạy tiện ích bổ sung.

Ngoài ra, nguồn gốc của trang web bắt đầu tính năng chia sẻ màn hình phải được liệt kê trong trường addOnOrigins của tệp kê khai tiện ích bổ sung.

Để biết thêm thông tin, hãy xem phần Bảo mật của tiện ích bổ sung.