Introduction au Développement Web
Le développement Web repose sur l'interaction entre un client (généralement un navigateur) et un serveur. Le processus standard suit ces étapes :
- L'utilisateur accède à une URL via son navigateur.
- Le navigateur télécharge les ressources statiques (HTML, CSS, JS) depuis le serveur frontend.
- Le code frontend s'exécute et sollicite des données via des APIs vers le serveur backend (Java).
- Le backend interroge la base de données et renvoie les informations au format JSON.
- Le navigateur met à jour l'interface utilisateur de manière dynamique.
Le Protocole HTTP
HTTP/1.1 reste la norme la plus répandue pour la communication Web. Il fonctionne sur un modèle de requête-réponse court et indépendant.
Format des Messages
- Requête : Composée d'une ligne de requête (Méthode, Chemin, Version), d'en-têtes (Host, Content-Type) et d'un corps (pour POST/PUT).
- Réponse : Composée d'une ligne de statut (Version, Code de statut, Message), d'en-têtes et du corps de la réponse (HTML, JSON, Image).
Codes de Statut Essentiels
- 200 : Succès de la requête.
- 302 : Redirection temporaire.
- 404 : Ressource non trouvée (erreur client).
- 500 : Erreur interne du serveur (erreur backend).
L'Architecture MVC
Le modèle Model-View-Controller est le standard pour organiser le code backend :
- Modèle (M) : Gère la logique métier et les données (POJO, Services, DAO).
- Vue (V) : Gère l'affichage (HTML, Vue.js, JSP).
- Contrôleur (C) : Réceptionne les requêtes et coordonne les réponses (Servlets, Spring Controllers).
Technologies Frontend et JavaScript
JavaScript permet de manipuler le DOM (Document Object Model) pour rendre les pages interactives. Voici un exemple de manipulation moderne utilisant des prmoesses et le stockage local :
// Stockage d'une clé d'authentification
const saveToken = (token) => {
localStorage.setItem('auth_token', token);
};
// Requête asynchrone avec Fetch (alternative moderne à Axios)
async function fetchUserData(userId) {
try {
const response = await fetch(`https://api.monsite.com/users/${userId}`);
const data = await response.json();
console.log('Utilisateur récupéré:', data.nom);
} catch (error) {
console.error('Erreur lors de la récupération:', error);
}
}
Gestion de Projet avec Maven
Maven est l'outil de gestion de dépendances et de construction standard pour Java. Il utilise un fichier pom.xml pour définir le projet.
- Coordonnées : Identifiées par
groupId,artifactId, etversion. - Cycle de vie :
clean(nettoyage),compile(compilation),test(tests unitaires),package(génération du JAR/WAR),install(installation locale).
Accès aux Données avec JDBC
JDBC (Java Database Connectivity) permet de connecter une application Java à une base de données SQL. L'utilisation de PreparedStatement est cruciale pour éviter les injections SQL.
public void updateProductPrice(int id, double newPrice) {
String sql = "UPDATE catalogue_produits SET prix = ? WHERE id = ?";
try (Connection conn = DruidDataSourceFactory.createDataSource(props).getConnection();
PreparedStatement ps = conn.prepareStatement(sql)) {
ps.setDouble(1, newPrice);
ps.setInt(2, id);
int rowsAffected = ps.executeUpdate();
System.out.println("Produits mis à jour : " + rowsAffected);
} catch (Exception e) {
e.printStackTrace();
}
}
Servlets et Conteneurs Web (Tomcat)
Une Servlet est un composant Java géré par un conteneur (comme Apache Tomcat) qui traite les requêtes HTTP.
Cycle de Vie d'une Servlet
- Instanciation : Le conteneur crée l'objet.
- Initialisation : Appel de la méthode
init(). - Service : Appel de
service()(puisdoGet/doPost) pour chaque requête. - Destruction : Appel de
destroy()avant l'arrêt du serveur.
Transfert vs Redirection
- Request Forward (Transfert) : Opération interne au serveur. L'URL ne change pas. L'objet requête est conservé.
- Redirect (Redirection) : Le serveur renvoie un code 302. Le navigateur effectue une nouvelle requête vers la nouvelle URL. L'URL change.
Gestion de la Session et Cookies
Comme HTTP est sans état, on utilise des mécanismes pour suivre l'utilisateur :
- Cookies : Petits fichiers textes stockés côté client, envoyés à chaque requête.
- Session (HttpSession) : Espace de stockage côté serveur lié à un identifiant unique (JSESSIONID) stocké dans un cookie.
Filtres et Listeners
- Filtres (Filter) : Interceptent les requêtes avant qu'elles n'atteignent la Servlet (ex: vérification de connexion, encodage UTF-8).
- Auditeurs (Listener) : Écoutent les événements du cycle de vie de l'application (ex: démarrage du serveur, création d'une session).
@WebFilter("/*")
public class SecurityFilter implements Filter {
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain)
throws IOException, ServletException {
HttpServletRequest request = (HttpServletRequest) req;
System.out.println("Requête entrante sur : " + request.getRequestURI());
// Poursuite de la chaîne de filtrage
chain.doFilter(req, res);
}
}