Cómo acceder y descargar un archivo desde un servidor utilizando HTML 5

Actualmente estoy trabajando en un sitio web que los usuarios pueden descargar archivos de medios binarios de (principalmente .mp3). Necesitamos una forma para que el botón "Descargar" guarde el archivo en la ubicación especificada del usuario en las preferencias de su navegador, y debe mostrar de alguna manera una barra de progreso.Cómo acceder y descargar un archivo desde un servidor utilizando HTML 5

Actualmente, lo único que me preocupa es encontrar una forma de implementar esto usando HTML5 y hacerlo de tal manera que en versiones futuras podremos acceder posteriormente a esa secuencia para que una vez que obtengamos esta descarga básica seamos parte codificado, de alguna manera podemos implementar una barra de progreso en el futuro.

sé HTML5 tiene una API de archivos, pero muy pocos navegadores actualmente permitir su aplicación, y necesitamos que esto funcione en IE 7+ y versiones de Chrome y Firefox utiliza regularmente.

Gracias por su ayuda!

Fuente

2011-10-05 trevorhinesley

mayoría de los navegadores ya implementan descarga de archivos w/barra de progreso. Estoy confundido por la línea * "guardar el archivo en la ubicación especificada por el usuario en las preferencias de su navegador" * - Si desea que el usuario sea capaz de descargar el archivo, sólo tiene que proporcionar un enlace a la misma. –

bien, pero quieren que la barra de progreso al lado del botón "Descargar", por lo separe de la barra de progreso del navegador. ¿Tiene sentido? – trevorhinesley

No, en absoluto. ¿Cuál es la barra de progreso junto al botón Descargar que se supone rastrea el progreso de? La descarga del archivo? –

HTML5 es compatible con el atributo download: http://webreflection.blogspot.com/2011/08/html5-how-to-create-downloads-on-fly.html

Ejemplo:

<a href="http://.../bad-romance.mp3" download="Bad Romance.mp3">Save "Bad Romance" to your computer</a>

Al hacer clic en esto permitirá que el navegador para manejar la descarga (en lugar de abrir el archivo con cualquier aplicación que está asociada con el tipo MIME) , incluida una barra de progreso.

Nota: Realmente desea tener cuidado de no desviarse de la expectativa normal del usuario tratando de crear su propia implementación. Esto es sinónimo de forzar que un enlace se abra en una nueva pestaña; puede ser confuso para el usuario si espera un comportamiento pero recibe otro. En su caso, intente explicar específicamente que se tratará de un enlace de "descarga", no de "reproducción". El ejemplo anterior hace esto, pero un ícono de "descarga" también puede ser suficiente.

Fuente

2011-11-12 06:18:50

Si desea realizar el enlace de descarga en un botón en su lugar, sólo se puede colocar un elemento dentro de un <input><a>:

<a href="example.mp3" download="EnterSongNameHere.mp3"> 
    <input type="button" value="<!-- enter song name here -->" /> 
</a>

y también se puede utilizar DOM para cambiar dinámicamente el href del elemento. Ejemplo de mi blog, donde el botón de descarga en cuestión es básicamente un "Guardar como" botón:

<a id="downloadThisPage" download="OpenMe.html> 
    <input type="button" value="See for yourself" /> 
</a> 
<script type="text/javascript"> 
    document.getElementById("downloadThisPage").href = window.location.toString(); 
</script>

Espero que esto ayude ...

Fuente

2013-05-04 22:37:52

Cómo acceder y descargar un archivo desde un servidor utilizando HTML 5

Respuesta

Cuestiones relacionadas