I. Introduction▲
ONLYOFFICE DocSpace est une plateforme cloud collaborative qui permet aux utilisateurs de modifier et d’éditer des documents texte, des feuilles de calcul, des présentations et des formulaires dans des salles personnalisables. La solution dispose des fonctions de sécurité et des outils de collaboration avancés. Dans ce tutoriel, nous allons vous montrer comment intégrer une salle de DocSpace dans une application à page unique (SPA) en utilisant GitHub Pages comme exemple.
II. Qu’est-ce que c’est qu’une salle de DocSpace ?▲
La collaboration dans DocSpace est organisée dans des salles — des espaces sécurisés inaccessibles aux personnes sans invitation. Pour créer une nouvelle salle, il vous faut posséder des droits d’administrateur (rôle d’administrateur de salle).
L’administrateur est capable d’autoriser l’accès à la salle aux autres avec des droits d’accès : lecteur, commentateur, réviseur, remplisseur de formulaires, éditeur, utilisateur avancé.
Après avoir créé une salle DocSpace, il est possible d’y ajouter de nouveaux fichiers bureautiques ou télécharger des documents texte, des feuilles de calcul, des présentations et des formulaires à remplir.
|
|
III. Pourquoi intégrer ONLYOFFICE DocSpace ?▲
Que vous utilisiez la version cloud ou la version serveur, DocSpace vous offre un large éventail d’options de personnalisation, ce qui vous permet d’améliorer la fonctionnalité de vos applications web et de les adapter précisément à vos besoins.
ONLYOFFICE DocSpace redéfinit les flux de documents, en combinant des fonctionnalités collaboratives complètes avec des solutions de stockage robustes. Il donne un coup de main aux développeurs qui cherchent à améliorer les fonctions de collaboration et de stockage de leurs produits, ce qui en fait un choix idéal pour les applications de CRM, de PMS, de messagerie, etc.
Ce tutoriel présente une façon d’intégrer sans effort la version cloud dans une application à page unique (SPA). Ce processus est remarquablement simple et élimine le besoin d’une installation locale de ONLYOFFICE DocSpace.
IV. Création d’un compte DocSpace▲
Tout d’abord, il faut avoir une instance d’ONLYOFFICE DocSpace autohébergée ou un compte DocSpace en ligne.
IV-A. Version autohébergée▲
Vous pouvez installer ONLYOFFICE DocSpace sur vos serveurs privés sur Linux ou Windows. Il est possible d’opter pour une version communautaire gratuite ou une version pour les entreprises.
Suivez les guides complets pour accomplir l’installation pour votre option choisie.
IV-B. Version en cloud▲
Autrement, il est possible de créer un compte en ligne pour éviter des soucis avec l’installation et la configuration. Créez un compte DocSpace et choisissez votre plan tarifaire : Startup gratuit ou un abonnement Business. La création du compte est disponible via le site web officiel.
Sur la page d’inscription, remplissez tous les champs et cliquez sur le bouton Commencer ci-dessous.
|
|
V. Intégration d’une salle DocSpace▲
La fonctionnalité polyvalente de DocSpace vous permet d’intégrer soit l’ensemble de l’application, soit des salles et des dossiers particuliers.
Pour intégrer une salle, cliquez sur les trois points à côté de votre nom et accédez aux paramètres sur votre écran d’accueil DocSpace.
|
|
Dans l’onglet de droite, choisissez l’option Developer Tools.
|
|
Ensuite, allez sur le SDK JavaScript et faites défiler la page jusqu’à la section Créer un exemple d’intégration dans DocSpace.
Ici, vous pouvez configurer la largeur et la hauteur de l’iframe, choisir les éléments d’interface à afficher et modifier les paramètres d’affichage avancés. Pour afficher une salle spécifique, allez dans les paramètres d‘affichage des données et faites votre sélection dans la liste des salles créées :
|
|
Passez à l’onglet Code à insérer et copiez l’extrait de code généré :
|
|
Insérez l’extrait de code généré dans le fichier index.html de votre site web.
Retournez à la page de DocSpace Developer Tools et faites défiler jusqu’à la section Intégrer DocSpace en tant qu’iframe. Collez le lien vers votre site web et appuyez sur l’icône +. Le lien apparaîtra sous le champ de saisie :
|
|
Maintenant, vous pouvez améliorer la collaboration documentaire en toute simplicité dans votre application web.