JavaScript: validation côté client vs. validation côté serveur
Qu'est-ce qui est le mieux pour faire la validation côté client ou côté serveur?
dans notre situation nous utilisons
- jQuery et MVC.
- données JSON pour passer entre Notre vue et le contrôleur.
une bonne partie de la validation que je fais consiste à valider les données au fur et à mesure que les utilisateurs les entrent.
Pour exemple, j'utilise le keypress événement pour prévenir les lettres dans une zone de texte, définir un nombre maximum de caractères et que un nombre est dans une gamme.
je suppose que la meilleure question serait, existe-il des avantages au serveur de validation côté client côté?
Génial réponses de tout le monde. Le site web que nous avons est protégé par mot de passe et pour une petite base d'utilisateurs(<50). S'ils n'utilisent pas JavaScript, nous enverrons des ninjas. Mais si nous concevons un site pour tout le monde, je serais d'accord pour faire une validation des deux côtés.
12 réponses
comme d'autres l'ont dit, vous devez faire les deux. Voici pourquoi:
Côté Client
vous voulez valider la saisie côté client d'abord parce que vous pouvez donner meilleur feedback à l'utilisateur moyen . Par exemple, s'ils saisissent une adresse courriel non valide et passent au champ suivant, vous pouvez afficher un message d'erreur immédiatement. De cette façon, l'utilisateur peut corriger chaque champ avant ils soumettent le formulaire.
Si vous ne valide sur le serveur, ils doivent soumettre le formulaire, un message d'erreur, et d'essayer de traquer le problème.
(cette douleur peut être atténuée en demandant au serveur de restaurer le formulaire avec l'entrée originale de l'utilisateur remplie, mais la validation côté client est encore plus rapide.)
Côté Serveur
Vous voulez valider sur le côté serveur parce que vous pouvez protéger contre l'utilisateur malveillant , qui peut facilement contourner votre JavaScript et soumettre des entrées dangereuses au serveur.
il est très dangereux de faire confiance à votre UI. non seulement ils peuvent abuser de votre UI, mais ils peuvent ne pas utiliser votre UI du tout, ou même un navigateur . Et si l'utilisateur édite manuellement L'URL, ou exécute son propre Javascript, ou modifie ses requêtes HTTP avec un autre outil? Et s'ils envoient des requêtes HTTP personnalisées à partir de curl ou d'un script, par exemple?
( ce n'est pas théorique; par exemple, j'ai travaillé sur un moteur de recherche de voyage qui a soumis la recherche de l'utilisateur à de nombreuses compagnies aériennes, Compagnies d'autobus, etc, en envoyant des demandes POST comme si l'utilisateur avait rempli le formulaire de recherche de chaque compagnie, puis a rassemblé et trié tous les résultats. Le formulaire JS de ces entreprises n'a jamais été exécuté, et il était crucial pour nous qu'ils fournissent des messages d'erreur dans le HTML retourné. Bien sûr, une API aurait été agréable, mais c'était ce que nous avait à faire. )
ne pas tenir compte de cela n'est pas seulement naïf du point de vue de la sécurité, mais aussi non standard: un client doit être autorisé à envoyer HTTP par N'importe quel moyen qu'il souhaite, et vous devez répondre correctement. Cela inclut la validation.
la validation côté serveur est également importante pour compatibilité - tous les utilisateurs, même s'ils utilisent un navigateur, N'auront pas JavaScript activé.
Addendum-Décembre 2016
il y a certaines validations que ne peut même pas être fait correctement dans le code d'application côté serveur, et sont tout à fait impossible dans le code côté client , parce qu'ils dépendent de l'état actuel de la base de données. Par exemple, "personne d'autre n'a enregistré ce nom d'utilisateur", ou "l'article de blog que vous commentez existe toujours", ou "aucune réservation existante ne chevauche les dates que vous avez demandé", ou "le solde de votre compte a encore assez de couverture de cet achat." seule la base de données peut valider de manière fiable des données qui dépendent de données connexes. "151980920 les" Développeurs régulièrement à vis de cette , mais PostgreSQL fournit quelques bonnes solutions .
Oui, la validation côté client peut être totalement contournée, toujours. Vous devez faire les deux, côté client pour fournir une meilleure expérience utilisateur, et côté serveur pour être sûr que l'entrée que vous obtenez est effectivement validée et pas seulement soi-disant validée par le client.
je vais juste le répéter, parce que c'est très important:
toujours valider sur le serveur
et ajouter JavaScript pour la réactivité de l'utilisateur.
l'avantage de la validation côté serveur par rapport à la validation côté client est que la validation côté client peut être contournée/manipulée:
- l'utilisateur final aurait pu désactiver javascript
- les données peuvent être envoyées directement à votre serveur par quelqu'un qui n'utilise même pas votre site, avec une application personnalisée conçue pour le faire
- une erreur Javascript sur votre page (causée par un certain nombre de choses) pourrait entraîner, mais pas tous, de votre validation en cours d'exécution
en bref - toujours, toujours valider côté serveur et ensuite considérer la validation côté client comme un "extra" ajouté pour améliorer l'expérience de l'utilisateur final.
vous doit toujours valider sur le serveur.
avoir également une validation sur le client est agréable pour les utilisateurs, mais est totalement incertain.
vous pouvez faire la validation côté serveur et renvoyer un objet JSON avec les résultats de la validation pour chaque champ, en gardant le client Javascript au minimum (juste l'affichage des résultats) et en ayant toujours une expérience conviviale sans avoir à se répéter sur le client et le serveur.
Eh bien, je trouve encore de la place pour répondre.
en plus des réponses de Rob et Nathan, j'ajouterais que les validations côté client sont importantes. Lorsque vous appliquez des validations sur vos formulaires Web, vous devez suivre les directives suivantes:
Côté Client
- doit utiliser des validations côté client afin de filtrer les demandes authentiques provenant d'utilisateurs authentiques sur votre site web.
- le la validation côté client devrait être utilisée pour réduire les erreurs qui pourraient se produire pendant le traitement côté serveur.
- la validation côté Client devrait être utilisée pour minimiser les allers-retours côté serveur afin que vous économisiez la bande passante et les requêtes par utilisateur.
Côté Serveur
- vous ne devez pas présumer que la validation effectuée avec succès auprès du client est parfaite à 100%. Peu importe même s'il dessert moins de 50 utilisateurs. Vous ne jamais savoir qui de votre utilisateur/emplyee transformer en un "mal" et de faire une activité nuisible en sachant que vous n'avez pas les validations appropriées en place.
- même si elle est parfaite en termes de validation d'adresse e-mail, numéros de téléphone ou de vérification de quelques entrées valides, elle pourrait contenir des données très nuisibles. Qui doit être filtré du côté du serveur, peu importe si c'est correct ou incorrect.
- si la validation côté client est contournée, vos validations côté serveur viennent vous sauver de tout dommage éventuel à votre traitement côté serveur. Ces derniers temps, nous avons déjà entendu beaucoup d'histoires d'Injections SQL et autres sortes de techniques qui pourraient être utilisées afin d'obtenir un mal d'avantages.
les deux types de validation jouent des rôles importants dans leur champ respectif, mais le plus fort est le côté serveur. Si vous recevez 10k utilisateurs à un point de temps unique, alors vous finirez certainement par filtrer le nombre de demandes à venir sur votre serveur web. Si vous constatez qu'il y a eu une seule erreur comme une adresse e-mail invalide, alors ils postent à nouveau le formulaire et demandent à votre utilisateur de le corriger ce qui va certainement manger les ressources de votre serveur et la bande passante. Il est donc préférable d'appliquer la validation javascript. Si javascript est désactivé, alors votre validation côté serveur viendra à la rescousse et je parie que seuls quelques utilisateurs pourraient l'avoir accidentellement désactivé puisque 99,99% des sites Web utilisent javascript et son déjà activé par défaut dans tous les navigateurs modernes.
côté Client devrait utiliser une validation de base via HTML5 types d'entrée et attributs de modèle et comme ceux-ci ne sont utilisés que pour les améliorations progressives pour une meilleure expérience de l'utilisateur (même si elles ne sont pas prises en charge sur < IE9 et safari, mais nous ne nous en appuyons pas sur eux). Mais la validation principale devrait se faire du côté du serveur..
JavaScript peut être modifié à l'exécution.
je suggère un modèle de création d'une structure de validation sur le serveur, et de partager cela avec le client.
vous aurez besoin d'une logique de validation séparée aux deux extrémités, ex:
"required" attributs sur inputs côté client
field.length > 0 côté serveur.
mais l'utilisation de la même spécification de validation éliminera certains redondance (et erreurs) de la validation de miroir aux deux extrémités.
Je suggérerai de mettre en œuvre la validation client et serveur il maintient le projet plus sûr......si je dois en choisir un, j'utiliserai la validation côté serveur.
Update Jul 23 2018: le lien suivant n'est plus accessible:
Vous pouvez trouver des informations ici http://www.webexpertlabs.com/server-side-form-validation-using-regular-expression /
je suis tombé sur un lien intéressant qui fait une distinction entre erreurs grossières, systématiques, aléatoires.
Client-Side validation convient parfaitement pour prévenir les erreurs grossières et aléatoires. Typiquement une longueur maximale pour la texture et l'entrée. Ne pas imiter la règle de validation côté serveur; fournir votre propre règle générale de validation du pouce (ex. 200 caractères côté client; n côté serveur dicté par une règle d'affaires forte).
Server-side validation convient parfaitement pour prévenir les erreurs systématiques; il permettra de faire respecter les règles commerciales.
dans un projet auquel je participe, la validation se fait sur le serveur via des requêtes ajax. Sur le client j'affiche des messages d'erreur en conséquence.
pour en savoir plus: erreurs grossières, systématiques, aléatoires:
https://answers.yahoo.com/question/index?qid=20080918203131AAEt6GO
si vous faites la validation de la lumière, il est préférable de le faire sur le client. Il sauvera le trafic réseau qui aidera votre serveur à mieux fonctionner. Si cela complique la validation qui consiste à extraire des données d'une base de données ou quelque chose comme les mots de passe, alors il est préférable de le faire sur le serveur où les données peuvent être vérifiées en toute sécurité.