IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

AJAX Discussion :

Contrôle connexion sur Google Chrome


Sujet :

AJAX

  1. #1
    Membre à l'essai
    Homme Profil pro
    Assistant data manager
    Inscrit en
    Février 2015
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Assistant data manager

    Informations forums :
    Inscription : Février 2015
    Messages : 24
    Points : 20
    Points
    20
    Par défaut Contrôle connexion sur Google Chrome
    Bonjour !
    Je fais ce topic car je galère depuis un moment sur un souci.
    Je travaille sur une application web utilisée en interne dans mon entreprise (petite entreprise de 10 personnes environ). Celle-ci permet de rentrer des données au fur et à mesure. Elle fonctionne en MySQL/PHP, avec du Javascript. Je débute un peu dans tous ces langages (on travaillait avant sous Access, j'ai commencé le PHP il y a un an). Je n'ai pas encore vraiment commencé à toucher le JQuery et l'AJAX, mais j'ai un petit souci qui pourrait être réglé avec. Si on ne peut pas le régler maintenant, tant pis, ce n'est pas urgent et j'ai d'autres améliorations prioritaires, mais tant qu'à faire, ça aiderait un peu mes utilisateurs.
    En fait, le gros défaut de mon application, c'est que mes utilisateurs sont parfois en wi-fi, ils rentrent des données dans les formulaires, mais, si pour une raison la connexion lâche, ils perdent les données (pour le moment on a toujours pu reconstruire, d'autant je "force" à sauvegarder régulièrement, mais c'est sûr que c'est pas top).
    Je voudrais donc, au moment où mon utilisateur clique sur le bouton "Save" qu'un code s'exécute, contrôle si l'utilisateur est bien connecté au serveur (il s'agit d'une NAS interne à l'entreprise, l'application n'est pas sur Internet), et s'il n'est pas connecté, elle renvoie "false" afin d'annuler la soumission du formulaire (avec un message d'alerte, tout ça). A noter que pour certaines raisons, j'ai besoin de travailler sur Google Chrome (entre autres pour les échelles analogiques dont on a besoin, et dont la présentation sur internet explorer est problématique, donc en attendant que j'arrive à "créer" moi-même ces échelles, on est un peu bloqués sur ce navigateur).

    Actuellement, j'ai deux méthodes pour arriver à ce résultat, mais les deux présentent un problème.

    Premier cas (qui serait mon préféré s'il fonctionnait) :
    Evénement onclick sur le bouton save, cette fonction s'exécute :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
        function ping(){
           $.ajax({
              url: 'ping.html',
              success: function(result){
    			//  document.getElementById("btnSave").setAttribute("connexionBD", "1");
                 return true;
              },     
              error: function(result){
    			 // document.getElementById("btnSave").setAttribute("connexionBD", "0");
                  alert('Veuillez vérifier votre connexion');
    			  return false;
              }
           });
        }
    Donc le principe : on lance une connexion sur la page ping.html : si ça fonctionne, on est bien connecté au serveur, si ça ne fonctionne pas, on n'est pas connecté au serveur.
    Alors le problème de ce code, les return ne semblent pas fonctionner, en fait, le cas success/error semble se gérer après la soumission du formulaire... J'ai testé en attribuant à mon bouton de sauvegarde une valeur "connexionBD", par défaut à 1. Vous avez les deux lignes que j'ai mis en commentaire ou connexionBD passe à 1 ou 0 en fonction de si on est connecté ou pas, et effectivement, la valeur reste à 1 même si la connexion ne se fait pas, en fait, elle passe à 0 en toute fin du code (j'ai testé en exécutant le code autre part qu'à la soumission du formulaire).
    J'ai même testé de lancer une fonction maitrePing() qui elle même lancer la fonction ping(), puis faisait un alert() sur l'attribut "connexionBD", celui-ci reste toujours à 1, mais passe bien à 0 après l'exécution de de maitrePing().

    Bref, à partir de là, j'ai voulu tenter une astuce, et on arrive à mon second cas :
    Je lance ping() en onmouseover sur le bouton save. Du coup, l'attribut connexionBD se met à jour, puis une nouvelle fonction exécutée sur le click vérifie la valeur de connexionBD, si c'est 1, ça sauvegarde, si c'est 0 ça avertit l'utilisateur. Alors c'est pas super beau niveau programmation je trouve, mais ça marche... du moins pas toujours. Le souci étant que Chrome me garde le ping en cache j'ai l'impression. En réalité, tant qu'il repère une première fois ping.html, vu qu'après, en modifiant le nom de ping.html ou en coupant ma connexion, il soumet tout de même le formulaire sans broncher. Je peux cliquer sur save tant que je veux, il ne bronche pas, tant que je ne vide pas le cache...

    J'ai cherché quelques solutions pour forcer le cache à se vider mais aucune que j'ai testées ne fonctionnait...
    Voilà, j'espère avoir pu être précis sur mon souci. Je vous remercie pour votre attention, je continue à chercher des solutions de mon côté. Après que ce soit clair : si la deuxième solution est la plus simple (si vous trouvez comment empêcher le cache de garder ping.html en mémoire), ça ne me dérange absolument pas de l'appliquer même si elle est moins optimisée que la première, ça restera une solution temporaire le temps que je me mette sérieusement à AJAX.
    Merci beauacoup !

    Edit : En continuant à chercher, j'ai trouvé une solution qui réglait le problème de cache :
    J'ai remplacé
    par
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
     url: 'ping.html?nocache="'+Math.random(),
    Du coup le problème de cache est réglé. Je reste toujours à l'affut si quelq'un a une proposition pour le cas 1.
    Merci !

    Re-Edit : Bon bah au final, j'ai trouvé une autre solution. J'ai créé une fonction qui s'active à l'ouverture de ma page et qui contrôle si on est connecté tous les dixièmes de second et qui met à jour la propriété connectionbd en fonction. Lors du clic sur le bouton "save", la propriété est contrôlée et permet ou non la sauvegarde. Voilà, c'est pas idéal dans la mesure où ça sollicite sans arrêt le serveur, mais même sans grande connaissance en trafic, je doute que 10 pings par seconde posent un gros souci à notre réseau même si on est une dizaine de connectés. En fait le point qui me "chagrine" le plus dans cette solution et qu'il nécessite de placer deux fonctions (à l'ouverture et à la sauvegarde), alors qu'il est sûrement possible de n'en utiliser qu'une (à la sauvegarde).

  2. #2
    Membre confirmé Avatar de ma5t3r
    Homme Profil pro
    Développeur freelance
    Inscrit en
    Mai 2015
    Messages
    320
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur freelance
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Mai 2015
    Messages : 320
    Points : 492
    Points
    492
    Par défaut
    Ouh lala !
    Il en faut du courage pour lire ton roman :-)
    Premièrement, tu mélanges du javascript pur avec du jQuery
    Pour jQuery, on remplace
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    document.getElementById("btnSave").setAttribute("connexionBD", "1");
    Par
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $("#btnSave").attr("connexionBD", "1");
    Théoriquement ton attribut connexionBD devrait être data-connexionBD, c'est plus dans les recommandations W3C.

    Bon passons, ceci n'est qu'un détail.

    Lancer une requête ajax tous les 10ièmes de secondes tu pousses le bouchons un peu loin Maurice.
    D'autant plus que le serveur doit être sollicité full-time (Ajax est asynchrone d'où son nom). A mon avis, tu vas planter le serveur apache (faudrait faire le calcul).

    Pour ton cas, la partie la plus importante est que l'utilisateur ne perde pas la saisie de son formulaire si j'ai bien compris.

    Laisse ton serveur tranquille et sauvegarde la saisie dans le localstorage avant de poster tes données.
    Si la connexion n'est pas active (appel de ta page ping par exemple via ajax), tu affiches ta page index et tu remplis ton formulaire avec les données du localstorage.

    C'est ce que je ferais

  3. #3
    Expert éminent sénior

    Homme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2010
    Messages
    5 380
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Septembre 2010
    Messages : 5 380
    Points : 10 410
    Points
    10 410
    Par défaut
    Oui le localstorage est la solution la plus appropriée dans ce cas. Cela permettrait de sauvegarder les données rentrées sur le navigateur client si le serveur n'est pas disponible et de repeupler les champs du formulaire pour un nouvel affichage tant que la requête de mise à jour n'est pas effectuée.

    Au passage, ce n'est pas un problème de mélanger du javascript pur (on dit souvent "vanilla") avec du jQuery, et heureusement car toutes les fonctions javascript n'ont pas leur équivalent dans jQuery. Après dans certains cas comme dans ton exemple on gagne en concision avec la syntaxe jQuery donc autant utiliser les fonctionnalités de jQuery si on l'utilise par ailleurs, mais ce n'est pas une obligation. Je précise cela pour les débutants qui se demandent parfois comment résoudre tel ou tel problème avec jQuery... Il ne faut pas laisser penser qu'on utilise javascript ou jQuery, la plupart des scripts utilisent l'un et l'autre conjointement.

  4. #4
    Membre à l'essai
    Homme Profil pro
    Assistant data manager
    Inscrit en
    Février 2015
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Assistant data manager

    Informations forums :
    Inscription : Février 2015
    Messages : 24
    Points : 20
    Points
    20
    Par défaut
    Bonjour et merci pour vos réponses !
    Alors avant toutes choses désolé pour le temps que j'ai mis à vous répondre, je viens tout juste de rentrer de vacances et je ne pensais plus que ce topic recevrait une réponse ^^'

    Pour le Localstorage, j'ignorais complètement cette possibilité. Je vais me renseigner sur tout ça, mais effectivement, du peu que je viens de lire, ça me paraît être la solution la plus adaptée à mon problème !

    Par contre, pour la solution que j'ai mise en place (les 10 pings par seconde), ça fonctionne sans faire crasher le serveur, on l'a déjà testé. Après, c'est sûr que le fait de bosser dans une structure de 10 personnes aide à ce niveau, j'imagine que sur une plus grande entreprise, j'aurais effectivement eu des soucis. Mais de toutes façons, même si ça fonctionne, c'est toujours mieux d'opter pour une solution plus propre et moins gourmande^^

    Merci beaucoup !

  5. #5
    Expert éminent sénior

    Homme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2010
    Messages
    5 380
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Septembre 2010
    Messages : 5 380
    Points : 10 410
    Points
    10 410
    Par défaut
    Citation Envoyé par Karehaus Voir le message
    Mais de toutes façons, même si ça fonctionne, c'est toujours mieux d'opter pour une solution plus propre et moins gourmande^^
    Oui surtout que c'est un exercice intéressant que tu pourras reprendre/améliorer et utiliser éventuellement dans d'autres contextes. Là pour l'instant tu as juste créé un exemple de code à ne pas faire

Discussions similaires

  1. [Navigateur] Vos avis sur Google Chrome
    Par Scorpi0 dans le forum Google Chrome
    Réponses: 147
    Dernier message: 02/05/2013, 10h03
  2. bug slider sur google chrome et opéra
    Par liswann dans le forum jQuery
    Réponses: 3
    Dernier message: 09/11/2010, 10h35
  3. [RegEx] Regex pour extension page monitor sur google chrome
    Par Ellodie dans le forum Langage
    Réponses: 0
    Dernier message: 24/06/2010, 18h04
  4. Code marche sur google chrome mais pas sur ie
    Par evaflint69 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 29/10/2009, 18h09
  5. Décalage des images sur Google Chrome, Opera
    Par spy74 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 0
    Dernier message: 29/06/2009, 13h19

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo