Comment charger le contenu d'un fichier texte dans une variable javascript ?

Question

J'ai un fichier texte à la racine de mon application web. http://localhost/foo.txt et je voudrais le charger dans une variable en javascript en groovy je ferais ceci :

def fileContents = 'http://localhost/foo.txt'.toURL().text;
println fileContents;

Comment puis-je obtenir un résultat similaire en javascript ?

Answer 1

Cela devrait fonctionner dans presque tous les navigateurs :

var xhr=new XMLHttpRequest();
xhr.open("GET","https://12Me21.github.io/test.txt");
xhr.onload=function(){
    console.log(xhr.responseText);
}
xhr.send();

En outre, il y a le nouveau Fetch API :

fetch("https://12Me21.github.io/test.txt")
.then( response => response.text() )
.then( text => console.log(text) )

Answer 2

Une chose à garder à l'esprit est que Javascript s'exécute sur le client, et non sur le serveur. Vous ne pouvez pas vraiment "charger un fichier" depuis le serveur en Javascript. Ce qui se passe, c'est que Javascript envoie une demande au serveur, et le serveur renvoie le contenu du fichier demandé. Comment Javascript reçoit-il le contenu ? C'est à cela que sert la fonction de rappel. Dans le cas d'Edward, il s'agit de

    client.onreadystatechange = function() {

et dans le cas de danb, c'est

 function(data) {

Cette fonction est appelée à chaque fois que les données arrivent. La version jQuery utilise implicitement Ajax, elle rend simplement le codage plus facile en encapsulant ce code dans la bibliothèque.

Answer 3

Lorsque vous travaillez avec jQuery, au lieu d'utiliser jQuery.get par exemple

jQuery.get("foo.txt", undefined, function(data) {
    alert(data);
}, "html").done(function() {
    alert("second success");
}).fail(function(jqXHR, textStatus) {
    alert(textStatus);
}).always(function() {
    alert("finished");
});

vous pourriez utiliser .load qui vous donne une forme beaucoup plus condensée :

$("#myelement").load("foo.txt");

.load vous donne également l'option de charger des pages partielles, ce qui peut s'avérer pratique, cf. api.jquery.com/load/ .

Answer 4

Si votre entrée était structurée en XML, vous pourriez utiliser la fonction importXML fonction. (Plus d'informations ici à quirksmode ).

S'il ne s'agit pas de XML et qu'il n'existe pas de fonction équivalente pour importer du texte brut, vous pouvez l'ouvrir dans une iframe cachée et en lire le contenu.