Lecture de Fichiers stockés sur un URL à l'aide d'un Fichier HTML5 API

Je suis en utilisant HTML5 fichier API pour télécharger des fichiers de mon application web.

J'ai un élément de saisie sur ma page web à l'aide de laquelle je lis des fichiers et de l'appel en fonction de téléchargement

<input type="file">

$('input[type="file"]').on("change",function(e){
      console.log(this.files);
      //upload each file in this.files
});

Cela fonctionne parfaitement pour les fichiers natifs sur les os. Je veux à présent télécharger des fichiers distants, par exemple, example.com/blah/file1.jpg Ma question est comment puis-je lire ce fichier à l'aide de Fichiers de l'API? Est-il un moyen de le faire?

Juste le fait de fournir une zone de texte pour l'utilisateur de coller l'URL. Ensuite, du côté serveur, vous pouvez récupérer le fichier en fonction de l'URL.
non ce qui doit être fait sur le côté client, c'est une extension de navigateur. J'ai besoin de télécharger d'abord le fichier dans le navigateur de l'utilisateur, puis le télécharger.
Pourquoi avez-vous besoin de télécharger à l'utilisateur de l'ordinateur, puis les transférer sur un serveur? C'est une étape supplémentaire. Stocker dans du JavaScript mémoire serait de mauvaise performance sage, ainsi que de manger de l'utilisateur de la bande passante.
parce que je n'ai pas le serveur... j'ai besoin de leur envoyer des bits du fichier afin de le télécharger.

OriginalL'auteur sublime | 2014-07-14

8

Vous pouvez télécharger des fichiers à distance sur XMLHttpRequest, et de les traiter comme Blob. Puis le télécharger sur un autre serveur. Le téléchargement doit être plus XMLHttpRequest. Il s'appuie sur le navigateur de mise en œuvre de XHR Niveau 2. Ce lien contient les extraits de code, vous aurez besoin de:

http://www.html5rocks.com/en/tutorials/file/xhr2/

Il a les deux extraits pour le téléchargement de fichiers à distance comme un Blob et de téléchargement d'une Blob à un serveur.

merci tiger, il a travaillé comme un charme, sauf que je perds toutes les métadonnées quand je dis var blob = new Blob([cette.réponse], {type: 'image/png'}); comment puis-je obtenir le nom du fichier après avoir fait cela?
Je ne pense pas qu'il y a "nom de fichier" si nous sommes récupération d'un fichier sur le réseau. Dire que c'est /download?id=1234, il n'y a pas de nom de fichier. Donc, vous devez définir vos propres règles au sujet d'obtenir le nom de fichier. Vous pouvez suivre ce que la plupart des navigateurs à faire: 1. Prendre la dernière partie du chemin de l'URI et de le traiter comme un fichier; 2. Si content-disposition existe dans l'en-tête de réponse, suivre la norme et de l'usage qu'en est-il que le nom.
Merci, une dernière question: certaines url de l'image que j'obtiens sont encodées en base64 des chaînes de données. données:image/jpeg;base64,/9j/4AAQSkZJRgABAQ... et quand c'est le cas, le navigateur renvoie une erreur en disant XMLHttpRequest ne peut pas charger des données:l'image, l'origine de la croix demandes sont prises en charge uniquement pour HTTP. Comment puis-je télécharger ces images?
tant pis, j'ai trouvé ceci sur la façon de convertir dataURI à l'image blob stackoverflow.com/questions/4998908/...

OriginalL'auteur Cat Chen

Vous devez vous connecter pour publier un commentaire.