Comment passer au HTML dans nodejs

Node.js est un environnement JavaScript programmable côté serveur qui nous permet d'écrire des applications Web hautes performances à l'aide de JavaScript. Dans Node.js, nous pouvons facilement créer et gérer des serveurs HTTP, gérer les requêtes et renvoyer des réponses. De plus, Node.js peut communiquer avec d'autres scripts (tels que HTML, CSS et JavaScript) exécutés sur le navigateur client pour implémenter davantage de fonctionnalités dans les applications Web.

Dans cet article, nous verrons comment accéder à une page HTML à l'aide de Node.js. Tout d'abord, nous examinerons le module HTTP de Node.js, puis expliquerons comment envoyer une page HTML depuis un serveur Node.js vers un navigateur client. Enfin, nous explorerons comment utiliser les formulaires et demander la redirection pour implémenter une fonctionnalité de redirection plus avancée.

Module HTTP de Node.js
Le module HTTP est l'un des modules les plus basiques et essentiels de Node.js. Dans Node.js, nous pouvons utiliser le module HTTP pour créer et gérer des serveurs HTTP, gérer les demandes et les réponses et implémenter d'autres fonctions liées à HTTP.

Dans Node.js, nous pouvons utiliser le code suivant pour créer un serveur HTTP simple :

const http = require('http');

http.createServer(function(req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello world!\n');
}).listen(8080);

console.log('Server running at http://localhost:8080/');

Dans cet exemple, nous utilisons la fonction createServer() pour créer un serveur HTTP qui écoute sur le port local 8080 les requêtes entrantes. . Lorsque le serveur reçoit une requête, il envoie une réponse contenant « Bonjour tout le monde ! » et affiche « Le serveur s'exécute sur http://localhost:8080/ » sur la console.

Envoi de pages HTML
Maintenant, nous avons vu comment créer un simple serveur HTTP. Cependant, dans les applications Web réelles, nous devons généralement envoyer des pages HTML que les utilisateurs peuvent parcourir. Dans Node.js, nous pouvons utiliser le code suivant pour envoyer une page HTML :

const http = require('http');
const fs = require('fs');

http.createServer(function(req, res) {
  fs.readFile('index.html', function(err, data) {
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write(data);
    res.end();
  });
}).listen(8080);

console.log('Server running at http://localhost:8080/');

Dans cet exemple, nous utilisons la fonction readFile() du module du système de fichiers Node.js (fs) pour lire le code HTML nommé index.html document. Ensuite, nous utilisons la fonction writeHead() du module HTTP Node.js pour définir l'en-tête de réponse afin d'indiquer au navigateur client que le contenu renvoyé est au format HTML. Enfin, nous écrivons la page HTML dans le flux de réponse à l'aide de la fonction res.write() et terminons le flux de réponse à l'aide de la fonction res.end().

Demande de redirection
Dans les applications Web, nous devons généralement rediriger l'utilisateur vers une autre page ou URL. Dans Node.js, nous pouvons y parvenir en utilisant la redirection de requêtes. Plus précisément, nous pouvons utiliser la méthode redirect() de l'objet de réponse du module HTTP pour rediriger la requête vers une autre page ou URL.

Voici un exemple de redirection simple :

const http = require('http');
const fs = require('fs');

http.createServer(function(req, res) {
  if (req.url === '/redirect') {
    res.writeHead(301, {'Location': 'http://www.google.com'});
    res.end();
  } else {
    fs.readFile('index.html', function(err, data) {
      res.writeHead(200, {'Content-Type': 'text/html'});
      res.write(data);
      res.end();
    });
  }
}).listen(8080);

console.log('Server running at http://localhost:8080/');

Dans cet exemple, nous utilisons une instruction if pour détecter si l'URL demandée est "/redirect". Si tel est le cas, nous définissons le code d'état de la réponse sur 301 (redirection permanente) et l'en-tête Location sur la nouvelle URL (http://www.google.com). Cela indiquera au navigateur client de rediriger la demande vers la nouvelle URL. Sinon, nous lisons le fichier index.html et l'écrivons dans le flux de réponse.

Soumission de formulaire
Enfin, nous explorerons comment utiliser la soumission de formulaire pour obtenir une fonctionnalité de saut plus avancée. Dans les applications Web, nous pouvons utiliser la soumission de formulaire pour transmettre les entrées de l'utilisateur (telles que le nom d'utilisateur, le mot de passe, les mots-clés de recherche, etc.) au serveur, et accéder à d'autres pages ou effectuer d'autres opérations en fonction de la réponse du serveur.

Dans Node.js, nous pouvons utiliser l'objet request du module HTTP pour gérer la soumission de formulaire. Plus précisément, nous pouvons utiliser la méthode on() de la requête pour gérer le flux de données et utiliser le module querystring pour analyser les données du formulaire de la requête POST.

Voici un exemple simple de soumission de formulaire :

const http = require('http');
const url = require('url');
const querystring = require('querystring');

http.createServer(function(req, res) {
  if (req.method === 'GET') {
    fs.readFile('form.html', function(err, data) {
      res.writeHead(200, {'Content-Type': 'text/html'});
      res.write(data);
      res.end();
    });
  } else if (req.method === 'POST') {
    let body = '';
    req.on('data', function(chunk) {
      body += chunk.toString();
    });
    req.on('end', function() {
      const data = querystring.parse(body);
      res.writeHead(302, {'Location': '/hello?name=' + data.name});
      res.end();
    });
  } else if (req.url.startsWith('/hello')) {
    const name = url.parse(req.url, true).query.name || 'world';
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write('<html><body><h1>Hello, ' + name + '!</h1></body></html>');
    res.end();
  }
}).listen(8080);

console.log('Server running at http://localhost:8080/');

Dans cet exemple, nous utilisons la méthode GET pour envoyer une page HTML contenant un formulaire. Nous utilisons ensuite la méthode POST pour gérer la soumission du formulaire. Dans la requête POST, nous utilisons la méthode on() de l'objet de requête pour lire le flux de données et analyser les données du formulaire dans un objet JavaScript via le module de chaîne de requête. Enfin, nous redirigeons la requête vers la nouvelle URL (/hello?name=) en utilisant la méthode redirect() de l'objet de réponse.

Dans la page /hello, nous utilisons la méthode parse() du module url pour analyser les paramètres de requête URL et imprimer un simple message de bienvenue.

Résumé
Dans cet article, nous avons expliqué comment accéder à une page HTML à l'aide de Node.js. Nous avons présenté le module HTTP de Node.js et démontré comment utiliser le module HTTP pour envoyer des pages HTML. Nous couvrons également des fonctionnalités avancées telles que la redirection de requêtes et la soumission de formulaires, ainsi que la manière d'utiliser ces fonctionnalités pour obtenir une fonctionnalité de saut plus puissante. Que vous soyez débutant ou développeur expérimenté, maîtriser ces conseils vous aidera à mieux développer des applications web efficaces.

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!