Comment obtenir un navigateur web pour télécharger un fichier qui est stocké dans un JavaScript Chaîne?
J'ai été capable d'écrire du JavaScript pour provoquer le navigateur à télécharger un fichier à partir d'un serveur distant à l'aide de code comme ceci:
var iframe = document.createElement("iframe");
iframe.style.display = "none";
iframe.src = "filename.zip"
document.body.appendChild(iframe);
Qui fonctionne très bien. Cependant, maintenant j'ai une autre situation où le contenu du fichier sont stockées dans une chaîne de caractères dans mon JavaScript sur le navigateur de côté et j'ai besoin de déclencher un téléchargement de ce fichier. J'ai essayé de remplacer le troisième ligne au-dessus de cela, où 'myFileContents' est la chaîne de caractères contenant les octets du fichier:
iframe.src = "data:application/octet-stream;base64," + Base64.encode(myFileContents);
Cette obtient le fichier téléchargé, mais le nom de fichier est perdu. Dans google Chrome, le nom de fichier est seulement "télécharger". Aussi j'ai lu qu'il existe des limites à la taille de fichier autorisés dans certaines versions du navigateur.
Est-il un moyen pour y parvenir? À l'aide de JQuery serait OK. La solution doit soutenir tout type de fichier - zip, pdf, csv, png, jpg, xls, etc...
OriginalL'auteur Sean N. | 2013-05-08
Vous devez vous connecter pour publier un commentaire.
Dans certains navigateurs plus récents vous pouvez utiliser la nouvelle HTML5 télécharger attribut sur le
a
balise de réaliser ceci:Pour une solution d'avenir vous pourriez regarder dans le HTML5 système de fichiers de l'API, mais cette API est actuellement pas pris en charge dans la plupart des principaux navigateurs. Il peut ne pas être d'une grande utilité pour vous, sauf que ce qui peut vous donner une autre façon de stocker les fichiers en local, si vous êtes OK avec ça. Mais il ne stocke pas les fichiers sur les utilisateurs du localement système de fichiers accessible, vous devez développer votre propre navigateur de base de l'interface pour les utilisateurs à interagir avec les fichiers. Le téléchargement des fichiers à partir de l'HTML5 système de fichiers pour les utilisateurs du système de fichier local serait en tout cas à nouveau être effectué à l'aide du nouveau téléchargement attribut sur un
a
tag, qui serait alors de faire référence à un emplacement dans le fichier HTML5 système au lieu de se référer à un emplacement en ligne.Faire cela avec une
iframe
élément que vous auriez à en quelque sorte mis leContent-Disposition
en-tête de requête sur l'iframe àinline; filename="filename.txt"
à l'aide de code JavaScript coté client, je ne pense pas que c'est possible de le faire, probablement en raison de problèmes de sécurité. Si vous n'avez vraiment pas d'autre option que vous pourriez tuer la vitesse de téléchargement de la performance par l'envoi d'une chaîne de caractères au serveur à l'aide d'AJAX, puis de le télécharger à partir de là de nouveau avec le bouton droit de demander les en-têtes set.Votre solution fonctionne très bien sous Chrome, mais ne fonctionne pas dans les autres navigateurs. Je suis d'accepter cette réponse jusqu'à ce qu'une meilleure suggestion est faite. Je pensais il y a encore un moyen d'utiliser l'iframe truc avec une sorte de faux ajax post et de faire semblant de réponse, mais je ne sais pas comment faire.
Au lieu de
a.click()
vous pouvez utiliservar clickEvent = document.createEvent("MouseEvent"); clickEvent.initEvent("click", true, true); a.dispatchEvent(clickEvent);
pour le faire fonctionner dans Firefox & Chromemaintenant cela ne fonctionne pas avec Chrome 65 developers.google.com/web/updates/2018/02/...
OriginalL'auteur Mathijs Flietstra