Exemple de comment tester si un fichier existe avec du javascript:
Tester si le fichier existe
Soit le fichier json suivant data.json:
{"file_1": {"status": "0","author": "John","size": "3245"},"file_2": {"status": "1","author": "Jane","size": "19462"}}
Pour tester si le fichier existe avec du javascript on peut créer une simple page html (test.html par exemple) et faire comme dans cet exemple:
<!DOCTYPE html><html lang="en"><head><title>Test</title><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script></head><body><script>window.onload = function(){$.get("data.json").done(function(data){console.log('file is ready !');console.log(data);}).fail(function() {console.log('Oups ! file not found ...');})}</script></body></html>
Note: pour pouvoir utiliser le code ci-dessus il est nécessaire de lancer un http serveur. Pour cela on peut par exemple utiliser python 3 et lancer la commande suivante dans votre terminal:
python -m http.server 8001
puis d'ouvrir le web browser chrome par exemple et se rendre dans l'url suivante http://0.0.0.0:8001/. Avec chrome on peut alors afficher la console javascript en allant dans le menu View -> Developer -> JavaScript Console, permettant ainsi de lancer et de tester le code ci-dessus.
On peut alors tester deux cas: (1) le fichier data.json existe:
(2) le fichier data.json n'existe pas:
Tester si le fichier existe à intervalle régulier
On peut aussi tester à intervalle régulier (par exemple toutes les secondes) si le fichier existe en utilisant la fonction setInterval(). Soit un dossier quelconque suivant contenant la page test.html:
/LabTest/test.html
avec le code test.html suivant
<!DOCTYPE html><html lang="en"><head><title>Test</title><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script></head><body><script>window.onload = function(){var timerForLoadingResult = setInterval(ajaxCall, 1000);function ajaxCall() {$.get("data.json").done(function(data){console.log(data);console.log('file is ready !');clearInterval(timerForLoadingResult)}).fail(function() {console.log('Oups ! file not found ...');})}}</script></body></html>
En allant alors sur la page http://0.0.0.0:8001/test.html, le code ci dessus va tester toutes les secondes si le fichier data.json existe. Une fois que le fichier existe le code va arrêter la fonction ajaxCall() avec la commande clearInterval(timerForLoadingResult):
Arrêter de tester si le fichier existe au bout d'un temps donné
On peut aussi décider de stopper la recherche d'un fichier si cela prend trop de temps. Par exemple au bout de 10 secondes:
<!DOCTYPE html><html lang="en"><head><title>Test</title><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script></head><body><script>window.onload = function(){var startTime = new Date().getTime();var interval = setInterval(function(){if(new Date().getTime() - startTime > 10000){clearInterval(interval);return;}console.log('Hello World !');}, 2000);}</script></body></html>
Exemple avec le fichier data.json:
<!DOCTYPE html><html lang="en"><head><title>Test</title><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script></head><body><script>window.onload = function(){var startTime = new Date().getTime();var timerForLoadingResult = setInterval(ajaxCall, 1000);function ajaxCall() {$.get("data.json").done(function(data){console.log(data);console.log('file is ready !');clearInterval(timerForLoadingResult)}).fail(function() {console.log('Oups ! file not found ...');if(new Date().getTime() - startTime > 10000){clearInterval(timerForLoadingResult);return;}})}}</script></body></html>
Références
| Liens | Site |
|---|---|
| Wait for a file using Jquery | stackoverflow |
| how do you set interval to ajax call in jquery [closed] | stackoverflow |
| how to make a setInterval stop after some time or after a number of actions? | stackoverflow |
| Using jQuery's ajax method to retrieve images as a blob | stackoverflow |
| How do I check if file exists in jQuery or pure JavaScript? | stackoverflow |
| Asynchronous JavaScript #2 - AJAX Requests | youtube |
| JavaScript setInterval() Function - p5.js Tutorial | youtube |
