Zum Hauptinhalt springen

Ihren Workspace einbetten

Sie können ONLYOFFICE Apps oder Teile davon in Ihre eigene Webanwendung integrieren, sodass Benutzer Dokumente direkt von Ihrer Website aus erstellen und übermitteln können.

Verwenden Sie zu diesem Zweck das auf JavaScript basierende ONLYOFFICE Apps SDK, das es Entwicklern ermöglicht, alle Funktionen von ONLYOFFICE Apps mit api.js zu nutzen.

Um den gesamten Workspace, einen bestimmten Raum oder einen Ordner in Ihre Website einzubetten,

  1. Öffnen Sie den Abschnitt Entwicklertools, indem Sie auf den Link Entwicklertools klicken, der im linken Bereich in jedem Abschnitt (Dateien, Räume) verfügbar ist.

    hinweis

    Standardmäßig ist der Zugriff auf den Bereich Entwicklertools für alle Benutzer außer Gästen aktiviert, sodass jeder Benutzer auf diese Seite zugreifen und dementsprechend eigene Integrationen erstellen kann.

  2. Gehen Sie in den Entwicklertools zum Abschnitt Embed SDK.

  3. Gehen Sie auf der Seite Embed SDK zum Abschnitt Die zulässigen Domänen für diesen Workspace hinzufügen, geben Sie die Adresse des Dienstes ein, in dem Sie den Workspace einbetten oder verbinden möchten, und drücken Sie das + Symbol. Geben Sie nur den Domainnamen ohne URL-Pfade oder zusätzliche Zeichen an. Die hinzugefügten Domains werden unter dem Feld aufgelistet und können jeweils durch Klicken auf das Symbol x entfernt werden.

    hinweis

    Wenn Sie die Serverversion verwenden, müssen Sie zunächst Ihren Workspace auf HTTPS umstellen. Folgen Sie dazu unseren Anweisungen im Abschnitt Installation.

    Entwicklertools

  4. Wählen Sie im Abschnitt Einen Modus zum Einbetten Ihres Workspace wählen einen der vorgeschlagenen Modi aus: Apps, Öffentlicher Raum, Editor, Viewer, Raumauswahl, Dateiauswahl, Benutzerdefiniert, Uploader.

    • Apps – betten Sie den gesamten Workspace ein, um Benutzern die Interaktion mit allen Räumen, Dateien und Einstellungen zu ermöglichen.
    • Öffentlicher Raum – integrieren Sie einen öffentlichen Raum, um Benutzern ohne Registrierung das Anzeigen, Bearbeiten, Kommentieren oder Überprüfen aller dort gespeicherten Dokumente zu ermöglichen.
    • Editor – betten Sie einen Editor ein, damit Benutzer eine Datei aus dem entsprechenden Raum bearbeiten können.
    • Viewer – betten Sie einen Viewer ein, damit Benutzer eine Datei zum Anzeigen aus dem entsprechenden Raum öffnen können.
    • Raumauswahl – betten Sie eine Raumauswahl ein, um Benutzern den Zugriff auf jeden beliebigen Raum aus der Liste der verfügbaren Räume zu ermöglichen. Sie können alle Raumtypen einbetten oder die gewünschten im Menü Erweiterte Anzeigeeinstellungen -> Raumtyp-Anzeige auswählen. Wählen Sie die gewünschte Option: Alle Typen, Öffentlicher Raum, Zusammenarbeitsraum, Virtueller Datenraum, Benutzerdefinierter Raum.
    • Dateiauswahl – betten Sie eine Dateiauswahl ein, um Benutzern den Zugriff auf jede Datei aus der Liste der verfügbaren Dateien zu ermöglichen.
    • Benutzerdefiniert – konfigurieren Sie die Parameter zum Einbetten Ihres Workspace manuell.
    • Uploader – betten Sie einen Uploader ein, damit Benutzer ohne Registrierung Dokumente in Ihren Workspace hochladen können. Wählen Sie die zulässigen Dateitypen für den Upload aus. Die folgenden Einstellungen sind verfügbar:
      • Zielordner-ID – wählen Sie den Workspace-Ordner aus, in dem hochgeladene Dateien gespeichert werden. Verwenden Sie die Ordnerauswahl, um den Zielort zu suchen und auszuwählen.

      • Upload-Modus – wählen Sie aus, was Benutzer hochladen können:

        • Dateien – das Hochladen einzelner Dateien erlauben.
        • Ordner – das Hochladen vollständiger Ordnerstrukturen erlauben.
      • Menge – legen Sie fest, wie viele Elemente gleichzeitig hochgeladen werden können:

        • Einzelne Datei – den Uploader auf eine Datei pro Sitzung beschränken.
        • Mehrere Dateien – das gleichzeitige Hochladen mehrerer Dateien erlauben.
      • Upload-Limits – legen Sie die Maximale Dateigröße und die Einheit (KB, MB oder GB) fest, um die Größe einer einzelnen hochgeladenen Datei zu beschränken.

      • Verfügbare Dateitypen – aktivieren Sie eine oder mehrere Kategorien, um die hochladbaren Dateitypen einzuschränken: Dokumente, Tabellenkalkulationen, Präsentationen, Bilder, Video, Audio, Archive, PDF.

      • Schaltflächentext – passen Sie die Beschriftung der Upload-Schaltfläche an (standardmäßig Hochladen).

      • Hilfetext – passen Sie den sekundären Hinweistext unter der Schaltfläche an (standardmäßig oder Datei hier ablegen).

      • Anzeige anpassen – legen Sie Breite, Höhe (in % oder px) und die Frame-ID fest, mit der der eingebettete Frame auf Ihrer Seite identifiziert wird.

        Entwicklertools - Uploader

  5. Klicken Sie auf die Schaltfläche Einrichtung starten.

  6. Passen Sie die verfügbaren Anzeigeoptionen an, die je nach ausgewähltem Modus unterschiedlich sind. Für den Modus Benutzerdefiniert stehen beispielsweise die folgenden Optionen zur Verfügung: Breite, Höhe, Frame-ID, Oberflächenelemente (Linkes Menü, Titel, Spalten einrichten, Aktionsschaltfläche, Suchen, Filtern und Sortieren und Kopfzeile (nur für Mobilgeräte)), Datenanzeigeeinstellungen (wählen Sie den Abschnitt, Raum oder Ordner aus, den Sie anzeigen möchten) und erweiterte Anzeigeeinstellungen wie Suchbegriff, Sortieren nach Parameter, Sortierreihenfolge, die Anzahl der auf einer Seite angezeigten Dateien / Ordner, Anzeigeseite, Anzeige der Spalten in einer Dateizeile.

  7. Zeigen Sie eine Vorschau des Ergebnisses im Abschnitt Vorschau an.

  8. Wechseln Sie zur Registerkarte Einzufügender Code und kopieren Sie den generierten Code von der Registerkarte HTML, JavaScript oder NPM. Für NPM werden die Befehle zum Installieren und Importieren des Pakets sowie das Konfigurationsobjekt mit den erforderlichen Parametern und das HTML-Element, in das der SDK-Frame eingefügt wird, bereitgestellt.

  9. Betten Sie den kopierten Code in Ihre Website ein.

Entwicklertools

Die Seite Embed SDK enthält außerdem den Abschnitt Integrationsbeispiele mit sofort einsatzbereiten Integrationen für beliebte Plattformen wie Zoom und WordPress. Klicken Sie auf Alle Konnektoren anzeigen, um die vollständige Liste der verfügbaren Integrationen zu durchsuchen.

Weitere Informationen zum Embed SDK finden Sie unter api.onlyoffice.com.