Re: Connexion asynchrone en javascript

Top Page

Reply to this message
Author: Mathieu Lonjaret
Date:  
To: Patrice Karatchentzeff
CC: GUILDE
Subject: Re: Connexion asynchrone en javascript
On Wed, 7 Jun 2023 at 11:15, Patrice Karatchentzeff
<patrice.karatchentzeff@???> wrote:
>
> Merci Mathieu pour les conseils.
>
> A priori, j'affiche tout côté serveur, donc c'est OK.
>
> C'est une bonne idée, curl, mais je ne vois pas trop comment passer de
> React Native à curl, donc ça me parait difficile.


Très grossièrement, je pense que ça devrait être quelque chose comme
curl -vvv -d "{ "login":"xx", "password":"xxx" }" http://$uriBase/connect

Mais si tu penses que ton problème est dans le callback côté client,
lors de la lecture de la réponse, et que la réponse envoyée par le
serveur est bien toujours la même, c'est sûr que curl ne va pas trop
t'aider dans ce cas là.

> Les en-têtes sont identiques, sauf
>
> pragma: no-cache
>
> (et le user-agent bien entendu) côté Chrome.
>
> Je ne sais pas trop comment l'activer côté FF, mais je vais creuser...


c'est pour ça que j'ai toujours le réflexe curl en premier aussi, vu
que ça permet d'avoir le contrôle total sur les headers que tu veux
envoyer :)

> Merci
>
> PK
>
> Le mer. 7 juin 2023 à 10:46, Mathieu Lonjaret
> <mathieu.lonjaret@???> a écrit :
> >
> > Hello,
> >
> > Sans avoir trop regardé le code encore (pas encore assez de thé dans
> > le système pour du javascript/React), je ne vais rien dire de magique,
> > mais dans cette situation:
> > - d'une part je commencerais par envoyer la même requête avec un curl,
> > - et d'autre part je mettrais plus de logs au différentes étapes côté
> > serveur pour être sûr. Genre est-ce que le serveur a bien reçu la
> > requête, est-ce qu'elle est bien parsée sans erreur, est-ce qu'elle
> > arrive dans le bon handler, etc.
> > - et dés qu'on parle d'une différence au niveau navigateurs, je
> > comparerais évidemment les headers reçus par le serveur d'un
> > navigateur à l'autre.
> >
> > hth,
> > Mathieu
> >
> >
> > On Wed, 7 Jun 2023 at 09:47, Patrice Karatchentzeff
> > <patrice.karatchentzeff@???> wrote:
> > >
> > > Salut,
> > >
> > > Je me tire des balles sur un truc que je considère comme assez
> > > élémentaire... Je veux connecter un font-end écrit en javascript (en
> > > React Native pour être exact) avec un back-end (utilisant Dancer2,
> > > mais cela a peu d'importance).
> > >
> > > J'essaie un truc tout con : je veux me connecter avec un login + mot
> > > de passe. Je câble tout en dur pour développer.
> > >
> > > J'envoie donc un paquet json contenant le login et le mot de passe au
> > > serveur, à la bonne adresse (route) et ce dernier lit le paquet,
> > > vérifie si l'association est bonne et renvoie connecté si elle est
> > > bonne et déconnecté sinon. Il renvoie un paquet json. Bref, le bon
> > > vieux trucs des années 90.
> > >
> > > Le code (en React Native, mais cela ne doit pas trop effrayer) :
> > >
> > > const jsonReader = { "login":"xx", "password":"xxx" } // la requête d'envoi
> > >
> > > const submitConnectAsync2 = async () => {
> > >     return fetch(
> > >       uriBase + '/connect', { // c'est l'adresse avec la bonne route
> > >     mode: 'no-cors', // beurk... but waiting for a nice workaround
> > > from Dancer2 side!
> > >     method: 'POST',
> > >     headers: {
> > >           'Accept' : 'application/json',
> > >           'Content-Type' : 'application/json',
> > >     },
> > >     body: JSON.stringify(jsonReader),
> > >       })
> > >       .then(response => response.json())
> > >       .then(json => {
> > >     setMessage(json);  // c'est du react, pour mettre à jour une variable
> > >     console.log("Coucou2");
> > >     //return json.ConnectionState;
> > >       })
> > >       .catch(error => {
> > >     console.log("Transaction error:", error);
> > >     console.log("body:", JSON.stringify(jsonReader));
> > >     //console.log("response:", response);
> > >     //console.log("json:", json);
> > >       });
> > >   };

> > >
> > >  useEffect(() => {
> > >     submitConnectAsync2();
> > >   }, []);

> > >
> > >
> > > J'utilise donc une connexion asynchrone. Cela fonctionne bien côté
> > > serveur : il identifie le paquet json, démarre une session et renvoie
> > > la bonne valeur selon le login/mot de passe.
> > >
> > > En revanche, je me tire des balles, car selon FF ou Chrome, cela
> > > fonctionne... ou pas ! FF lit bien la requête de retour et Chrome
> > > prétend qu'il ne la voit pas !
> > >
> > > Au début, je croyais que Chrome se plantait, car il reconnait bien le
> > > cookie d'initialisation de session, que j'active lorsque j'ai reçu le
> > > bon couple login/mot de passe, côté back-end. Mais en grattant côté
> > > FF, je me rends compte que le code de retour n'est pas vu : le
> > > console.log('Coucou2") n'est jamais exécuté.
> > >
> > > En effet, si je développe le code d'erreur, j'ai un bien mystérieux :
> > >
> > > Transaction error: SyntaxError: JSON.parse: unexpected end of data at
> > > line 1 column 1 of the JSON data App.js:326
> > >
> > > Il semblerait que le code JSON de retour soit miteux, ce qui pourrait
> > > expliquer que Chrome ne le comprenne pas.
> > >
> > > Pourtant, le débugueur de FF le lit bien et il correspond exactement à
> > > ce qui est envoyé par le back-end. Le truc est propre côté back-end a
> > > priori (c'est du perl bien robuste...).
> > >
> > > Du coup, je suis paumé... Qui a une idée pour me dépanner ? Je
> > > n'aurais jamais imaginé passer des heures sur un truc aussi con...
> > >
> > > Merci
> > >
> > > PK
> > >
> > > --
> > >       |\      _,,,---,,_           Patrice KARATCHENTZEFF
> > > ZZZzz /,`.-'`'    -.  ;-;;,_   mailto:patrice.karatchentzeff@gmail.com
> > >      |,4-  ) )-,_. ,\ (  `'-'
> > >     '---''(_/--'  `-'\_)

> > >
>
>
>
> --
>       |\      _,,,---,,_           Patrice KARATCHENTZEFF
> ZZZzz /,`.-'`'    -.  ;-;;,_   mailto:patrice.karatchentzeff@gmail.com
>      |,4-  ) )-,_. ,\ (  `'-'
>     '---''(_/--'  `-'\_)