Esta página explica cómo crear una página de inicio para tu App de Google Chat La página principal de la app es una interfaz de tarjetas personalizable que envía una app de Chat a un usuario cuando este abre un mensaje con la app de Chat.
Por ejemplo, puedes configurar el mensaje de la tarjeta de la página principal de la app para incluir sugerencias para interactuar con App de Chat con comandos de barra. Para los usuarios finales, la página principal de la app es solo disponible en los mensajes directos de una app de Chat desarrollador de apps habilita la función.
Usa Card Builder para diseñar mensajes de tarjetas JSON y obtener una vista previa de ellos para apps de Chat:
Abre el Creador de tarjetasRequisitos previos
Python
- Una cuenta de Google Workspace con acceso a Google Chat.
- Una app de Chat publicada Para crear un App de Chat, mira esto guía de inicio rápido.
- Una app de Google Chat configurada para la interactividad Para ver más información, consulta Configura tu app de Google Chat para recibir eventos de interacción.
Apps Script
- Una cuenta de Google Workspace con acceso a Google Chat.
- Una app de Chat publicada Para crear un App de Chat, sigue esta guía de inicio rápido.
- Una app de Google Chat configurada para la interactividad Para ver más información, consulta Configura tu app de Google Chat para recibir eventos de interacción.
Configurar en la consola de Google Cloud
Python
En la consola de Google Cloud, ve a Menú > Más productos > Google Workspace > Biblioteca de productos > API de Google Chat.
Haz clic en Administrar y, luego, en la pestaña Configuración.
Habilita Support App Home.
Selecciona la casilla de verificación Support App Home.
Agrega una URL en el campo URL de la página principal de la app. Este valor suele ser el mismo de destino como la URL de la aplicación. Esta URL se llama Eventos
APP_HOME.Haz clic en Guardar.
Apps Script
En la consola de Google Cloud, ve a Menú > Más productos > Google Workspace > Biblioteca de productos > API de Google Chat.
Haz clic en Administrar y, luego, en la pestaña Configuración.
Selecciona la casilla de verificación Support App Home.
Haz clic en Guardar.
Configura tu app de Chat
Configura tu app de Chat para la página principal de la app.
Python
Cuando un usuario abre un mensaje directo desde una app de Chat, se
Se envía el evento APP_HOME a tu app de Chat. Cuando un
La app de Chat recibe este evento, una instancia JSON de
RenderActions
se muestra con la navegación pushCard.
@app.route('/', methods=['POST'])
def on_event():
event = request.get_json()
chat = event.get('chat')
if chat is not None:
return handle_chat_event(event)
def handle_chat_event(event):
if event['chat'].get('type') == 'APP_HOME':
return get_app_home_card()
def get_app_home_card():
return {
"action": {
"navigations": [
{
"pushCard": {
"sections": [
{
"widgets": [
{
"buttonList": {
"buttons": [
{
"text": "Open documentation",
"onClick": {
"openLink": {
"url": "https://developers.google.com/chat"
}
}
}
]
}
}
]
}
]
}
}
]
}
}
Apps Script
En este ejemplo, se envía un mensaje de tarjeta mostrando JSON de la tarjeta. También puedes usar Servicio de tarjetas de Apps Script.
Implementa una función onAppHome para mostrar una instancia JSON de
RenderActions
con navegación pushCard:
// "onAppHome" is the pre-defined name of the callback that the Chat servers
// execute.
function onAppHome() {
return {
action: {
navigations: [
{
pushCard: getCard()
}
]
}
};
}
function getCard() {
return {
sections: [
{
widgets: [
{
buttonList: {
buttons: [
{
text: "Open documentation",
onClick: {
openLink: {
url: "https://developers.google.com/chat"
}
}
}
]
}
}
]
}
]
};
}
Cómo actualizar la tarjeta de la página principal de una app
La tarjeta de la página principal de la app se puede actualizar cuando un usuario envía información o cierra
. Por ejemplo, la tarjeta inicial de la página principal de la app contiene un mensaje de bienvenida que
le pide a un usuario que complete un formulario con información. Una vez que el usuario completa el
se actualizará la tarjeta de la página principal de la app. La actualización se debe mostrar con una instancia
de RenderActions
que contiene una navegación updateCard.
Python
En el caso de las apps HTTP, actualizar la tarjeta de la página principal de la app es similar a lo siguiente:
Procesar la información ingresada por los usuarios,
pero debes mostrar RenderActions. invokedFunction representa el nombre de
la función invocada asociada con el widget Card. Para obtener más información,
ver
CommonEventObject
En el siguiente ejemplo,
submitForm
muestra que el usuario envió un formulario
datos:
@app.route('/', methods=['POST'])
def on_event():
event = request.get_json()
chat = event.get('chat')
if chat is not None:
return handle_chat_event(event)
def handle_chat_event(event):
if event['chat'].get('type') == 'SUBMIT_FORM':
event_object = event.get('commonEventObject')
if event_object is not None:
// Forms
if 'submitForm' == event_object.get('invokedFunction'):
return {
'render_actions': {
'action': {
'navigations': [{
'updateCard': get_update_card()
}]
}
}
}
def get_update_card():
return {
"action": {
"navigations": [{
"pushCard": {
"sections": [{
"widgets": [{
"buttonList": {
"buttons": [{
"text": "Open documentation",
"onClick": {
"openLink": {
"url": "https://developers.google.com/chat"
}
},
}]
}
}]
}]
}
}]
}
}
Apps Script
En este ejemplo, se envía un mensaje de tarjeta mostrando JSON de la tarjeta. También puedes usar Servicio de tarjetas de Apps Script.
// Called from elsewhere (i.e. on button press).
function updateAppHomeCard(event) {
return {
render_actions: {
action: {
navigations: [
{
updateCard: getCard()
}
]
}
}
}
}
function getCard() {
return {
sections: [
{
widgets: [
{
buttonList: {
buttons: [
{
text: "Open documentation",
onClick: {
openLink: {
url: "https://developers.google.com/chat"
}
}
}
]
}
}
]
}
]
};
}
Limitaciones
En general,
navigation es
no disponible para apps de Chat. No puedes devolver una pila de tarjetas.
Solo se permite el uso de pushCard (para la respuesta inicial) y updateCard (para las actualizaciones)
disponibles para las apps de Chat.
Temas relacionados
Para abrir un diálogo, usa la interacción
OPEN_DIALOG. Para obtener más información, ver Abre un diálogo en respuesta a una tarjeta de la página principal de la app.Si quieres cerrar un diálogo, usa la interacción
CLOSE_DIALOG. y vuelve a la tarjeta de la página principal de la app, o bien usaCLOSE_DIALOG_EXECUTEinteracción para cerrar el diálogo y actualizar la tarjeta de la página principal de la app. Para más información, consulta Cómo responder a un diálogo de la tarjeta de la página principal de la app.Para ver un ejemplo de cómo usar la página principal de la app, consulta la app de Chat de administración de problemas en el codelab Compila apps para Google Chat con Gemini.