Heim > Artikel > Web-Frontend > Detaillierte Erläuterung der Schritte zum Implementieren von dynamischem HTML in NodeJS

Detaillierte Erläuterung der Schritte zum Implementieren von dynamischem HTML in NodeJS

php中世界最好的语言Original: 2018-05-22 10:06:172078Durchsuche

Dieses Mal werde ich Ihnen die Schritte zum Implementieren von dynamischem HTML in NodeJS ausführlich erläutern. Was sind die Vorsichtsmaßnahmen für die Implementierung von dynamischem HTML in NodeJS?

Dynamischer Ersatz von HTML-Inhalten

1. Implementierte Funktionen und Prinzipien

Es kombiniert die Benutzerformulardaten mit HTML und zeigt die vom Benutzer eingegebenen Daten an der entsprechenden HTML-Position an.

Prinzip: Verwenden Sie regulären Ausdruck, um die Vorlagendaten in HTML zu ersetzen, z. B. den Benutzernamen {Name}. Sie können den Wert des vom Benutzer übermittelten Namens abrufen und

Replace (regulärer Ausdruck, Wert) ersetzt die ursprünglichen Vorlagendaten und gibt sie an den Client aus.

2. Hauptsächlich verwendete Methoden und Module

2.1 Dateioperationsmodul var fs=require("fs"); >

Methode:

2.1.1 Asynchrone Dateilesemethode

fs.readFile(path,callback);

Parameterbeschreibung:

Pfad: der Pfad der Datei (

enthält den Dateinamen

) Rückruf: die

Rückruffunktion nach Abschluss des Dateilesens

Dateilesen Die Mit dieser Methode erhaltene Daten werden automatisch in

callback:function(err,data){
 if(err){
 //读取文件错误的逻辑
 }else{
 //对数据的操作，如打印
 console.log(data);
 }
 }

2.2 Datenverarbeitungsmodul var querystring=require("querystring");

Methode eingefügt :2.2.1 String in Objekt konvertieren

querystring.parse(post);

2.3 Post-Request-Hauptmethode

 监听有post数据上传的方法:request.on('data',funcation(chunk){
 //chunk post数据碎片
 });
 监听post数据上传完毕的方法:request.on('end',function(){
 //相关逻辑
 });

3. Kerncode requestHandler.js

/*
 请求处理
 * */
//加载node非阻塞线程模块
//var exec=require("child_process").exec;
//加载queryString模块和文件上传模块
var http = require("http");
var formidable = require('formidable');
var fs = require("fs");
var path = require("path");
var querystring=require("querystring");
function login(request, response) {
var post="";
//监听post发送请求
request.on('data',function (chunk) {
post += chunk;
});
//数据接收完毕
request.on('end',function(){
post=querystring.parse(post);
/*替换的数据模板字段*/
var arr=["name","password"];
function recall (data) {
dataStr = data.toString();
//遍历模板字段
for (var i = 0; i < arr.length; i++) {
//全局替换
var re=new RegExp(&#39;{&#39;+arr[i]+&#39;}&#39;,&#39;g&#39;);
dataStr=dataStr.replace(re,post[arr[i]]);
}
response.writeHead(200, {"Content-Type": "text/html"});
response.write(dataStr);
response.end();
}
fs.readFile("login.html",function (err,data) {
recall(data);
});
});
}
function index (request, response) {
fs.readFile("login.html",function (err,data) {
if (err) {
throw err.toString();
} else{
response.writeHead(200, {"Content-Type": "text/html"});
response.write(data);
response.end();
}
})
}
exports.login = login;
exports.index=index;

4.html-Vorlage

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
用户名:{name}<br /> 
    <!--
  {name},{password}为要替换的模板字段
    -->
密 码:{password}<br />
<form action="/login" method="post">
<input type="text" name="name" /><br />
<input type="password" name="password" /><br />
<input type="submit" value="提交"/>
</form>
</body>

Ich glaube, ich habe es gesehen Ich habe die Methode in diesem Artikel gemeistert. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre

Ausführliche Erklärung zur Verwendung der Async-Funktion in js

Knoten erstellt Server, schreibt Schnittstelle, passt sich an Schnittstelle, Cross Detaillierte Erläuterung der Domänenmethoden

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Schritte zum Implementieren von dynamischem HTML in NodeJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Detaillierte Schritte zur Installation von Node.js und zum Starten des lokalen DienstesNächster Artikel：Detaillierte Schritte zur Installation von Node.js und zum Starten des lokalen Dienstes

In Verbindung stehende Artikel

Mehr sehen