Google Docs tiene un visor en línea que permite que múltiples formatos de archivos sean visualizados en línea, entre otros formatos tenemos:- Microsoft Excel (.XLS and .XLSX)
- Microsoft PowerPoint 2007 / 2010 (.PPTX)
- Adobe Illustrator (.AI)
- Adobe Photoshop (.PSD)
- Autodesk AutoCad (.DXF)
- Scalable Vector Graphics (.SVG)
- TrueType (.TTF)
- …
Supongamos que tenemos una carpeta llamada Uploads en nuestro servidor, el cual está en la raiz de nuestra aplicación… esta carpeta contiene múltiples archivos que queremos que sean visualizados en línea, sin necesidad que el usuario los descargue.
Para visualizar un documento con el visor de Google Docs, debemos construir una url con esta estructura:
“http://docs.google.com/viewer?url=” + “la_url_de_tu_archivo” + “&embedded=true”Luego, añadimos un iframe a nuestra página, dicho iframe tendrá como src la url que construimos arriba.
Entonces, sabiendo esto nosotros, vamos a hacer recuperar los nombres de los archivos que están guardados en la carpeta Uploads y vamos a mostrar los documentos a través de un iframe:
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Integrar Visor de documentos Google con ASP.NET</title> </head> <body> <form id="form1" runat="server"> <asp:Literal ID="ltHTML" runat="server"></asp:Literal> </form> </body> </html>
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load If IsPostBack Then Return 'la carpeta en el servidor con los archivos a visualizar Dim di As New IO.DirectoryInfo(Server.MapPath("~\Uploads")) 'recuperamos los archivos Dim Files As IO.FileInfo() = di.GetFiles("*.*") 'elaboro el html Dim htm As New StringBuilder htm.Append("<table style='width: 100%'>") For Each f As IO.FileInfo In Files htm.Append("<tr>") htm.Append("<td style='padding: 20px auto'>") htm.AppendFormat("<iframe src='http://docs.google.com/gview?url=http://www.midominio.com/Uploads/{0}&embedded=true'", f.Name)
htm.Append(" style='width:50%; height:300px;' frameborder='0'></iframe>") htm.Append("</td>") htm.Append("</tr>") Next htm.Append("</table>") ltHTML.Text = htm.ToString() End SubAl ejecutar la página aspx verán que se visualiza igual que la imagen que muestro arriba.
Eso es todo. Espero que les sea de utilidad ;)
9 comentarios:
Hola...
He instalado la funcion de visualizar documentos...
Has tenido problemas para visualizarlos en internet explorer ?
Hola Jaime,
a qué tipo de documento te refieres?
Yo tenia un problema con mis equipos clientes ya que tenían diferentes plug-ins para ver documentos .TIF y .PDF pero logré independizar el navegador. Me sirvió mucho. Gracias!!
Hola, estoy probando tu ejemplo y me da el siguiente error:
"Lo sentimos, pero no hemos podido encontrar el documento en la fuente original. Comprueba que el documento aún existe.
También puedes intentar descargar el documento original haciendo clic aquí."
Al hacer click en aquí, me descarga correctamente el archivo... Tenés idea que puede ser?
Te paso la URL que estoy utilizando como SRC.
https://docs.google.com/gview?url=http://localhost/testGDocs/Docs/Hora.docx&embedded=true
Desde ya, muchas gracias.
Ignacio
hola Ignacio,
No debes utilizar localhost como parte de la ruta que le das a google, porque localhost sólo existe en tu PC, desde internet es desconocida...
en su lugar debes incluir un nombre de dominio, ejem:
NO VÁLIDO:
http://localhost/testGDocs/Docs/Hora.docx
VÁLIDO:
http://www.mi-dominio.com/testGDocs/Docs/Hora.docx
Saludos
Hola, sabés que el problema era con IE. Porque lo verifiqué en chrome y mozilla y ahí funciona bien. Gracias por responder.
Aprovecho para hacerte una consulta, si yo quiero editar el archivo... hay alguna manera que lo pueda hacer SIN necesidad de iniciar sessión con mi usuario google? La pregunta es porque no quiero tener que hacer que cada usuario de la aplicación que estoy desarrollando tengan que saber usuario y clave para acceder a la cuenta...
Saludos, Ignacio.
solo me funciona con pdf, con word o excel no me funciona sabes porque puede ser?
Buenas alguno que me pueda ayudar con la visualización de archivos.
Publicar un comentario