Les vulnérabilités de sécurité frontale doivent être prises au sérieux. Les mesures de prévention des XSS comprennent l'évasion d'entrée, l'utilisation du CSP, d'éviter les opérations de script en ligne et la définition d'attributs de cookies; Les méthodes de réponse CSRF incluent l'attribut Samesite, le jeton anti-CSRF et les demandes de post; Les bibliothèques tierces doivent vérifier et mettre à jour régulièrement, utiliser des outils d'audit et éviter les plug-ins inconnus; D'autres problèmes tels que l'activation des HTTP, ne pas exposer des informations sensibles, la mise en cache raisonnable et la prévention du détournement de clics doivent également être prêts attention.

Les vulnérabilités de sécurité frontale ne sont en fait pas loin de nous, surtout maintenant que les fonctions de la page Web deviennent de plus en plus complexes et que les interactions utilisateur deviennent de plus en plus. Beaucoup de gens pensent que le frontal affiche simplement du contenu, mais en fait, de nombreuses attaques commencent à partir d'ici. Par conséquent, pendant le processus de développement, nous devons considérer certains risques de sécurité communs à l'avance et prendre des mesures de protection correspondantes.

Comment empêcher les XS (attaque de script de site transversal)?

XSS est l'un des problèmes de sécurité frontaux les plus courants. L'attaquant injecte des scripts malveillants dans la page et les exécute lorsque d'autres utilisateurs parcourent, volant ainsi des cookies, détournant des séances ou lancement d'attaques de phishing.

Il y a plusieurs points clés pour empêcher les XS:

• échappez à l'utilisateur d'entrée : HTML s'échappe avant d'afficher si l'utilisateur entre dans les commentaires, les noms d'utilisateur ou le contenu.
• Utilisation de la politique de sécurité du contenu (CSP) : Il s'agit d'un en-tête de réponse HTTP qui peut limiter les ressources qui peuvent être chargées et exécutées, empêchant efficacement l'exécution de scripts en ligne.
• évitez innerhtml ou dangereusement-intinnerhtml : ce type d'opération est enclin à introduire du code malveillant, essayez d'utiliser une méthode plus s?re pour mettre à jour le DOM.
• Définissez les propriétés httponly et sécurisées du cookie : de cette fa?on, même s'il est injecté dans le script, le cookie ne peut pas être lu.

Maintenant, de nombreux cadres tels que React ont effectué des défenses partielles par défaut, mais ils ne peuvent pas compter entièrement sur le cadre, donc comprendre les principes est plus important.

Comment gérer le CSRF (contrefa?on de demande croisée)?

Le c?ur du CSRF est que l'attaquant incite l'utilisateur à accéder à un site Web malveillant, puis utilise l'état de connexion de l'utilisateur pour lancer des demandes qui ne sont pas destinées, comme le transfert d'argent, les informations de modification, etc.

Bien que le CSRF soit plus un problème que le backend doit faire face, le frontend peut également coopérer pour faire une certaine prévention:

• Utiliser les propriétés de cookies Samesite : réglée sur Strict ou Lax peut empêcher les demandes de site transversales de transporter des cookies.
• Ajouter le jeton anti-CSRF : il est généralement généré par le backend. Le frontend apporte ce jeton dans chaque demande sensible, puis traite la demande après vérification.
• Utilisez des demandes de publication au lieu d'obtenir des demandes pour apporter des modifications à l'état : les demandes de GET sont plus susceptibles d'être forgées, et le Post nécessite au moins une certaine condition de déclenchement.

Surtout pour certaines opérations qui nécessitent une authentification de l'identité, les extrémités avant et arrière coopèrent pour faire du bon travail dans le mécanisme de vérification des jetons, ce qui peut considérablement réduire les risques.

Les bibliothèques tierces dangereuses peuvent également entra?ner des risques

Presque toutes sortes de bibliothèques tierces sont utilisées dans des projets frontaux, tels que jQuery, React, Vue, etc. Mais si vous utilisez des vulnérabilités obsolètes ou connues, elle peut devenir un portail d'attaque.

La solution est en fait très directe:

• Vérifiez régulièrement les dépendances pour les mises à jour de sécurité
• Utilisez des outils comme npm audit pour rechercher des vulnérabilités
• évitez d'introduire des plugins inutiles ou inconnus
• Pour les grands projets, envisagez d'utiliser des outils de gestion des dépendances tels que DepenBabot pour mettre à niveau automatiquement

Parfois, lorsqu'un petit module a des problèmes, toute l'application peut être affectée. Par conséquent, la sélection de la bibliothèque ne peut pas seulement examiner les fonctions, mais aussi l'état de maintenance et les commentaires de la communauté.

D'autres problèmes communs ne peuvent pas être ignorés

En plus des principaux problèmes ci-dessus, certains détails sont facilement négligés:

• Les HTTP doivent être activés : les données transmises en texte brut sont facilement interceptées par l'intermédiaire.
• N'exposez pas d'informations sensibles à l'avant : telles que les clés d'API, les structures de base de données, etc., celles-ci doivent être contr?lées dans le backend.
• Définir raisonnablement des politiques de mise en cache : certaines pages ou données ne doivent pas être mises en cache par le navigateur, sinon elles peuvent être obtenues par d'autres.
• ClickJacking : Vous pouvez utiliser des options X-Frame ou CSP pour limiter si la page est autorisée à être imbriquée.

Ces problèmes semblent petits, mais si quelque chose se produit, cela aura un grand impact. Surtout dans les applications au niveau de l'entreprise, la sécurité n'est souvent pas ?gla?age sur le gateau?, mais une ?exigence de résultat?.

Fondamentalement, c'est tout. La sécurité frontale semble compliquée, mais en fait, beaucoup d'entre elles sont des compétences de base. La clé est de faire consciemment attention à ces points dans le développement quotidien et de ne pas attendre qu'ils soient lancés avant la correction.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!