Maison >interface Web >js tutoriel >Explication détaillée des étapes permettant à nodejs d'afficher une page via l'écriture de réponse

Explication détaillée des étapes permettant à nodejs d'afficher une page via l'écriture de réponse

php中世界最好的语言original: 2018-05-02 10:23:151858parcourir

Cette fois, je vais vous donner une explication détaillée des étapes permettant à nodejs de restituer une page via l'écriture de réponse. Quelles sont les précautions pour que nodejs restitue une page via la réécriture de réponse. Voici un cas pratique. , jetons un coup d'oeil.

Nous opérons généralement le rendu des pages via l'API fournie par le framework de nœuds. Comment utiliser la méthode de réécriture d'origine pour obtenir la même fonction

Ce qui suit est la lecture asynchrone d'un fichier via le ? nœud fourni Tout le contenu de l'API readFile fonctionne, le code est le suivant :

html

 <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" type="text/css" href="./static/style.css" rel="external nofollow" />
  <title>Document</title>
</head>
<body>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <p>这是一个p </p>
  <script type="text/javascript" src="./static/test.js"></script>
 </body>
</html>

/le dossier statique contient les fichiers test.js et style.css

 p:nth-child(1){
  font-size: 50px;
  color: red;
}
p:nth-child(3){
  font-size: 80px;
  color: blue;
}
p:nth-child(6){
  font-size: 100px;
  color: blueviolet;
}

app .js

 // 搭建服务
var http = require('http');
var fs = require('fs');
var server = http.createServer();
server.on('listening',()=> {
  console.log('server starts at localhost 8080');
})
server.listen('8080','localhost');
//监听服务
server.on('request',(req,res)=>{
  if(req.url == '/') {//渲染html文件
    fs.readFile('./html/node.html',(err,info)=>{
       res.write(info);
       res.end();
    })
  } else if(req.url.startsWith('/static')) {//统一渲染html需要的static静态文件到页面
    fs.readFile(dirname + req.url,(err,info) =>{
      res.write(info);
      res.end();
    })
  }
})

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser les modules angulaires2 et les modules partagés

Comment obtenir le plus grand élément d'un nombre tapez tableau

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!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Méthode d'implémentation de la liste déroulante VueArticle suivant：Méthode d'implémentation de la liste déroulante Vue

Articles Liés

Voir plus