Affichage de fichiers (par exemple des images) stockés dans Google Drive sur un site Web


289

Je me demandais s'il était possible d'accéder à / afficher des fichiers tels que des images stockées dans Google Drive sur un site Web public.


4
Il semble que l'utilisateur qui a créé la question n'ait plus utilisé SO, laissant cette question sans réponse acceptée (lorsqu'il y a au moins une réponse valide). Les éditeurs de la communauté peuvent-ils résoudre ce problème?
rufo


Voici la dernière mise à jour de Google en juillet 2016 avec des alternatives: gsuite-developers.googleblog.com/2016/07/…
wescpy

@wescpy , j'ai trouvé que cette solution fonctionnait pour mon compte G-Suite
y2k-shubham

Réponses:


200

Une solution consiste à obtenir le fileIdavec Google Drive SDK APIpuis à utiliser ceci Url:

https://drive.google.com/uc?export=view&id= {fileId}

Ce sera un lien permanent vers votre fichier dans Google Drive (image ou autre).

Remarque: ce lien semble soumis à des quotas. Donc pas idéal pour un partage public / massif.


Cependant, apparemment, cette URL (au moins celle "afficher") ne fonctionne que lorsque l'utilisateur qui la consulte est connecté à Google (Drive?). Dans une fenêtre de navigation anonyme, j'ai reçu une page de connexion au lieu de l'image (partagée publiquement) que j'ai demandée.
scy

1
Voir mon commentaire du 27 mars, également pour quiconque avec des liens, il y a des quotas que vous ne pouvez pas dépasser.
rufo

1
Cela fonctionne sans utiliser de dossier public. L'image elle-même doit être partagée comme «publique». Le fileId est affiché - intégré dans une URL - lors du partage du fichier.
Jim Fred

4
Bonjour Rufo, pouvez-vous s'il vous plaît partager des informations sur le quota, comme combien de quota y a-t-il? Est-ce que le quota signifie voir la bande passante par mois? Existe-t-il un lien sans quota? Je recherche un partage public / de masse.
Noitidart

1
une note importante comme @JimFred a dit, le fichier doit être partagé en tant que public
datdinhquoc

163

MISE À JOUR: Comme annoncé , Google a déprécié cette fonctionnalité en août 2016. Voici la dernière mise à jour de Google avec des alternatives.

Oui c'est possible. À condition que vous placiez vos fichiers dans un dossier public, vous pouvez obtenir n'importe quel fichier dans un dossier par cette URL:

https://googledrive.com/host/<folderID>/<filename>

3
Lien mort :( quelqu'un en a un nouveau?
Rambatino

@LeoLuanElezi alors que votre montage était solide, un meilleur résumé du montage aurait été: "supprimé un lien mort".
Nissa

152

Voici le lien d'affichage simple:

https://drive.google.com/uc?id=FILE_ID

par exemple https://drive.google.com/uc?id=0B9o1MNFt5ld1N3k1cm9tVnZxQjg

Vous pouvez faire de même pour d'autres types de fichiers, par exemple MP3, PDF, etc.


13
Ça marche! (le lien de partage https://drive.google.com/file/d/2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz/edit?usp=sharing s'est transformé en https://drive.google.com/uc?id=2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz).
cbh2000

Comment paly fichier vidéo en vidéo?
chiru

API Drive au moment de terminer un téléchargement de fichier a ce lien dans le message de réponse: data.response.webContentLink. Cela aura &export=downloadà la fin qui doit juste être coupé.
Bill Hoag

Cette réponse a fonctionné pour moi lorsque j'ai essayé d'héberger / d'utiliser une image pour le logo de mon équipe ESPN Fantasy-Football ... donc bravo pour cela.
NateJ

1
@pabloverd: "dois-je faire cette action une par une" Oui.
Mori

61

voici comment partir de @ https://productforums.google.com/forum/#!topic/drive/yU_yF9SI_z0/discussion

1- Téléchargez votre image

2- Faites un clic droit et choisissez "obtenir un lien partageable"

3- Copiez le lien qui devrait ressembler

https://drive.google.com/open?id=xxxxxxx

4 changer open?à uc?et de l' utiliser comme

<img src="https://drive.google.com/uc?id=xxxxx">
  • il est recommandé de supprimer le http:ou https:lorsque vous faites référence à quoi que ce soit du Web pour éviter tout problème avec votre serveur.

@ ctf0 "il est recommandé de supprimer le http: ou https: lorsque vous référencez quoi que ce soit sur le Web pour éviter tout problème avec votre serveur", vous conseillez donc de le faire simplement drive.google.com?
HoCo_

Fonctionné bien, simple
Thara Perera

26

MISE À JOUR: Comme annoncé , Google a déprécié cette fonctionnalité en août 2016. Voici la dernière mise à jour de Google avec des alternatives.

En avril 2013 et en utilisant Chrome / webkit, les éléments suivants ont fonctionné pour moi:

  • 1 Créez un dossier appelé par exemple "public"

  • 2 Sélectionnez ce dossier, cliquez avec le bouton droit et Partager> Partager . Cliquez sur. Sélectionnez "Tout le monde peut accéder"

  • 3 Faites glisser et déposez un fichier dans le dossier et laissez-le télécharger.

  • 4 Cliquez avec le bouton droit sur le fichier et sélectionnez Détails . L'une des lignes du Details-Fieldset indique "Hosting". En dessous, il y a une URL:

https://googledrive.com/...

  • Faites glisser et déposez cette URL dans un nouvel onglet. Copiez et collez l'URL et partagez-la ou incorporez-la où vous voulez.

Une limitation est qu'en ce qui concerne HTTP, seul un accès HTTP sécurisé semble possible.

Mise à jour:
Une autre limitation est que les fichiers que Google Drive peut ouvrir ne seront pas accessibles de cette façon.
Autrement dit, cliquer sur " Détails " n'affichera pas d'URL Google Drive.

Pour surmonter cela:

  • faites un clic droit sur le fichier en question et sélectionnez "Ouvrir avec> Gérer les applications":

entrez la description de l'image ici

  • Décochez les applications associées aux fichiers ici
  • Facultatif: rechargez Google Drive
  • Faites un clic droit sur le fichier et sélectionnez "Détails"
  • Procédez comme à l'étape 4

Remarque: Une alternative à la procédure ci-dessus consiste à télécharger le fichier avec une extension que Google Drive ne peut pas ouvrir / n'est pas associée.


2
Mise à jour de la mise à jour - elle a été déconseillée en 201 5 et supprimée en 2016 6
Chris H

Et donc cette réponse devrait être supprimée
matanster

14

Si vous souhaitez afficher le fichier dans le navigateur, il est également possible d'utiliser une méthode similaire à celle fournie par rufo et Torxed:

https://drive.google.com/uc?export=view&id={fileId}

Je ne comprends pas. Si je veux afficher le gdoc dans le navigateur, je tape simplement son URL.
Phil Goetz

7

Je pense que c'est possible mais seulement pour une courte période

Ce que vous devez faire est de définir la liste de contrôle d'accès du fichier sur Public Read-Only (ou Public Read / Write). Vous pouvez le faire par programme à l'aide de l' API Google Document List , ou manuellement via le bouton "Partager" dans la visionneuse d'images Drive.

Ensuite, vous pouvez obtenir l'URL de l'image par programmation en utilisant l'API Google Document List ou en utilisant l' API Google Drive (c'est-à-dire file.getDownloadUrl () en Java). Vous pouvez également facilement obtenir un lien vers l'image manuellement en cliquant avec le bouton droit sur l'image dans la visionneuse d'images par défaut de Google Drive.

Le problème est que ce lien a une durée de vie limitée, il fonctionnera donc pendant un certain temps puis cessera de fonctionner.

Fondamentalement, l'URL du fichier image stocké dans Drive doit être accessible sans aucune authentification une fois qu'elle a été définie comme partagée publiquement, mais cette URL va changer à un moment donné. Nous pourrions trouver une solution à cela à l'avenir, comme fournir une URL permanente qui redirigera vers ces URL changeantes, mais aucune promesse ...


1
Ce serait bien de savoir à l'avance la durée de vie d'un lien. Est-ce fixe ou cela dépend d'autres paramètres?
Drake

2
Par expérience, si je demande à l'ingénieur quelle est cette valeur, il répondra: "C'est actuellement XXX, mais ne leur dites pas car nous pourrions la changer à tout moment :)" Je suis sûr que vous pouvez expérimenter facilement pour trouver cette valeur;)
Nicolas Garnier

Actuellement, un lien public, même s'il expire, vers une ressource, c'est ce dont nous avons besoin, à côté des sandbox d'application, pour lesquels les données appartiennent déjà à une application oauth2 sans jouer avec les ACL.
kain

6

À partir des pages d'aide de Google Drive :

Pour héberger une page Web avec Drive:

  1. Ouvrez Drive sur drive.google.com et sélectionnez un fichier.
  2. Cliquez sur le bouton Partager en haut de la page.
  3. Cliquez sur Avancé dans le coin inférieur droit de la zone de partage.
  4. Cliquez sur Modifier ....
  5. Choisissez Activé - Public sur le Web et cliquez sur Enregistrer.
  6. Avant de fermer la boîte de partage, copiez l'ID du document à partir de l'URL dans le champ sous "Lien pour partager". L'ID du document est une chaîne de lettres et de chiffres en majuscules et en minuscules entre les barres obliques dans l'URL.
  7. Partagez l'URL qui ressemble à "www.googledrive.com/host/[doc id] où [doc id] est remplacé par l'ID de document que vous avez copié à l'étape 6.

Tout le monde peut désormais consulter votre page Web.


5

Certains des utilisateurs précédents étaient proches, mais il leur manquait une étape ici ou là.

Voici une vidéo qui montre toutes les étapes.

(Edit 2-Dec-14
Les informations ci - dessous sont incorrectes en ce qui concerne le nouveau Google Drive. Pour le nouveau Google Drive, suivez ces instructions.
Il y a deux options que vous pouvez utiliser, l'
option 1, vous pouvez cliquer sur le rouage en haut à droite et revenir à l'ancien lecteur de google, si vous revenez, utilisez les instructions après "End Edit)".
Option 2 ou vous pouvez suivre le travail que j'ai trouvé. Si je trouve un meilleur moyen que celui-ci, je le mettrai à jour, mais voici ce que j'ai trouvé qui fonctionne.


Le lien complet ressemblera à ceci " https://googledrive.com/host/(folder id) La
première partie de votre lien dont vous avez besoin est" https://googledrive.com/host/ "pour la seconde moitié dont vous aurez besoin pour accéder au fichier que vous souhaitez partager.
Une fois dans le dossier contenant le fichier que vous souhaitez partager, consultez le lien ci-dessus
(exemple 1 https://drive.google.com/drive/u/0/ # folder / 0B3UALYkiLexYSXZlcldoU2NpYXM )
(exemple 2 https://drive.google.com/drive/u/0/#folders/0B3UALYkiLexYSXZlcldoU2NpYXM/0B3UALYkiLexYRkNnOVhsUVozRU0 )
Dans les deux exemples ci-dessus, "l'ID de dossier" dont vous avez besoin pour le partage est le dernier groupe de lettres et de chiffres après le "/" donc dans l'exemple un, c'est "0B3UALYkiLexYSXZlcldoU2NpYXM" dans l'exemple deux c'est "0B3UALYkiLexYRkNnOVhsUVozRU0"

dans les exemples J'ai utilisé, l'exemple 1 était un dossier sur mon lecteur, et l'exemple 2 était un dossier à l'intérieur de ce premier, c'est pourquoi il a tout le premier lien avant le second.
Nous n'avons besoin que de la section après le "/" le plus à droite.


Alors maintenant que vous avez votre "ID de dossier", prenez la formule ci-dessus " https://googledrive.com/host/(folder id)"
Exemple 1 https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM
Exemple 2 https: // googledrive.com/host/0B3UALYkiLexYRkNnOVhsUVozRU0


Génial, maintenant que vous avez ce lien, ouvrez-le dans une nouvelle page. Il vous dirigera vers le dossier partagé. Une fois là-bas, vous pouvez soit cliquer avec le bouton droit sur n'importe quel fichier et sélectionner "Copier l'adresse du lien" ou vous pouvez cliquer sur n'importe quel fichier dans ce dossier et cela vous amènera à l'image hébergée, l'URL en haut de la page est l'URL d'hébergement.


Voilà comment vous le faites. C'est assez ennuyeux, et personnellement, il semble beaucoup plus facile de simplement revenir à l'ancien lecteur Google.


Je vais essayer de faire un nouveau tutoriel vidéo dès que possible


Faites-moi savoir si cela ne fonctionne pas pour vous et quel problème vous rencontrez.


Fin de l'édition)

https://www.youtube.com/watch?v=QmN22LMPdDk&feature=youtu.be

Ou vous pouvez simplement suivre celles écrites ci-dessous.

Ces images vont avec celles répertoriées dans les étapes.

https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM/

  1. Créez un dossier sur votre Google Drive que vous souhaitez utiliser pour partager des images.

  2. Sélectionnez ce dossier et accédez aux options de partage. Modifiez les options "Qui a accès" de "Personnes spécifiques" à "Public sur le Web" Toutes les images placées dans le dossier auront un lien d'hébergement sur elles, indiqué à l'étape 4

    (Images: Change Folder Option.png , Change folder option 2.png et Change folder option 3.png )

  3. placez une image dans ce dossier.

  4. sélectionnez l'image que vous souhaitez partager et regardez la section des détails (généralement sur le côté droit) pour une section intitulée "Hébergement", vous devriez trouver un lien qui commence par

    "googledrive.com/host/(numéros et chiffres aléatoires qui sont l'ID de ce dossier) / (nom de fichier)"

    Utilisez ce lien pour partager vos images. Vous pouvez utiliser ce lien pour les intégrer à d'autres sites Web.

    (Images: Changer l'option de dossier 4.png et Changer l'option de dossier share.png )


2

Vetea, si vous prenez le lien de l'URL de l'image, cela ne fonctionne pas, mais si vous le prenez du champ "Lien direct" cela devrait fonctionner. Je l'ai utilisé et testé à plusieurs reprises.


2

La solution fournie par Niutech a fonctionné pour moi, c.-à-d.

http://googledrive.com/host/<folderID>/<filename>

Mais il y a 2 problèmes en suspens

  1. Vous ne pouvez pas avoir 2 fichiers portant le même nom dans le même dossier dans le lecteur, sinon ce lien ne fonctionnera pas.

  2. Ce n'est pas encore clair, mais Google semble envisager de déprécier l'hébergement d'images via le lecteur. veuillez consulter le lien ci-dessous. https://support.google.com/richmedia/answer/6098968?hl=en


Google n'a pas donné de calendrier sur le moment où cela sera obsolète? J'avais l'intention d'intégrer cela à mon site Web, mais je n'en suis pas sûr après avoir lu ceci!
Shikhar


2

Spécifiquement pour les utilisateurs de G-Suite. Comme indiqué au point 3 ici , vous pouvez utiliser cette URL pour héberger l'image

https://drive.google.com/a/domain.com/thumbnail?id=imageID

avec les remplacements suivants

  • domain: remplacez par le domaine GSuite de votre entreprise comme pikachu
  • imageID: remplacer par l'ID image / id fichier

La condition préalable ici est que l'image doit avoir été partagée via le lecteur vers le public cible (soit avec chaque personne individuellement, soit peut-être dans l'organisation)

entrez la description de l'image ici


Si vous rencontrez des problèmes avec la taille de l'image rendue, utilisez les options suivantes comme mentionné ici

https://drive.google.com/a/domain.com/thumbnail?id=imageID&sz=w{width}-h{height}

avec remplacements suivants (en plus domainet imageIDremplacement)

  • {width}: écrire la largeur en pixels (sans accolades) comme 300
  • {height}: écrire la hauteur en pixels (sans accolades) comme 200

2

EDIT: À partir de 2020, CECI fonctionne. La plupart des réponses précédentes sont obsolètes.

Solution facile

Il vous suffit d'ouvrir votre dossier:

Image de montagne sur Google Drive

Ensuite, accédez à votre inspecteur Web (pour Chrome Cmd-Shift-Iou en Ctrl-Shift-Ifonction de votre système d'exploitation) et obtenez le lien. Terminé!

Image du lien pour l'image affichée dans l'inspecteur Web

Le lien fonctionne, essayez-le ici .


Brillant - Cela devrait être le meilleur voté à partir de 2020
Mehdi LAMRANI Il y a

1

Il existe une option de type de fichier dans l'API Google Drive. Vous pourriez peut-être vérifier si cela se résout en une image valide. Je regarderais une option où si le type de fichier me donne une image invalide, puis j'obtiens une nouvelle URL directe pour le fichier. Je n'ai pas encore compris exactement comment faire cela, mais c'est peut-être une voie à essayer.


1

Vous pouvez le faire directement depuis Drive et Gmail. Voici comment:

1.Téléchargez une image sur Google Drive et définissez les autorisations de visualisation (peut être publique OU n'importe qui avec un lien)

  1. Accédez à Gmail> Composer. Sélectionnez le + à côté de l'icône de pièce jointe.

  2. Sélectionnez l'icône du lecteur (forme de triangle)

  3. Accédez à votre image et cliquez avec le bouton droit sur la copie de l'url de l'image

  4. Collez-le dans le navigateur Web ou intégrez-le sur les pages Web selon vos besoins.


Cela vous donne uniquement un lien vers le document entier. Cela ne sert à rien de faire cela; vous disposez déjà de l'URL du document lorsque vous le modifiez ou le visualisez. Mes amis, arrêtez de poster des réponses sur la façon de trouver l'URL du document! Nous connaissons déjà son URL.
Phil Goetz

1

1.Changez les paramètres de votre image en mode public.

Obtenez son lien partageable.

3.Allez sur ce site Web et générez un lien de téléchargement direct.

A travaillé pour moi!


0

Con peut désactiver javascript dans votre navigateur ouvrez le fichier image et dans la source de la page de visualisation ou faites un clic droit sur l'image, vous verrez le lien de l'image. (vérifiez la préférence de partage avant)


Ce serait une astuce intéressante, mais si vous désactivez javascript et essayez d'ouvrir un document google, vous obtenez le message "JavaScript n'est pas activé dans votre navigateur, ce fichier ne peut donc pas être ouvert. Activez et rechargez."
Phil Goetz


0

Titre de fonction: goobox

tags: hébergement d'image, regex, URL, google drive, dropbox, avancé

  • return: string, Renvoie une URL de chaîne qui peut être utilisée directement comme source d'une image.
  • lorsque vous hébergez une image sur Google Drive ou Dropbox, vous ne pouvez pas utiliser l'URL directe de votre fichier comme source d'image.
  • vous devez apporter des modifications à cette URL pour l'utiliser directement comme source d'image.
  • goobox() prendra l'URL de votre fichier image et le changera pour être utilisé directement comme source d'image.
  • Important: vous devez d'abord vérifier les autorisations de vos fichiers et savoir s'ils sont publics.
  • exemple en direct: https://ybmex.csb.app/
cconst goobox = (url)=>{

    let dropbox_regex = /(http(s)*:\/\/)*(www\.)*(dropbox.com)/;
    let drive_regex =/(http(s)*:\/\/)*(www\.)*(drive.google.com\/file\/d\/)/;

    if(url.match(dropbox_regex)){
       return url.replace(/(http(s)*:\/\/)*(www\.)*/, "https://dl.");
    }
    if(url.match(drive_regex)){
        return `https://drive.google.com/uc?id=${url.replace(drive_regex, "").match(/[\w]*\//)[0].replace(/\//,"")}`;
    }
    return console.error('Wrong URL, not a vlid drobox or google drive url');
}
let url = 'https://drive.google.com/file/d/1PiCWHIwyQWrn4YxatPZDkB8EfegRIkIV/view' 

goobox(URL); //  https://drive.google.com/uc?id=1PiCWHIwyQWrn4YxatPZDkB8EfegRIkIV 

-3

Cependant, cette réponse est simple, en fait très simple et oui, beaucoup l'ont mentionnée en mettant simplement l'ID de l'image dans le lien suivant https://drive.google.com/uc?export=view&id= {fileId}

Mais aussi simple que cela soit, j'ai créé un script à exécuter dans la console. Alimentez un tableau de liens partageables complets à partir de Google Drive et convertissez-les en lien ci-dessus. Ensuite, ils peuvent être simplement utilisés comme adresses statiques.

array = ['https://drive.google.com/open?id=0B8kNn6zsgGEtUE5FaGNtcEthNWc','https://drive.google.com/open?id=0B8kNn6zsgGEtM2traVppYkhsV2s','https://drive.google.com/open?id=0B8kNn6zsgGEtNHgzT2x0MThJUlE']

function separateDriveImageId(arr) {
for (n=0;n<arr.length;n++){

str = arr[n]

for(i=0;i<str.length;i++){
if( str.charAt(i)== '=' ){
var num = i+1;
var extrctdStrng = str.substr(num)

}
}
console.log('https://drive.google.com/uc?export=view&id='+extrctdStrng)
window.open('https://drive.google.com/uc?export=view&id='+extrctdStrng,'_blank')
}


}
separateDriveImageId(array)

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.