Développer la partie dynamique des interfaces utilisateur web ou web mobile Flashcards
Quel(s) intéret(s) y a-til de protéger les champs d’un formulaire côté frontend (taille max d’un champ, complexité d’un password, …) étant donné qu’un utilisateur peut modifier tout le code html/javascript sur son navigateur web ? (et donc faire sauter les protections ainsi mises en place)
Deux intérets principaux, le premier : “Améliorer l’UX”
Un utilisateur n’a pas besoin de déclencher un appel, inutil, côté serveur pour savoir que les données de son formulaires ne sont pas bonnes. Ajouter des contrôles sur les champs d’un formulaire peut permettre de notifier en temps réel l’utilisateur si il saisit les bonnes données attendues ou non.
Deuxième intéret, améliorer les performances du serveur.
En effet, bloquer la soumission d’un formulaire aux données erronées côté frontend permettra de ne pas envoyer des requêtes inutiles au backend, le serveur étant moins sollicité, sa performance globale est améliorée
Quel(s) protocole(s) peut(vent) être utilisé(s) entre le frontend et le backend d’une application Web ?
L’HTTP et l’HTTPS
Expliquez la différence entre HTTP et HTTPS, pouvez vous détailler ?
Le protocole HTTPS est plus sécurisé que le protocole HTTP. En effet, en HTTP, les données qui circulent entre l’application cliente (le navigateur web) et le serveur circulent en clair sur le réseaux. Ce qui signifie qu’un utilisateur malveillant peut directement lire les données si il les intercepte sur le réseau. (on parle d’attaque MITM : Man In The Middle)
En HTTPS, les données qui circulent sur le réseau sont chiffrées. Seul le serveur peut les déchiffrer. Et donc, les données peuvent être interceptées sur le réseau mais elles sont inexploitables.
La plupart des navigateurs affichent un gros warning lorqu’on essaie d’accéder à un site via HTTP (et non HTTPS). Un site accessible en HTTP est également (largement ?) sous-évalué par les robots d’indexation dans le cadre du SEO
C’est quoi un protocole en informatique ? Pouvez vous citer quelques exemples de protocoles ?
Un protocole en informatique désigne un ensemble de règles qui permettent à deux systèmes informatiques, parfois très différents, de communiquer ensemble (de s’envoyer des messages). Il existe bien sur les protocoles HTTP et HTTPS qui sont utilisés par les sites Web, mais également par exemple le protocole SMTP qui est utilisé pour la transmission de mails ou encore le protocole SSH qui permet de se connecter de manière sécurisée sur un serveur distant (Hébergeur mutualisé, VPS, …)
Lors d’une comparaison en javascript, qu’elle est la différence entre “===” et “==” ? pourquoi privilégier “===” ?
Le “==” compare deux valeurs tandis que le “===” compare deux valeurs ET vérifie si le type des valeurs est le même (on parle dans ce cas d’égalité stricte). Manipuler parfois des valeurs “similaires” mais ne partageant pas le même type peut entrainer des bugs dans la suite d’un programme, il est alors vivement conseillé de n’utiliser que le triple égal en javascript.
En javascript, j’ai une variable nommée ‘toto’ qui contient un tableau d’entiers. Comment puis-je afficher le premier élément du tableau ? comment puis-je afficher le nombre d’éléments contenus dans le tableau ?
console.log(toto[0]);
puis
console.log(toto.length);
Si je veux additionner tous les nombres allant de 1 à 1000 (compris) en javascript et afficher le résultat, je peux faire comment ?
Une simple boucle suffit :
let res = 0;
for(let i = 1 ; i < 1001 ; i ++)
{
res += i;
}
console.log(res)
Quel langage un navigateur web courant (firefox, chrome, …) est capable d’exécuter ?
La plupart des navigateurs web peuvent nativement exécuter du javascript
Qu’est-ce que le json ? quels sont les avantages du json ?
Le json est un format de données, autrement dit, une manière d’organiser / de structurer des informations dans un fichier texte afin qu’elles soient facilement manipulables par un programme informatique. Par exemple, il est possible de parser un contenu JSON dans un tableau Javascript : le programme javascript peut alors facilement accéder aux données contenues dans le json. Un des principaux avantages du format json est sa légèreté (contrairement au format xml par exemple [allez googler ‘json VS xml’ vous comprendrez la différence]). C’est la raison pour laquelle, le json est un format de fichier très utilisé dans le cadre d’API Web.
En quoi consiste une attaque XSS ?
Une attaque de XSS consiste à exécuter un code malicieux (en javascript par exemple) qui a été injecté sur une page Web qu’un utilisateur victime a l’habitude de consulter.
Ce code malicieux pourra alors permettre d’effectuer un nombre varié d’opérations malveillantes :
- envoyer automatiquement les informations stockées sur le navigateur web (localstorage, cookie, …) sur un serveur géré par la personne malveillante
- modifier le contenu de la page pour induire l’utilisateur victime en erreur et potentiellement amorcer d’autres attaques informatiques plus importantes encore
- …
En quoi consiste une attaque CSRF ?
Supposons un utilisateur authentifié sur un site (nommé totoland) qu’il consulte (un token d’authentification par par exemple être persisté dans un cookie). Une attaque CSRF consiste à exploiter la confiance établie entre le site web et l’utilisateur. Cela peut se faire de différentes manières, voici une exemple simpliste : un mail avec un code malicieux est envoyé à un utilisateur victime, le contenu du mail pourrait être :
Bravo ! vous avez gagné un cadeaux ! <a>cliquez ici</a> pour valider votre gain
Une personne non avertie cliquera sur “cliquez ici” sans faire attention au lien vers lequel elle est redirigée. Donc si le site totoland n’est pas suffisament protégé, le ‘/user/delete’ va fonctionner car la personne victime est déjà authentifiée sur le site. Son compte peut alors être supprimé juste en cliquant sur le lien.
Le lien, malicieux, a été crée manuellement par la personne malveillante. On dit alors qu’elle a elle-même forgée le lien (ou plus généralement la requete), c’est la raison pour laquelle nous avons le F (Forgery) dans CSRF
Qu’est-ce qu’une API Web ?
Une API (Application Programming Interface) désigne de manière générale un ensemble de fonctions (en programmation) qui permettent d’échanger/manipuler des informations entre deux systèmes informatiques. Une API Web est une API utilsant les protocoles du Web. Ainsi, si je veux que le code de mon site récupère des données d’une API Web fournie par (par exemple) OpenDataGouv, mon code va alors effectuer une requete HTTPS vers l’API Web. Il me faudra bien sur consulter la documentation de l’API pour savoir comment l’utiliser à travers ma requete HTTPS afin de récupérer les informations qui m’intéressent.
Comment un code malicieux peut se retrouver injecté, à notre insu, sur une page web que nous avons l’habitude de consulter ?
Il existe moultes manières d’injecter un code malveillant sur une page web, en voici quelques unes :
- injecter du code à travers un plugin ou une extension de navigateur que l’utilisateur a installé
- se connecter illégalement sur le serveur qui héberge le site web : ainsi, il devient possible de modifier directement le code source du site et d’y injecter du code malveillant
- soumettre des lignes de codes dans un formulaire Web au lieu des données attendues. Par exemple : écrire du javascript dans un champ “commentaire”, et si aucune vérification n’est effectuée sur le champ côté backend avant son insertion dans la base de données, le code du commentaire risque alors d’être automatiquement exécuté par toutes les personnes qui consulteront par la suite la page qui affiche les commentaires
- …
Quel est l’acronyme de XSS ? (attaque XSS)
XSS : CROSS-Site Scripting
Quel est l’acronyme de CSRF ? (attaque CSRF)
CSRF : Cross-Site Request Forgery
