Compartir pantalla para promocionar un complemento entre los usuarios

Promocionar un complemento a través de la función de pantalla compartida

En esta página, se describe cómo promocionar un complemento entre los usuarios mientras compartes la pantalla de una pestaña con Google Meet colocando una pequeña cantidad de código en otra página web.

El método exposeToMeetWhenScreensharing() permite que el sitio envíe información a Meet cuando se comparte la pantalla de su pestaña. Esta información se usa en la experiencia del complemento con Meet cuando el usuario hace clic en "Iniciar actividad" en el banner de presentación si tiene instalado el complemento. Si el usuario no tiene el complemento instalado cuando comparten la pantalla de una pestaña, están que se te solicite instalar el complemento.

El AddonScreenshareInfo contiene cinco propiedades que se pueden agregar según el caso de uso:

  • additionalData: Información que el complemento puede usar para inicializarse. Solo se puede establecer si la propiedad startActivityOnOpen es verdadera y se puede acceder a ella con ActivityStartingState. Para obtener más información, consulta Cómo iniciar la actividad. estado.

  • cloudProjectNumber: Obligatorio. El número de tu proyecto de Google Cloud.

  • mainStageUrl: La URL que abre la etapa principal una vez que se agrega el complemento de inicio de sesión, como https://www.example.com. La URL debe pertenecer a la misma origin como las URLs especificadas en el del complemento.

  • sidePanelUrl: Es la URL que abre el panel lateral una vez que se inicia el complemento, como https://www.example.com. La URL debe pertenecer a la misma origin como las URLs especificadas en el del complemento.

  • startActivityOnOpen: Obligatorio. Indica si se debe iniciar la experiencia del complemento de actividad en Meet de inmediato cuando el usuario inicia el complemento desde el banner de presentación. Debe ser verdadero si se usa la propiedad mainStageUrl.

Instalar e importar el SDK

Puedes acceder al SDK con npm o gstatic.

Si tu proyecto usa npm, puedes seguir las instrucciones del paquete npm del SDK de Meet Add-ons.

Primero, instala el paquete npm:

npm install @googleworkspace/meet-addons

Luego, el SDK de complementos de Meet estará disponible si importas la interfaz MeetAddonScreenshareExport:

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

En el caso de los usuarios de TypeScript, las definiciones de TypeScript se empaquetan con el módulo.

gstatic

El SDK de complementos de Google Meet está disponible como Paquete de JavaScript de gstatic, un dominio que entrega contenido estático.

Para usar el SDK de complementos de Meet, agrega la siguiente etiqueta de secuencia de comandos a tu app:

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

El SDK de complementos de Meet está disponible a través de la interfaz MeetAddon en window.meet.addon.

Ejemplo: Carga en el panel lateral sin iniciar una actividad

En el siguiente ejemplo de código, una pantalla del usuario comparte una página con un complemento que debe ajustar los permisos de recursos antes de que se pueda iniciar la actividad. Debido a este requisito, el complemento se debe iniciar en el panel lateral, sin que se inicie la actividad para todos.

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

Reemplaza lo siguiente:

  • CLOUD_PROJECT_NUMBER: Cadena. El número de proyecto de tu Cloud.
  • SIDE_PANEL_URL: Es una cadena. Es la URL del panel lateral.

Cuando el usuario de la pantalla de llamada de Meet comparte la página, ve un banner de presentación en Meet. Si haces clic en el botón del banner, se abrirá el complemento del número de proyecto de Cloud en el panel lateral. Ya que el startActivityOnOpen se configuró como false, el botón de inicio de actividad se inhabilitará hasta que la Se estableció ActivityStartingState. Para obtener más información, consulta Cómo usar la actividad estado inicial.

Una vez que se inicia la actividad, se les indica a los demás usuarios de la llamada que hagan lo siguiente: iniciar o instalar el complemento.

El complemento de ejemplo "Animation" en GitHub incluye este ejemplo como parte de un complemento completo. Cuando se presenta la página de índice de la app web asociada con el complemento, se le solicita al usuario que lo instale o configure.

Ejemplo: Carga en el escenario principal

En la siguiente muestra de código, se le solicita al usuario que comparte la pantalla de una página web en Meet que contiene el siguiente código que inicie el complemento:

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

Reemplaza lo siguiente:

  • CLOUD_PROJECT_NUMBER: Es una cadena. El número de proyecto de tu proyecto de Google Cloud.
  • MAIN_STAGE_URL: Cadena. Es la URL del escenario principal.

Cuando el usuario en la pantalla de la llamada de Meet comparte la página, ve un mensaje de de la presentación en Meet. Si haces clic en el botón del banner, se abrirá el complemento del número de proyecto de Cloud determinado en el escenario principal. Se carga la propiedad mainStageUrl, y la Se usa la propiedad additionalData para establecer la actividad que se iniciará estado del complemento. A los demás usuarios de la llamada se les solicita de inmediato que instalen o inicien el complemento.

Ejemplo: Cárgalo en el panel lateral

En la siguiente muestra de código, la pantalla de un usuario comparte una página con un un complemento que quiere comenzar en el panel lateral en lugar de que en la etapa principal:

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

Reemplaza lo siguiente:

  • CLOUD_PROJECT_NUMBER: Cadena. El número de proyecto de tu Cloud.
  • SIDE_PANEL_URL: Es una cadena. Es la URL del panel lateral.

Cuando el usuario en la pantalla de la llamada de Meet comparte la página, ve un mensaje de de la presentación en Meet. Si haces clic en el botón del banner, se abrirá el complemento del número de proyecto de Cloud en el panel lateral. Se carga la propiedad sidePanelUrl y se usa la propiedad additionalData para establecer el estado de inicio de la actividad del complemento. A los demás usuarios de la llamada se les solicita de inmediato que instalen o inicien el complemento.

Coincidencia de origen

Los origenes proporcionados en la propiedad mainStageUrl y la propiedad sidePanelUrl se comparan con los orígenes del manifiesto del complemento del número de proyecto de Cloud proporcionado. Si todo coincide, el usuario tiene permitido iniciar el complemento.

Además, el origen del sitio que inicia la función de compartir pantalla debe aparecer en el campo addOnOrigins del manifiesto del complemento.

Para obtener más información, consulta Seguridad de los complementos.