Mostrar archivos (por ejemplo, imágenes) almacenados en Google Drive en un sitio web


289

Me preguntaba si es posible acceder / mostrar archivos como imágenes que se almacenan en Google Drive en un sitio web público.


44
Parece que el usuario que creó la pregunta nunca más usó SO, dejando esta pregunta sin respuesta aceptada (cuando hay al menos una respuesta válida). ¿Pueden los editores de la comunidad arreglar eso?
rufo

66
Parece que esto está en desuso: desaprobar el soporte de alojamiento web en Google Drive
dumbledad

Aquí está la actualización final de Google en julio de 2016 con alternativas: gsuite-developers.googleblog.com/2016/07/…
wescpy

@wescpy , he encontrado que esta solución funciona para mi cuenta de G-Suite
y2k-shubham

Respuestas:


200

Una solución alternativa es obtener fileIdcon Google Drive SDK APIy luego usar estoUrl :

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

Ese será un enlace permanente a su archivo en Google Drive (imagen o cualquier otra cosa).

Nota: este enlace parece estar sujeto a cuotas. Por lo tanto, no es ideal para el intercambio público / masivo.


Sin embargo, aparentemente esta URL (al menos la "vista") solo funciona cuando el usuario que la ve está conectado a Google (¿Drive?). En una ventana de navegación anónima, recibí una página de inicio de sesión en lugar de la imagen (públicamente compartida) que solicité.
scy

1
Vea mi comentario del 27 de marzo, también para cualquiera con enlaces hay cuotas que no puede exceder.
rufo

1
Esto funciona sin usar una carpeta pública. La imagen en sí debe ser compartida como 'pública'. El fileId se muestra, incrustado en una URL, al compartir el archivo.
Jim Fred

44
Hola Rufo, ¿puedes compartir información sobre la cuota, como cuánta cuota hay? ¿Cuota significa ver ancho de banda por mes? ¿Hay un enlace sin cuota? Estoy buscando el intercambio público / masivo.
Noitidart

1
una nota importante como @JimFred dijo, el archivo debe ser compartido como público
datdinhquoc

163

ACTUALIZACIÓN: Como se anunció , Google desaprobó esta función en agosto de 2016. Aquí está la actualización final de Google con alternativas.

Si es posible. Siempre que coloque sus archivos en una carpeta pública, puede obtener cualquier archivo en una carpeta mediante esta URL:

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

