Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

Problème avec xhr, comment débugger ?

2 réponses
Avatar
Une Bévue
J'ai un pb avec xhr et je ne sais comment débugger.
Alors le problème :
dans mon appli (HTML5 + JS) j'utilise xhr pour consulter une base de
données MongoDB via php.

grosso-modo j'ai trois requêtes :
queryAlbums()
queryPersons()
queryLocations()

quand j'ai reçu la réponse à queryAlbums() j'enchaîne avec
queryPersons() et quand la réponse est reçue je passe à queryLocations().

C'est là où se situe le problème :
après que queryLocations() soit lancée, je reçois une "fausse" réponse
avec le contenu de queryPersons() (que je reçois donc deux fois : une
fois après la vraie demande et une autre fois comme parasitaire), puis
la vraie réponse avec le contenu de queryLocations().

Le dialogue se fait en json, la structure du query est ainsi :
xhr.open("GET", url_mongo + "?json=" + JSON.stringify({mode: 'read',
collection: 'albums'}), true);
xhr.send();
ça c'est pour queryAlbums(),
pour queryPersons() j'ai simplement "collection: 'persons'"
et pour queryLocations() j'ai "collection: 'locations'"

Dans la réponse, le script php retourne le mode, la collection et les
résultats de cette manière :

{'mode': 'read', 'collection': 'locations', 'results': 'une array d'objets'}

et j'ai un switch/case qui envoie les différentes réponses sur le "bon
traitement :
if (xhr.readyState == 4 && xhr.status == 200) {
var datas = JSON.parse(xhr.responseText);
switch(datas.collection) {
case 'albums':
switch(datas.mode) {
case 'read':
showSelectAlbums(datas['result']);
break;
case 're-read':
updateSelectAlbums(datas['result']);
break;
default:
// nothing to do.
}
break;
case 'persons':
switch(datas.mode) {
case 'read':
showSelectPersons(datas['result']);
break;
default:
// nothing to do.
}
case 'locations':
switch(datas.mode) {
case 'read':
showSelectLocations(datas['result']);
break;
default:
// nothing to do.
}
break;
default:
// nothing to do.
}


Bon, voilà donc en résumé, je ne vois pas pourquoi après la requête :
function queryLocations() {
xhr.open("GET", url_mongo + "?json=" + JSON.stringify({mode: 'read',
collection: 'locations'}), true);
xhr.send();
}

je reçois deux réponses l'une avec le contenu de la précédente réponse à
queryPersons mais, semble t'il, avec "collection: 'locations'" puisque
mon switch/case envoie sur showSelectLocations(datas['result']).
et l'autre avec le "bon" contenu.

je m'interroge sur mon nom de collection 'locations' car en js il semble
que cela soit un mot réservé, cependant, en JS, ce nom de collection
n'apparaît que sous forme de string.

maintenant quand je regarde le debuggueur du butineur, à Network, je
n'ai bien que trois appels à ma db :
http://localhost/Photos/mongo.php?json={%22mode%22:%22read%22,%22collection%22:%22albums%22}

http://localhost/Photos/mongo.php?json={%22mode%22:%22read%22,%22collection%22:%22persons%22}

http://localhost/Photos/mongo.php?json={%22mode%22:%22read%22,%22collection%22:%22locations%22}

et quand j'ouvre ces trois urls dans un butineur (ici Opera Next) j'ai
les trois ==bonnes réponses== :
{"collection":"albums","mode":"read","result":[{"_id":"542d1b34fa91031d07d63af1","name":"Voyage
au Moyen-Orient - \u00e9t\u00e9
1963","startdate":{"sec":-202604339,"usec":0 ...

{"collection":"persons","mode":"read","result":[{"_id":"542acd41fa91037000d63af1","firstname":"Daniel","lastname":
...

{"collection":"locations","mode":"read","result":[{"_id":"542a661bfa9103186bd63af1","name":"chez
Arnaud","address": ...

Bien sûr, côté php j'ai le même genre de switch/case qu'en js pour
interroger la bd :
$out = array();
if(isset($_GET['json'])) {
$json = json_decode($_GET['json'], true);
if(isset($json['collection'])) {
$out['collection'] = $json['collection'];
if(isset($json['mode'])) {
$out['mode'] = $json['mode'];
switch($json['collection']) {
case 'albums':
switch($json['mode']) {
case 'read':
$out['result'] = getAlbums();
break;
...

2 réponses

Avatar
Gloops
Bonjour,

SAM aura peut-être une meilleure réponse (ou sera plus précis sur
l'implémentation), mais la première qui me vient à l'esprit est de faire
suivre chaque requête d'une boucle, pour attendre qu'une réponse soit reçue.



Une Bévue a écrit le 06/10/2014 10:24 :
J'ai un pb avec xhr et je ne sais comment débugger.
Alors le problème :
dans mon appli (HTML5 + JS) j'utilise xhr pour consulter une base de
données MongoDB via php.
Avatar
Une Bévue
Le 06/10/14 13:19, Gloops a écrit :
SAM aura peut-être une meilleure réponse (ou sera plus précis sur
l'implémentation), mais la première qui me vient à l'esprit est de faire
suivre chaque requête d'une boucle, pour attendre qu'une réponse soit
reçue.


Ah oui, j'ai oublié de dire, parce que ça me semblait évident, que
j'utilise :
xhr = new XMLHttpRequest();
xhr.addEventListener('readystatechange', controller, false);

puis ailleurs (dans controller donc) :

function controller(e) {
if (xhr.readyState == 4 && xhr.status == 200) {
var datas = JSON.parse(xhr.responseText);

xhr étant "dans" window :

var xhr; /* hors de toute fonction */