He incrustado una presentación de Google dentro de mi aplicación web, usando iframe.
<iframe src="https://docs.google.com/presentation/..." />
Y eso funciona y es genial, pero estoy tratando de programar (con JavaScript) para presionar siguiente (cuando necesito ir a la siguiente diapositiva). Quiero poder controlar cuándo se llama a la siguiente según mi lógica.
Al principio traté de hacer eso usando:
let iframe = document.querySelector("iframe") let iframeDoc = iframe.contentDocument || iframe.contentWindow.document; // get the next button's div iframeDoc.querySelector(".punch-viewer-navbar-next").click()
Pero falló al let iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
porque iframe le impide acceder al contenido usando JS si es de otro dominio (supongo que eso es lo que sucede en las nuevas versiones de Chrome)
Así que envié mi sitio y docs.google detrás de algún puerto y luego hice un iframe diferente
<iframe src="https://localhost:7777/presentation/..." />
Por lo tanto, no tengo problemas para ejecutar el código anterior, pero no tiene ningún efecto, no veo el resultado.
Supongo que puedo continuar y entender por qué div dentro de iframe click no funciona (probablemente un problema de seguridad), pero esto ya suena como una solución demasiado engorrosa para lo que necesito.
¿Conoce alguna API o algo que ofrezca la presentación de Google para ayudarlo a hacer un siguiente simple programáticamente?
No he visto nada parecido a una API, pero puede agregar el número de página en la URL que solicita para obtener una diapositiva específica, por ejemplo, https://docs.google.com/presentation/.../embed#slide= 9 mostrará la novena diapositiva. Entonces puede cambiar el iframe src usando javascript.
Advertencia: vuelve a descargar toda la presentación de diapositivas cada vez que cambia esto, por lo que si puede encontrar otra forma de hacerlo, probablemente sea mejor.
Desafortunadamente, no veo una forma de obtener comentarios del iframe en el que se muestra la diapositiva actualmente, por lo que sugeriría ocultar los controles con rm=minimal ( https://docs.google.com/presentation/.../embed ?rm=minimal#slide=9 ) y colocar una máscara sobre el iframe para evitar que el usuario cambie la diapositiva fuera de su control.
Editar: también puede verificar esto: https://developers.google.com/slides
si el siguiente botón está dentro de la presentación, puede establecer una condición dentro de setOnClickAction, consulte los documentos a continuación, tiene una amplia gama de métodos y eventos como js google AppScript
Puedes consultar la API REST oficial que Google Presentations te ofrece en: https://developers.google.com/slides/api/reference/rest
La desventaja es la necesidad de realizar solicitudes autenticadas.