Cómo integrar ONLYOFFICE DocSpace en una aplicación de página única
En la primavera de 2023 lanzamos ONLYOFFICE DocSpace, una plataforma de trabajo colaborativo diseñada para mejorar la colaboración en documentos con clientes, socios y terceros. Con salas personalizables y funciones de seguridad avanzadas, esta innovadora solución revoluciona la forma de colaborar en documentos. En esta entrada del blog mostramos cómo integrar DocSpace fácilmente en una aplicación de página única (SPA) utilizando GitHub Pages como ejemplo.
Razones para integrar DocSpace
Tanto si utilizas la versión en la nube como la de servidor, DocSpace te ofrece una amplia gama de opciones de personalización, que te permiten mejorar la funcionalidad de tus aplicaciones web y adaptarlas con precisión a tus necesidades:
- Colabora en los contenidos sin problemas utilizando los editores y visualizadores colaborativos.
- Crea y personaliza salas para distintos fines.
- Integra secciones, salas o carpetas específicas de DocSpace en tu aplicación web.
- Disfruta de las sólidas funciones de seguridad, incluido el cifrado AES-256, la autorización JWT, 2FA y mucho más.
- Mejora tu productividad gracias a la perfecta integración con OpenAI.
ONLYOFFICE DocSpace redefine los flujos de trabajo documentales, combinando una amplia funcionalidad de colaboración con sólidas soluciones de almacenamiento. Ayuda a los desarrolladores que desean mejorar las funciones de colaboración y almacenamiento de sus productos, por lo que es una opción ideal para aplicaciones de CRM, PMS, mensajería, etc.
DocSpace tiene la flexibilidad de funcionar en la nube o desplegarse localmente en un servidor, lo que permite un ajuste y una personalización precisos.
En nuestros próximos artículos, profundizaremos en las posibilidades de integración nativa con la versión de servidor. Sin embargo, hoy nos centraremos en la integración sin esfuerzo de la versión en la nube en una aplicación de página única (SPA). Este proceso es muy sencillo y elimina la necesidad de instalar ONLYOFFICE DocSpace localmente.
Creación de una cuenta de DocSpace
Crea una cuenta de DocSpace y elige tu plan. La solución DocSpace ofrece tanto un plan gratuito Startup como una suscripción Business.
Incrustación de DocSpace
La versátil funcionalidad de DocSpace te permite incrustar toda la aplicación o salas y carpetas específicas. Incrustar toda la instancia de DocSpace es un proceso muy sencillo, que se consigue con unos pocos clics:
- En la pantalla de inicio de DocSpace, haz clic en los tres puntos junto a tu nombre y ve a Configuración de DocSpace:
- En la pestaña derecha, selecciona la opción Herramientas de desarrollo:
- Ve a JavaScript SDK y desplázate hasta la sección Crear ejemplo de incrustación de DocSpace:
Aquí puedes personalizar las opciones de visualización: Anchura, Altura, Elementos de la interfaz, Configuración de la visualización de datos y Configuración avanzada de la visualización.
- Accede a Código para insertar y copia el fragmento de código generado:
- Inserta el fragmento de código generado en el archivo index.html de tu sitio web.
- Vuelve a la página Herramientas de desarrollo de DocSpace y desplázate hasta la sección Incrustar DocSpace como iframe. Pega el enlace a tu sitio web y pulsa el icono +. El enlace aparecerá debajo del cuadro de entrada:
- Accede a tu sitio web:
Incrustación de una sala específica
Para incrustar una sala concreta, sigue estos pasos:
- Vuelve a la sección Herramientas de desarrollo en la configuración de DocSpace.
- Accede a JavaScript SDK y desplázate hasta la sección Crear ejemplo de incrustación de DocSpace. Aquí puedes configurar la anchura y la altura del iframe, elegir qué elementos de la interfaz mostrar y modificar los ajustes avanzados de visualización. Para mostrar una sala específica, ve a la configuración Visualización de datos y haz tu selección de la lista de las salas creadas:
- Accede a Código para insertar y copia el fragmento de código generado:
- Inserta el fragmento de código generado en el archivo index.html de tu sitio web:
Incrustación de DocSpace en GitHub Pages
- Inicia sesión en tu GitHub.
- En tu cuenta de GitHub, crea un nuevo repositorio con tu nombre de usuario seguido de .github.io.
- Ve a tu repositorio de GitHub, crea un nuevo archivo index.html, pega el fragmento de código del Javascript SDK de DocSpace y, a continuación, confirma los cambios.
- Despliega tu repositorio como páginas de GitHub.
- Vuelve a la página Herramientas de desarrollo de DocSpace y desplázate hasta la sección Incrustar DocSpace como iframe. Inserta el enlace a tu dominio de GitHub donde está alojado tu sitio web y haz clic en el icono +. Asegúrate de que el enlace sigue este formato: tuNombreGitHub.github.io. Verás el enlace debajo del cuadro de entrada.
- Accede a tu sitio web.
Esperamos que esta entrada del blog haya mostrado cómo ONLYOFFICE DocSpace mejora la colaboración hasta un nuevo nivel y se integra perfectamente en tus procesos de trabajo. Con sus capacidades, puedes mejorar la colaboración en documentos con facilidad.
Mantente atento a nuestros próximos artículos, donde exploraremos niveles más profundos de integración con la versión de servidor. Pensamos que esta información te ayudará a sacar el máximo partido de DocSpace para tus necesidades de trabajo colaborativo. Te deseamos mucha suerte en tus esfuerzos exploratorios.
