11401 sujets

JavaScript, DOM et API Web HTML5

Pages :
Je ne suis sûrement pas le plus calé dans le domaine, mais je vois vraiment l'AJAX comme des solutions dans des cas précis pour soulager d'un rechargement de page.
Applications concrètes que j'ai faite :

- dans une procédure de creation de compte, à chaque KeyUp dans le champ input contenant le login, je fais une requete SQL pour savoir si ce que contient le champ (le futur login donc) existe déjà dans la base ou pas. J'empêche la validation du formulaire si le login existe déjà

- dans le cas d'un choix sur une liste dans un <select> dépendant d'un autre <select> (ex : on choisit un département puis on choisi un quotidien dépendant du département), je fais une requete SQL pour alimenter le 2è select en fonction du résultat du premier.

J'ai essayé de faire des choses plus "poussées" (navigation etc.) mais j'ai trouvé ça vraiment tès lourd et long, comparé à un php/sql classique.
Modérateur
Salut,

Je viens de m'apercevoir que je n'avais même pas réagi sur ce fil donc je me rattrape en donnant un point de vue. Smiley smile

Lorsque je veux afficher n'importe quoi dans ma page, un fil RSS, la météo, un article ou je ne sais quoi d'autre, je le fais en traitant ces informations côté serveur. Potentiellement parlant, il n'y a rien qui se trouve sur Netvibes, iGoogle ou autre que je ne sois pas capable d'afficher sans Ajax.

Avec un peu de mise en forme et quelques modifications de comportement (un drag'n'drop, un menu déroulant, une pseudo-popup au clic sur un lien, ... ), je peux reproduire les mêmes fonctionnalités des sites cités ci-dessus.

En revanche, le problème que je rencontre, c'est que quelquesoit les actions que je mène sur ma page, celles-ci ne sont pas mémorisées (une checkbox cochée, un menu ouvert, un champ rempli, un bloc déplacé, ...) ; une simple réactualisation suffit à tout faire sauter.

Alors à quoi peut bien me servir l'Ajax ?
A mémoriser tout ça justement.

A travers cette technique, je suis en mesure :

- de retracer la moindre de mes interactions avec la page en bidouillant l'historique,

- de ne mettre à jour que ce dont j'ai réellement besoin et, par cet intermédiaire, de gérer plus finement les données que je pourrais mettre en cache,

- de bookmarker ma page dans un état donné (par exemple, je commence à remplir un formulaire, je ferme mon navigateur, je le rouvre et je reviens sur la page ; je retrouve tout dans l'état où je l'ai laissé)

- de faire vivre ma page sans même y toucher (en mettant un fil RSS ou la météo à jour, par exemple, sans pour autant tout recharger)

A mes yeux, cette technique ne détériore pas l'ergonomie ; je dirais plutôt qu'elle l'améliore lorsqu'on s'en sert à juste titre.
La plupart des choses qu'on reproche à l'Ajax sont dûes au fait qu'on s'est longtemps servi de Javascript comme des ploucs en créant des contenus volatiles. D'ailleurs, ce phénomène est toujours d'actualité ; la prise de conscience est lente à se mettre en place.

Laurent Denis a écrit :
- incitation à surutiliser GET au détriment de POST. Problèmes de sécurisation.
Comme certains l'ont précisé, on peut faire du GET comme du POST en Ajax. En revanche, ce qu'on peut faire, c'est encoder ce qu'on transmet en MD5 ou en SHA-1, par exemple, et ce, avant de les transmettre. Cette technique permet donc, au moins dans ce cas, d'améliorer la sécurité.
Modifié par koala64 (06 Sep 2007 - 23:01)
Ajax présente des aspects très positifs lorsqu'il s'agit de valider des entrées sur le serveur...

Il en est ainsi lors de l'identification et la vérification du code d'accès d'un abonné qui, pour des motifs ce confidentialité, ne peuvent être opérés qu'à l'abri des regards extérieurs.

Il en est de même, lorsque les vérifications nécessaires exigent le recours à des données volumineuses qui encombreraient inutilement le poste client. Ainsi, l'identification d'une commune pourrait être pratiquée comme sur cette page réalisée à titre expérimental.

