Ich habe einen Ordner in Google Drive, den ich in meine Webseite einbetten möchte. Ich kann keinen Einbettungscode oder irgendetwas Dokumentiertes in den Google Drive-Hilfeartikeln finden.

1. Gehen Sie zu Ihrem Google Drive.
2. Klicken Sie mit der rechten Maustaste auf den Ordner.
3. Wählen Verlinkung erhalten.
4. Öffne das Allgemeiner Zugang Dropdown-Menü.
5. Wählen Jeder mit dem Link um Ihren Ordner zu veröffentlichen.
6. Klicken Link kopieren und dann Erledigt.
   Sie erhalten eine URL wie die folgende:
   https://drive.google.com/drive/folders/1qGwpjmQIQO8rN1odas0njDSf72VRrTCa?usp=share_link

   Sie können Ihre Ordner-ID in Fettschrift sehen: 1qGwpjmQIQO8rN1odas0njDSf72VRrTCa

7. Google Drive-Ordner können eingebettet und angezeigt werden list Und grid Ansichten. Geben Sie die Ordner-ID in eines der folgenden Felder ein iframe Quellen:

Listenansicht

<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID#list" style="width:100%; height:600px; border:0;"></iframe>

Rasteransicht

<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID#grid" style="width:100%; height:600px; border:0;"></iframe>

Einbetten eines Google Drive-Verzeichnisses in einen IFRAME

Google Drive-Ordner können eingebettet und angezeigt werden list Und grid Ansichten (in denen Sie nur auf eine Datei oder einen Ordner klicken können, um sie auf einer neuen Registerkarte zu öffnen). Dazu einfach austauschen ORDNER-ID und für private Ordner (ab 2022) RESSOURCENSCHLÜSSEL mit eigenen in:

Listenansicht

<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID&resourcekey=RESOURCE-KEY#list" style="width:100%; height:600px; border:0;"></iframe>

oder ohne Angabe eines Modus, da der Listenmodus der Standard ist:

<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID&resourcekey=RESOURCE-KEY" style="width:100%; height:600px; border:0;"></iframe>

Rasteransicht

<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID&resourcekey=RESOURCE-KEY#grid" style="width:100%; height:600px; border:0;"></iframe>

Abrufen Ihrer Ordner-ID

Sie können einfach ersetzen drive/folders/ mit embeddedfolderview?id= in einem standardmäßigen Drive-Freigabelink.

Die ID ist der Hash (alphanumerischer Kauderwelsch) danach folders/ in der URL des Ordners. Sie können die URL in der Adressleiste Ihres Browsers sehen, wenn Sie den Drive-Ordner öffnen. Den Ressourcenschlüssel finden Sie nach dem Kopieren im Freigabelink. Zum Beispiel bei:

`https://drive.google.com/drive/folders/0B9s5Ht8qysnFMXhaZDFfQlJEalE&resourcekey=0-in7UrBAlXKTSN6poaUSl9g`

Die Ordner-ID ist 0B9s5Ht8qysnFMXhaZDFfQlJEalE und der Ressourcenschlüssel ist 0-in7UrBAlXKTSN6poaUSl9g.

Ordner mit G Suite/Google Apps-Domain

Seit der Einführung des Ressourcenschlüsselparameters im Jahr 2022 und seit Januar 2023 schlägt das Einbetten von G Suite-Domänenordnern mit einem 403-Fehler fehl („Es tut uns leid, aber Sie haben keinen Zugriff auf diese Seite. Das ist alles, was wir wissen.“) . Das Folgende bleibt nur für den Fall, dass sie es irgendwann beheben.

Wenn Ihr Ordner Teil einer Google Apps-Domain ist, können Sie die Domain zur URL hinzufügen, um die Berechtigungsprobleme zu lösen (weiter unten ausführlich beschrieben):

<iframe src="https://drive.google.com/a/MY.DOMAIN.COM/embeddedfolderview?id=FOLDER-ID#grid" style="width:100%; height:600px; border:0;"></iframe>

Einfach ersetzen MEINE.DOMAIN.COM Und ORDNER-ID mit deinem eigenen.

Vorbehalt bei Ordnern, die eine Genehmigung erfordern

Diese Technik funktioniert am besten für Ordner mit öffentlichem Zugriff. Ordner, die nur mit bestimmten Google-Konten geteilt werden, können Probleme verursachen, wenn Sie sie auf diese Weise einbetten, je nachdem, welche Google-Konten im Browser des Benutzers aktiv sind:

1. Wenn sich der Nutzer bei keinem Google-Konto angemeldet hat, dann Nichts erscheint im Rahmen.
2. Wenn der Benutzer ohne Berechtigung zum Zugriff auf den Ordner bei einem Konto angemeldet ist, enthält der Rahmen die Nachricht du brauchst eine Erlaubnismit einigen Tasten zu Anfrage Zugang oder Konten wechselnaber wenn Sie darauf klicken, wird der Rahmen ausgeblendet.
3. Wenn sich der Benutzer ohne die entsprechenden Berechtigungen bei einem Konto anmeldet und später das autorisierte Konto hinzufügt, greift Google beim Laden des eingebetteten Laufwerks auf das erste aktive Konto zurück, und der Benutzer wird es sehen du brauchst eine Erlaubnises sei denn…
4. Wenn die URL eine Google Suite-Domain enthält und der Benutzer beim Konto dieser Domain angemeldet ist, funktioniert die eingebettete Ansicht. auch wenn sich der Benutzer zuerst bei einem anderen Konto angemeldet hat.