3
Enlace muerto :( ¿alguien tiene uno nuevo?
Rambatino

@LeoLuanElezi mientras su edición era sólida, un mejor resumen de edición habría sido, "eliminó un enlace muerto".
Nissa

152

Aquí está el enlace de vista simple:

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

por ejemplo, https://drive.google.com/uc?id=0B9o1MNFt5ld1N3k1cm9tVnZxQjg

Puede hacer lo mismo para otros tipos de archivos, por ejemplo, MP3, PDF, etc.


13
¡Funciona! (el enlace para compartir se https://drive.google.com/file/d/2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz/edit?usp=sharing convirtió en https://drive.google.com/uc?id=2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz).
cbh2000

¿Cómo palyar un archivo de video en videoview?
chiru

API de Drive al terminar una carga de archivos tiene este enlace en el mensaje de respuesta: data.response.webContentLink. Esto tendrá &export=downloadal final que solo necesita ser recortado.
Bill Hoag

Esta respuesta funcionó para mí cuando intenté alojar / usar una imagen para mi logotipo del equipo ESPN Fantasy-Football ... así que felicitaciones por eso.
NateJ

1
@pabloverd: "tengo que hacer esa acción uno por uno" Sí.
Mori

61

aquí es cómo desde @ https://productforums.google.com/forum/#!topic/drive/yU_yF9SI_z0/discussion

1- sube tu imagen

2- haz clic derecho y elige "obtener enlace para compartir"

3- copia el enlace que debería verse

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

4-cambia el open?a uc?y úsalo como

<img src="https://drive.google.com/uc?id=xxxxx">
  • Se recomienda eliminar el http:o https:al hacer referencia a cualquier cosa de la web para evitar problemas con su servidor.

@ ctf0 "se recomienda eliminar http: o https: cuando se hace referencia a algo de la web para evitar problemas con su servidor", ¿así que aconseja simplemente hacerlo drive.google.com?
HoCo_

TRABAJÓ bien, simple
Thara Perera

26

ACTUALIZACIÓN: Como se anunció , Google desaprobó esta función en agosto de 2016. Aquí está la actualización final de Google con alternativas.

En abril de 2013 y usando Chrome / webkit, lo siguiente funcionó para mí:

  • 1 Haga una carpeta llamada, por ejemplo, "public"

  • 2 Seleccione esa carpeta, haga clic derecho y Compartir> Compartir . Hacer clic. Seleccione "Cualquiera puede acceder"

  • 3 Arrastre y suelte un archivo en la carpeta y déjelo cargar.

  • 4 Haga clic derecho en el archivo y seleccione Detalles . Una de las líneas en el conjunto de campos Detalles dice "Hosting". Debajo hay una url:

https://googledrive.com/...

  • Arrastre y suelte esa URL en una nueva pestaña. Copie y pegue la url y compártala o incrústela en cualquier lugar que desee.

Una limitación es que, en lo que respecta a HTTP, solo parece posible el acceso HTTP seguro.

Actualización:
Otra limitación es que los archivos que Google Drive puede abrir no serán accesibles de esa manera.
Es decir, haciendo clic en " Detalles " no mostrará una URL de Google Drive.

Para superar esto:

  • haga clic derecho en el archivo en cuestión y seleccione "Abrir con> Administrar aplicaciones":

ingrese la descripción de la imagen aquí

  • Desmarca las aplicaciones asociadas a archivos aquí
  • Opcional: Recargar Google Drive
  • Haga clic derecho en el archivo y seleccione "Detalles"
  • Proceda como en el paso 4

Nota: Una alternativa al procedimiento anterior es cargar el archivo con una extensión que Google Drive no puede abrir / no está asociado.


2
Actualización de la actualización: fue obsoleta en 201 5 y eliminada en 2016 6
Chris H

Y por lo tanto esta respuesta debe suprimirse
matanster

14

Si desea ver el archivo en el navegador, también es posible usar un método similar al proporcionado por rufo y Torxed:

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

No entiendo. Si quiero ver el gdoc en el navegador, simplemente escribo su URL.
Phil Goetz

7

Creo que es posible pero solo por poco tiempo

Lo que tiene que hacer es configurar la Lista de control de acceso del archivo en Public Read-Only (o Public Read / Write). Puede hacerlo mediante programación utilizando la API de Lista de documentos de Google , o manualmente a través del botón "Compartir" en el visor de imágenes de Drive.

Luego, puede obtener la URL de la imagen mediante programación utilizando la API de Lista de documentos de Google o la API de Google Drive (es decir, file.getDownloadUrl () en Java). También puede obtener fácilmente un enlace a la imagen manualmente haciendo clic derecho en la imagen en el visor de imágenes predeterminado de Google Drive.

El problema es que este enlace tiene un tiempo limitado de vida, por lo que funcionará por un tiempo y luego dejará de funcionar.

Básicamente, la URL del archivo de imagen almacenado en Drive debe ser accesible sin ninguna autenticación una vez que se ha configurado para compartir públicamente, pero esa URL va a cambiar en algún momento. Podríamos encontrar una solución para esto en el futuro, como proporcionar una URL permanente que redirija a estas URL cambiantes pero sin promesas ...


1
Sería bueno saber de antemano cuánto tiempo dura un enlace. ¿Es fijo o depende de otros parámetros?
Drake

2
Por experiencia, si le pregunto al ingeniero cuál es ese valor, él responderá: "Actualmente es XXX pero no se lo digas porque podríamos cambiarlo en cualquier momento :)" Sin embargo, estoy seguro de que puedes experimentar fácilmente para encontrar este valor;)
Nicolas Garnier

Actualmente, un enlace público, aunque caduque, a un recurso es lo que necesitamos, además de los sandboxes de aplicaciones, para los cuales los datos ya pertenecen a una aplicación oauth2 sin interferir con las ACL.
kain

6

Desde las páginas de ayuda de Google Drive :

Para alojar una página web con Drive:

  1. Abra Drive en drive.google.com y seleccione un archivo.
  2. Haz clic en el botón Compartir en la parte superior de la página.
  3. Haga clic en Avanzado en la esquina inferior derecha del cuadro para compartir.
  4. Haga clic en Cambiar ...
  5. Elija On - Public en la web y haga clic en Guardar.
  6. Antes de cerrar el cuadro para compartir, copie la ID del documento desde la URL en el campo debajo de "Enlace para compartir". La identificación del documento es una cadena de letras mayúsculas y minúsculas y números entre barras en la URL.
  7. Comparta la URL que se parece a "www.googledrive.com/host/[doc id] donde [doc id] se reemplaza por la ID del documento que copió en el paso 6.

Ahora cualquiera puede ver su página web.


5

Algunos de los usuarios anteriores estaban cerca, pero les faltaba un paso aquí o allá.

Aquí hay un video que muestra todos los pasos.

(Editar 2-dic-14
La siguiente información es incorrecta cuando se trata de la nueva unidad de Google. Para la nueva unidad de Google siga estas instrucciones.
Hay dos opciones que puede usar, la
opción 1 puede hacer clic en el engranaje en la esquina superior derecha y revierta a la antigua unidad de google, SI revierte, use las instrucciones después de "Finalizar edición").
Opción 2 o puedes seguir el trabajo que encontré. Si encuentro una mejor manera que esta, la actualizaré, pero esto es lo que he encontrado que funciona.


El enlace completo se verá así " https://googledrive.com/host/( ID de carpeta )
La primera parte de su enlace que necesita es" https://googledrive.com/host/ "para la segunda mitad que necesitará para navegar al archivo que le gustaría compartir.
Una vez que esté en la carpeta con el archivo que le gustaría compartir, mire el enlace de arriba
(Ejemplo 1 https://drive.google.com/drive/u/0/ # carpetas / 0B3UALYkiLexYSXZlcldoU2NpYXM )
(Ejemplo 2 https://drive.google.com/drive/u/0/#folders/0B3UALYkiLexYSXZlcldoU2NpYXM/0B3UALYkiLexYRkNnOVhsUVozRU0 )
En ambos ejemplos anteriores, la "ID de carpeta" que necesita para compartir es el último grupo de letras y números después de "/", por lo que en el ejemplo uno es "0B3UALYkiLexYSXZlcldoU2NpYXM" en el ejemplo dos es "0B3UALYkiLexYRkNnOVhsUVozRU0"

En los ejemplos Utilicé, el ejemplo 1 era una carpeta en mi disco, y el ejemplo 2 era una carpeta dentro de esa primera, es por eso que tiene todo el primer enlace antes del segundo.
Solo necesitamos la sección después de "/" más a la derecha.


Ahora que tiene su "ID de carpeta", tome la fórmula anterior " https://googledrive.com/host/(folder id)"
Ejemplo 1 https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM
Ejemplo 2 https: // googledrive.com/host/0B3UALYkiLexYRkNnOVhsUVozRU0


Genial, ahora que tiene este enlace, ábralo en una página nueva. Le dirigirá a la carpeta compartida. Una vez allí, puede hacer clic derecho en cualquier archivo y seleccionar "Copiar dirección del enlace" o puede hacer clic en cualquier archivo en esa carpeta y lo llevará a la imagen alojada, la URL en la parte superior de la página es la URL de alojamiento.


Así es como lo haces. Es bastante molesto y, personalmente, parece mucho más fácil volver al antiguo disco de Google.


Intentaré hacer un nuevo video tutorial lo antes posible


Avíseme si esto no funciona para usted y qué problema está experimentando.


Fin de edición)

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

O simplemente puede seguir los escritos a continuación.

Estas imágenes van con las que figuran en los pasos.

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

  1. Cree una carpeta en su Google Drive que le gustaría usar para compartir imágenes.

  2. Seleccione esa carpeta y vaya a las opciones para compartir. Cambie las opciones "Quién tiene acceso" de "Personas específicas" a "Público en la web". Todas las imágenes ubicadas en la carpeta tendrán un enlace de alojamiento que se muestra en el Paso 4

    (Imágenes: Cambiar carpeta Opción.png , Cambiar carpeta opción 2.png y Cambiar carpeta opción 3.png )

  3. colocar una imagen en esa carpeta.

  4. seleccione la imagen que desea compartir y mire la sección de detalles (generalmente en el lado derecho) para ver una sección etiquetada como "Hosting", debe encontrar un enlace que comience con

    "googledrive.com/host/( números aleatorios y dígitos que son la ID de esa carpeta) / (nombre de archivo)"

    Usa ese enlace para compartir tus imágenes. Puede usar ese enlace para insertarlos en otros sitios web.

    (Imágenes: Cambiar opción de carpeta 4.png y Cambiar opción de carpeta share.png )


2

Vetea, si toma el enlace de la URL de la imagen, no funciona, pero si lo toma del campo "Enlace directo" debería funcionar. Lo he usado y probado en múltiples ocasiones.


2

La solución proporcionada por Niutech funcionó para mí, es decir

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

Pero hay 2 asuntos pendientes

  1. No puede tener 2 archivos con el mismo nombre en la misma carpeta en la unidad; de lo contrario, este enlace no funcionará.

  2. Todavía no está claro, pero Google parece estar planeando desaprobar el alojamiento de imágenes a través de la unidad. por favor vea el siguiente enlace. https://support.google.com/richmedia/answer/6098968?hl=en


Google no ha dado ninguna línea de tiempo sobre cuándo será desaprobado? Estaba planeando integrar esto con mi sitio web, ¡pero no estoy tan seguro después de leer esto!
Shikhar


2

Específicamente para usuarios de G-Suite. Como se informa en el punto 3 aquí , puede usar esta URL para alojar imágenes

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

con los siguientes reemplazos

  • domain: reemplace con el dominio GSuite de su empresa como pikachu
  • imageID: reemplazar con el ID de la imagen / ID del archivo

El requisito previo aquí es que la imagen debería haberse compartido a través de la unidad de disco al público objetivo (ya sea con cada persona individualmente o tal vez en toda la organización)

ingrese la descripción de la imagen aquí


Si tiene problemas con el tamaño de la imagen renderizada, use las siguientes opciones como se menciona aquí

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

con los siguientes reemplazos (además domainy imageIDreemplazo)

  • {width}: escribe el ancho en píxeles (sin llaves) como 300
  • {height}: escriba la altura en píxeles (sin llaves) como 200

2

EDITAR: A partir de 2020, ESTO está funcionando. La mayoría de las respuestas anteriores están desactualizadas.

Solución fácil

Todo lo que tienes que hacer es abrir tu archivo:

Imagen de montaña en Google Drive

Luego, vaya a su inspector web (para Chrome, Cmd-Shift-Io Ctrl-Shift-Idependiendo de su sistema operativo) y obtenga el enlace. ¡Hecho!

Imagen del enlace para la imagen que se muestra en el inspector web

El enlace funciona, pruébalo aquí .


Brillante - Esto debería ser el más votado a partir de 2020
Mehdi LAMRANI hace

1

Hay una opción de tipo de archivo en la API de Google Drive. Podría, tal vez, verificar si eso se resuelve en una imagen válida. Vería una opción en la que si el tipo de archivo me da una imagen no válida, obtendría una nueva URL directa para el archivo. Sin embargo, no he descubierto exactamente cómo hacer esto, pero tal vez ese sea un camino para intentar.


1

Puedes hacerlo directamente desde Drive y Gmail. Así es cómo:

1.Subir una imagen a Google Drive y establecer permisos para ver (puede ser público O cualquiera con enlace)

  1. Ve a Gmail> Redactar. Seleccione el + junto al icono de archivo adjunto.

  2. Seleccionar icono de unidad (forma de triángulo)

  3. Navegue a su imagen y haga clic con el botón derecho en copiar imagen url

  4. Pegue en el navegador web o incruste en páginas web según sea necesario.


Esto solo le da un enlace a todo el documento. No tiene ningún sentido hacer esto; ya tiene la URL del documento cuando lo está editando o viendo. ¡Amigos, dejen de publicar respuestas sobre cómo encontrar la URL del documento! Ya sabemos su URL.
Phil Goetz

1

1.Cambie la configuración de su imagen a público.

2. Obtenga su enlace para compartir.

3.Vaya a este sitio web y genere un enlace de descarga directa.

¡Trabajó para mi!


0

Con puede deshabilitar javascript en su navegador, abra el archivo de imagen y en la fuente de la página de vista o haga clic derecho en la imagen, verá el enlace de la imagen. (verifique la preferencia de compartir antes)


Sería un buen truco, pero si deshabilita javascript e intenta abrir un documento de google, recibirá el mensaje "JavaScript no está habilitado en su navegador, por lo que este archivo no se puede abrir. Habilite y vuelva a cargar".
Phil Goetz


0

Título de la función: goobox

Etiquetas: alojamiento de imágenes, expresiones regulares, URL, Google Drive, Dropbox, avanzado

  • return: string, devuelve una URL de cadena que se puede usar directamente como fuente de una imagen.
  • Cuando aloja una imagen en Google Drive o Dropbox, no puede usar la URL directa de su archivo para ser una fuente de imagen.
  • debe realizar cambios en esta URL para usarla directamente como fuente de imagen.
  • goobox() tomará la URL de su archivo de imagen y la cambiará para usarla directamente como fuente de imagen.
  • Importante: primero debe verificar los permisos de sus archivos y si es público.
  • ejemplo en vivo: 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

Sin embargo, esta respuesta es simple, de hecho muy simple y sí, muchos lo han mencionado que simplemente coloca la identificación de la imagen en el siguiente enlace https://drive.google.com/uc?export=view&id= {fileId}

Pero por fácil que sea, hice un script para ejecutar en la consola. Alimente una variedad de enlaces compartibles completos de Google Drive y conviértalos en el enlace anterior. Entonces se pueden usar simplemente como direcciones estáticas.

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)

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.