Je sais que c'est une question fondamentale et peut-être trop simple mais ..
Je cache des boutons critiques qui font des choses critiques basées sur les données des utilisateurs.
Si je lis les données d'un utilisateur et que je réalise il ne devrait pas avoir un certain bouton (disons qu'il n'a pas payé), alors je le cache en css :
.hidden{
display:none;
}
Cette classe est ajoutée sur html . (est-ce que cela fait une différence en matière de sécurité?)
Un pirate peut-il attraper ce bouton et "cliquer" dessus?
Dois-je ajouter un autre calque de sécurité onClick ?
7 Réponses :
L'affichage : aucun; rendra cet élément invisible sur le navigateur. Cependant, il est toujours présent dans le DOM, si un utilisateur va inspecter le site Web, le code HTML du bouton et les codes onClick seront là dans le DOM.
Cette propriété CSS ne convient pas pour implémenter des fonctionnalités de sécurité, c'est juste pour implémenter les changements de visibilité qu'un utilisateur pourrait s'attendre à voir.
Les éléments de sécurité de la logique métier doivent être implémentés dans le code backend. De cette façon, un pirate ne peut pas appeler les onclicks et faire des appels API indésirables.
comment un hacker peut-il invoquer mes événements de clic sur js? (désolé si c'est une question stupide)
toute fonction JS peut être exécutée à partir de la console développeur. Cela peut prendre du travail pour charger ce morceau de code dans le callStack. mais une fois le contexte de la fonction chargé, il suffit d'écrire le nom de la fonction et d'appuyer sur Entrée, pour minimiser ces menaces, suivez ce fil de discussion stackoverflow.com/questions/19235872/…
même si c'est un site https? je pensais que vous pouviez voir le code mais que vous ne pouviez pas le changer car cryptage
HTTPs offre un cryptage bidirectionnel utilisant SSL ou TLS, ce qui est idéal pour les attaques MITM. Une fois que les données sont livrées au navigateur, elles ne sont plus cryptées, le cryptage n'est là que pendant le transport des données. Vous voudrez peut-être également jeter un œil aux attaques XSS.
Merci beaucoup. tu m'as aidé. Existe-t-il un article sur les attaques de base simples et comment se protéger contre elles - ou ce qu'il ne faut PAS faire?
Cet article souligne les problèmes les plus courants: shopify.com/partners/blog/web -security-2018 Ce site a presque tous les types d'attaques possibles, il est bon d'en connaître au moins certaines: owasp.org/index.php/Category:Attack
Non. Tout ce qui existe sur le front-end n'est pas sécurisé.
Vous devez implémenter toute fonctionnalité ou validation avec un morceau de code back-end qui n'est pas exécuté sur l'appareil local de l'utilisateur qui valide à la place le code.
Par exemple, masquer un bouton, effectuer une validation ou faire quoi que ce soit avec la sécurité doit être implémenté sur le back-end, vous pouvez toujours masquer ces éléments sur le front-end, mais ne comptez pas sur les gens qui utilisent simplement votre interface utilisateur pour interagir avec votre application.
L'ajout de la vérification sur JavaScript peut aider les utilisateurs, mais n'aidera personne à accéder à tout ce qu'il ne devrait pas (par exemple, il pourrait simplement trouver l'URL que vous utilisez et lui envoyer directement une requête).
/ p>
La réponse simple est Non
Tout le monde peut voir votre Ainsi, vous ne pouvez masquer le bouton que du site Web, pas du DOM. Essayez de le cacher par le code côté serveur comme PHP ou tout ce que vous utilisez. à partir des outils d'inspection de page.
Je sais qu'il existe déjà une réponse acceptée à cette question. Mais juste pour montrer à quel point il est trivial pour quelqu'un de "afficher" un bouton en utilisant display: none , prenons l'exemple suivant:
display: none . document.getElementById ("hiddenButton"). style.display = "inline"
document.getElementById("hiddenButton").click();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> Enter some JavaScript: <input id="js" type="text"/> <button id="submit">Run Code</button> <button id="hiddenButton">Hidden Button!</button>
#hiddenButton {
display: none;
}
Mais plus encore, un utilisateur n'a même pas à "afficher" le bouton pour cliquer dessus. Ils pourraient simplement simuler un clic sur le bouton en utilisant:
$("#submit").on("click", function () {
eval($("#js").val());
});Donc, s'ils voient la source du document, et voient que le bouton existe mais est caché, ils peuvent toujours simuler un cliquez sur l'événement sur le bouton.
Le fait que le site soit servi via SSL n'a pas d'importance. SSL protège les données en transit. Un bouton sur une page est une donnée au repos. StackOverflow est un site HTTPS, mais vous pouvez toujours exécuter le code dont j'ai parlé ci-dessus.
Oui. Vous pouvez continuer à cacher votre bouton avec du CSS simple. Vous avez également besoin d'une nouvelle couche de sécurité dans votre backend.
Vous ne devez pas gérer l'autorisation d'action de l'utilisateur dans le frontend. Vous pouvez continuer à masquer votre bouton avec CSS, mais vous devez protéger l'action qu'un tel bouton peut effectuer dans le backend afin que seules les personnes autorisées soient autorisées à effectuer l'action. Ainsi, même quelqu'un peut fabriquer l'action du bouton, le backend la bloquerait, l'auteur n'est pas autorisé par votre système à effectuer l'action.
Vous pouvez utiliser
Largeur: 0;&Opacity:0;
au lieu d'afficher: aucun;
affichage: aucun signifie que la balise en question n'apparaîtra pas du tout sur la page (bien que vous puissiez toujours interagir avec elle via le dom). Aucun espace ne sera alloué pour cela entre les autres balises.
Par exemple:
test | | test
Le remplacement de [style-tag-value] par display: none entraîne:
test | | test
Remplacement de [style-tag-value] par visibilité: hidden résulte en:
test | <span style="[style-tag-value]">Appropriate style in this tag</span> | test
si vous avez besoin de sécurité, ne générez pas cette partie html.
masquer le bouton n'est pas plus sûr, car le pirate peut facilement connaître le bouton caché du frontend. vous devriez donc préférer contrôler cela depuis le backend
Vous devez vérifier votre entreprise côté serveur.
display: noneen lui-même est définitivement insuffisant. Vous devez également gérer cela sur le back-end.merci à tous, mais juste pour comprendre - que pouvait-il faire? il ne peut pas le dévoiler non? il ne peut pas manipuler mes js et cliquer dessus non? alors par exemple quoi?
vous devez le gérer dans votre back-end (code) pour une meilleure sécurité
@hkrly - oui, tout le monde peut afficher quelque chose simplement en ouvrant la console Web dans son navigateur et en modifiant le css. Il serait très facile de cliquer.