Die leeren Frames sind darauf zurückzuführen, dass Google es verbietet, seine Anmeldeseite in einen IFRAME einzubetten (vermutlich um Kontodiebstahl zu verhindern), über die X-Frame-Options Kopfzeile, die, wenn sie auf gesetzt ist SAMEORIGIN führt dazu, dass jeder gut erzogene Browser sich weigert, die Seite zu laden, wenn sie nicht in derselben Domäne ist (s drive.google.com). Sie können dies in der Entwicklerkonsole Ihres Browsers sehen.

TL;DR

Um eine Listen- oder Rasteransicht eines Drive-Ordners zu erhalten (in der Sie nur auf eine Datei oder einen Ordner klicken können, um sie auf einem neuen Tab zu öffnen), verwenden Sie:

<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID&resourcekey=RESOURCE-KEY#grid" style="width:100%; height:600px; border:0;"></iframe>

Bei Google Suite/Apps Drive ist seit Januar 2023 Folgendes defekt:

<iframe src="https://drive.google.com/a/MY.DOMAIN.COM/embeddedfolderview?id=FOLDER-ID#grid" style="width:100%; height:600px; border:0;"></iframe>

Ersetzen MEINE.DOMAIN.COM Und ORDNER-ID mit Ihren eigenen; entfernen #grid um eine detaillierte Dateiliste zu erhalten.

Lassen Sie Ihre Benutzer bei privaten Ordnern beim richtigen Konto anmelden, bevor Sie die Seite mit dem eingebetteten Ordner laden. Wenn sich der Ordner in einer Google Apps-Domain befindet, können Sie die Domain zur URL hinzufügen. Andernfalls müssen sie sich vor allen anderen bei dem autorisierten Konto anmelden.

(Diese Antwort ist eine Bearbeitung von Mori, wurde jedoch abgelehnt, da sie seine geändert hat Absichtirgendwie)

Zum Zeitpunkt des Schreibens dieser Antwort gab es keine Methode zum Einbetten, mit der der Benutzer in Ordnern navigieren und die Dateien anzeigen konnte, ohne die Website zu verlassen (die Methode in anderen Antworten öffnet alles in einem neuen Tab auf der Google Drive-Website). Also habe ich mein eigenes Werkzeug dafür gemacht. Um ein Laufwerk einzubetten, fügen Sie den folgenden Iframe-Code in Ihren HTML-Code ein:

<iframe src="https://googledriveembedder.collegefam.com/?key=YOUR_API_KEY&folderid=FOLDER_ID_WHIHCH_IS_PUBLICLY_VIEWABLE" style="border:none;" width="100%"></iframe>

Im obigen Code benötigen Sie Ihren eigenen API-Schlüssel und die Ordner-ID. Sie können die Höhe nach Ihren Wünschen einstellen.

So erhalten Sie den API-Schlüssel:

1.) Gehen Sie zu https://console.developers.google.com/ Erstellen Sie ein neues Projekt.

2.) Gehen Sie über die Menüschaltfläche zu “APIs und Dienste” –> “Dashboard” –> Klicken Sie auf “APIs und Dienste aktivieren”.

3.) Suchen Sie nach „Google Drive API“, aktivieren Sie es. Wechseln Sie dann zur Registerkarte „Anmeldeinformationen“ und erstellen Sie Anmeldeinformationen. Halten Sie Ihren API-Schlüssel uneingeschränkt.

4.) Kopieren Sie den neu generierten API-Schlüssel.

So erhalten Sie die Ordner-ID:

1.) Gehen Sie zu dem Google Drive-Ordner, den Sie einbetten möchten (z. B. drive.google.com/drive/u/0/folders/1v7cGug_e3lNT0YjhvtYrwKV7dGY-Nyh5u [this is not a real folder]) Stellen Sie sicher, dass der Ordner öffentlich freigegeben und für jeden sichtbar ist.

2.) Kopieren Sie den Teil nach ‘folders/’, das ist Ihre Ordner-ID.

Fügen Sie nun sowohl den API-Schlüssel als auch die Ordner-ID in den obigen Code ein und betten Sie ihn ein.

Notiz: Das funktioniert nur für Dateien und Unterordner, die Sie tatsächlich in den GDrive-Ordner hochgeladen haben, nicht die Unterordner, die Sie als “Verknüpfung” hinzufügen. Wenn ein Unterordner nicht richtig angezeigt wird, laden Sie seinen Inhalt herunter und laden Sie ihn hoch, um ihn in diesem bestimmten Ordner zu speichern. Wenn Sie einen Ordner innerhalb von Google Drive „verschieben“, fügt GDrive ihn als „Verknüpfung“ hinzu.

Um die Download-Schaltfläche für Dateien auszublenden, fügen Sie „&allowdl=no“ am Ende der src-URL des Iframes hinzu.

Ich habe das Widget unter Berücksichtigung mobiler Benutzer erstellt, es eignet sich jedoch sowohl für Mobilgeräte als auch für Desktops. Wenn Sie auf Probleme stoßen, hinterlassen Sie hier einen Kommentar. Ich habe hier einige Screenshots des Inhalts des Iframes angehängt.

Für Business-/Gsuite-Apps oder wie auch immer sie genannt werden, können Sie die Domain angeben (hatte Probleme mit 500-Fehlern mit der ursprünglichen Antwort, wenn Sie bei mehreren Google-Konten angemeldet waren).

<iframe 
  src="https://drive.google.com/a/YOUR_COMPANY_DOMAIN/embeddedfolderview?id=FOLDER-ID" 
  style="width:100%; height:600px; border:0;"
>
</iframe>