Aller au contenu principal

JavaScript : communication asynchrone et sécurité

Développement 174 arrow small right Frontend

frontend web JavaScript API réseau

  • Durée

    2 jour(s)
  • Niveau

    Intermédiaire
  • Référence

    DE-075

Présentation

JavaScript est un langage extrêmement versatile et très complet : il autorise de nombreuses fonctionnalités côté frontend. De manière non-exhaustive, on peut lister : effectuer des requêtes HTTP, stocker des informations dans le navigateur, accéder à des informations systèmes. Toutes ces possibilités sont autant de moyens de réaliser des actions côté frontend pour un bénéfice de réactivité, d’expérience utilisateur ou encore de répartition de charge.
Cependant, déporter une partie de la logique de l’application côté frontend n’est pas sans risque : il est nécessaire de soigner au maximum la communication entre client et serveur, tant au niveau de la fréquence que de la sécurité, en passant par le volume des données.
Au cours de cette formation, vous découvrirez les différences entre les techniques de « long polling », AJAX, fetch et WebSocket pour communiquer avec des APIs. Vous apprendrez à préciser vos requêtes et vos réponses avec les en-têtes de contenu. Vous découvrirez également comment authentifier vos utilisateurs sans générer de risque de sécurité, ainsi qu’à améliorer la protection de vos APIs.

Objectifs de la formation

  • Savoir utiliser du « long polling », AJAX, fetch et WebSocket
  • Savoir utiliser les bons en-têtes HTTP et les formats de données adaptés
  • Découvrir les bases de JWT et les différences avec un identifiant de session
  • Comprendre et respecter les restrictions de sécurité des APIs

Public

  • Toute personne travaillant ou souhaitant travailler dans le développement web

Prérequis

  • Des connaissances en JavaScript frontend sont nécessaires (équivalentes à la formation « JavaScript niveau 1 : dynamiser son site web »)

Programme

1- Communication client/serveur

Rappels HTTP
Utiliser les en-têtes de contenu
Communiquer avec une API avec axios, fetch et AJAX
Choisir son format de données

2- WebSocket

Qu’est-ce que WebSocket ? Historique et présentation
Communiquer avec un serveur via WebSocket
Communication push
Gérer les erreurs

3- Identification avec JWT/identifiant de session

Qu’est-ce que JWT ?
Qu’est-ce qu’un identifiant de session ?
Exemples, avantages et inconvénients des deux solutions
Stocker un JWT côté client
Considérations de sécurité

4- Sécurisation des APIs

Valider l’identification des requêtes côté serveur
Notions de limitations côté serveur (throttling)
Déterminer le bon niveau de throttle pour les bons usages
Adapter les en-têtes de réponse pour faciliter la compréhension du frontend

Date de dernière modification : 17/02/2023

Organisation

162 arrow small up 163 arrow small down

Modalités d'évaluation :

Questionnaires à choix multiples (QCM) en fin de formation. L'intervenant formulera également une appréciation sur vos acquis pour l'entièreté de la formation.

Moyens pédagogiques :

Formation alternant la théorie et la pratique, avec un intervenant présentant la formation en direct. Possibilité de réaliser cette formation en face-à-face dans nos locaux, dans vos locaux d'entreprise ou à distance via visioconférence.
Une fois terminée, vous disposerez d'une attestation de suivi de la formation, ainsi que des contenus de cours relatifs au contenu présenté.

Informations pratiques :

En cas de dispense dans nos locaux, le matériel informatique est fourni et l'ensemble des commodités sont accessibles. Nos locaux sont également accessibles aux personnes à mobilité réduite : découvrir notre centre.
Retrouvez toutes les informations pratiques pour préparer votre formation sur notre page dédiée : informations pratiques.

Ces formations pourraient vous intéresser

  • JavaScript niveau 2

    JavaScript est un langage extrêmement versatile et très complet : il autorise de nombreuses fonctionnalités côté frontend. De manière non-exhaustive, on peut lister : effectuer des requêtes HTTP, stocker des …

    En savoir plus
  • JavaScript : Design Patterns et orienté prototype

    JavaScript est un langage disposant de multiples paradigmes de programmation en son sein. On y retrouve des éléments de programmation fonctionnelle avec l’utilisation massive des fonctions « map », « reduce » …

    En savoir plus
  • JavaScript : paradigmes, programmation objet et fonctionnelle

    JavaScript est un langage avec une histoire riche ayant façonné sa syntaxe. Un langage d’abord pensé pour de la manipulation de DOM (Document Object Model) et une programmation événementielle, où ses conventions se …

    En savoir plus