Il est ainsi possible d'utiliser une autre codage que l'utf-8 avec Ajax ! Le code ANSI/window-1252/CP1252, utilisé dans les fichiers de données de l'INSEE, autorise des recherches utilisant les expressions régulières sur des chaînes regroupant les noms de communes accentuées ou non. Il permet, en outre (que les ayatollahs de la validation se le disent !), le respect de la typographie des communes d'Œuf-en-Ternois ou d'Œuilly (deux communes homonymes dans l'Aisne et la Marne) ainsi que des 109 autres communes dont les noms font appel au œ !
Pour ma part, j'utilise autant que possible AJAX de manière aussi peu intrusive que possible, plus comme une "surcouche" qui améliore un peu l'expérience utilisateur (principalement dans les interfaces d'admin).

Par contre, j'ai dû reprendre des travaux de certains développeurs... houlala ! Des includes en veux-tu en voilà à grands coups d'Ajax sans prise en compte ne serait-ce que d'un Javascript désactivable... Smiley sweatdrop
Modifié par Nico3333fr (22 Jan 2010 - 08:55)
de base il est vrai qu'ajax ne permet pas l'historique, ni les signets, etc.... mais il y a des techniques pour les récupérer!

c'est d'ailleurs ce que j'ai fais. ici
Aussi ma navigation est utilisable au claviel.
Bref il ne faut pas jeter la peau de l'ours avant de l'avoir chassé!

si vous voulez m'aider à résoudre un dernier problème de compatibilité j'en serais ravi!

Bonne journée à vous
ajax y'a rien de plus puissant !


et même si les premières apparition des XMLHttpRequests datent de 1998 il était déjà possible de faire de des choses similaires bien avant...

rien n'empechait de deja utiliser le javascript pour modifier les différents éléments d'une page dynamiquement .. quant aux requetes, il suffissait par exemple d'appeler les données via une iframe cachée sur sa page et de récupérer les élément à l'aide de javascript pour les replacer sur sa page principale.


ajax, fête des fleurs !!
koala64 a écrit :

Comme certains l'ont précisé, on peut faire du GET comme du POST en Ajax. En revanche, ce qu'on peut faire, c'est encoder ce qu'on transmet en MD5 ou en SHA-1, par exemple, et ce, avant de les transmettre. Cette technique permet donc, au moins dans ce cas, d'améliorer la sécurité.



exactement, je viens de retomber sur un vieux site que j'avais fais en 2minutes pour une amie : http://ulb.comli.com/

en gros dans l'input "admin/connexion" le mot de passe entré est récupéré et envoyé au serveur, s'il est correct ça active une session php admin pour les appels futurs.. entretemps, sans tenir compte de la réponse du serveur, mon javascript compare localement le mot de passe admin a un md5 local (ça vaut zero niveau sécurité, mais c'est un petit site perso donc ... c'est juste pour le concepte et puis je mets au défi quiconque de reverser mon md5) et ça active déjà les options admin (création de joueurs, déplacement des pions etc..). bien évidement lors de l'utilisation de ses options... par exemple le déplacement d'un pion, sa position est envoyé au serveur via une requete qui ne l'enregistre QUE si la session php admin a été activé .. donc même si un petit malin active localement avec qqes injections javascript les "options admins" ... il pourra déplacer son pion localement mais ce ne sera pas enregistré sur le serveur. Smiley smile

l'avantage ici .. c'est que contrairement aux sites "normaux" ou ceux AJAX où il faut attendre une réponse du serveur pour se logger (ce qui même avec de bons serveur et un bon ordi prend en général plus de 0.1 secondes...), ici je suis connecté en 0 seconde ! franchement, ça se sent ...t'as pas fini de cliquer sur "enter" que ta page est deja affiché. ce qui pour un visiteur lambda fait très très "pro". Smiley lol

bon, en réalité ça n'a rien de pro hein !!! c'est un vieux site que j'avais fait en 2 minutes pour me taper une nana. Smiley cligne


edit: avec ce systeme, on pourra même encore aller plus loin, par exemple précharger les mots de passe (en hashé lorsqu'un user tape son loggin) et ainsi pour n'importe quel site activé l'utilisateur en instantanné ... on pourrait même concevoir de précharger le contenu de sa page .. même des données confidentielles dès qu'il a rentré son loggin (avant qu'il n'ai rentré son mot de passe) simplement en les cryptant avec des méthodes tels que RSA ... et la clé de décriptage serait simplement le mot de passe de l'utilisateur (+ une séquence chargé avec la page pour le faire varier d'une fois à l'autre)... comme ça les données seraient deja là avant même d'entrer son mot de passe... une fois son mot de passe entré, avant meme de cliquer sur "ok", on pourrait concevoir commencer à décrypter les données et précharger des éléments de la page.) ce qui impliquerait des connexion et accès aux contenus privés en 0 seconde ! c'est juste révolutionnaire !!

actuellement, je ne connais aucun autre site que mon monopoly ou j'ai cette impression "d’instantané" lors du login. Smiley murf

edit2: on pourrait même se passer du bouton "valider", imaginez qu'au moment du keydown de la dernière lettre de votre mot de passe la nouvelle page soit deja complètement(chargée et) affichée !
Modifié par bogs (11 Sep 2010 - 03:30)
en fait, c'est à ça que ça doit servir l'AJAX, à anticiper et à rendre la navigation instantanée ..

comme par exemple les recherches dans le moteur google qui te propose des mots au fur et à mesure que tu les tapes .. il fait des requetes en permanence pour prévoir la suite de ta séquence et deja avoir préchargé les qqes phrases qui pourraient venir. mais son utilisation (d'AJAX) n'empeche en rien une utilisation traditionnelle du site (ne supportant pas le javascript).


puis faut pas se mentir, contrairement au flash où on trouve encore qqes survivors ne le supportant pas, je n'ai jamais encore jamais vu aucun navigateur ne supportant pas le javascript. (et ne me sortez pas ceux fait par votre petit frère ou les populaires mais des années 92). ou alors sous firefox des geeks qui désactivaient volontairement le JS .. mais tanpis pour eux, j'ai envie de dire. (un peu comme si je désactivais mon flash et qu'après je dis, ah je ne peux plus aller sur youtube, quel site vraiment mal foutu) Smiley biggol
Comme dit Nico3333fr, je n'utilise l'AJAX (avec jQuery) uniquement pour rajouter une surcouche aux PHP et ainsi améliorer l'expérience utilisateur.

Exemple :
- navigation avec des onglets,
- drag and drop dans les dashboards,
- recherche dans FAQ

L'utilisation de l'UI jQuery est aussi très pratique pour construire un back office rapidement avec un css près à l'utilisation.

Pensée un site en AJAX est une "connerie" à mon sens.
Vous avez beau critiquer AJAX mais les plus grandes communautés virtuelles l'utilisent excessivement aujourdh'ui:
- Facebook
- gmail
- myspace
- twiter .... etc. 8-p Smiley smile
Pages :