lokaler Host/Post,
localhost/sagen wir?
Implementierungsbeispiel für die Message Board-Funktion von Node.js+Express
NachrichtenbrettMessage Board-Funktion basierend auf Node.js+Express+Art-Template. Enthält eine Listenschnittstelle, eine Hinzufügungsschnittstelle und eine Nachrichtensendefunktion. Erforderliche Bibliotheken Kopieren Sie einfach die folgende Der erforderliche Inhalt von package.json ist wie folgt.
{
"Name": "nodejs_message_board",
"version": "2021.09",
"privat": wahr,
"Skripte": {
"Start": "Knoten-App"
},
"Abhängigkeiten": {
"Kunstvorlage": "^4.13.2",
"debug": "~2.6.9",
"express": "~4.16.1",
"express-art-vorlage": "^1.0.1"
}
}
Open Source Projekte Dieses Projekt ist im Ausführen von „localhost“-Effekt, Meldung an die Homepage
Seite „Nachricht hinzufügen“
name=xxx&message=xxx, senden Sie eine Nachricht und leiten Sie zur Startseite weiter
ProjektstrukturHauptseite Dies ist die Nachrichtenliste und gleichzeitig die Homepage. Rendert eine Liste basierend auf den übergebenen Werten.
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>Nachrichtenbrett</title>
<link rel="stylesheet" href="/public/css/bootstrap4.css" rel="externes nofollow" rel="externes nofollow" >
</Kopf>
<Text>
<div Klasse="Header-Container">
<div Klasse="Seitenkopfzeile">
<h1>Message Board<small>Nachrichtenliste</small></h1>
<a class="btn btn-success" href="/post" rel="external nofollow" >Hinterlasse eine Nachricht</a>
</div>
</div>
<div Klasse="Kommentare-Container">
<ul Klasse="Listengruppe">
{{jeder Kommentar}}
<li Klasse="Listengruppenelement">
{{$value.name}} sagt: {{$value.message}}
{{$value.datetime}}
</li>
{{/jede}}
</ul>
</div>
</body>
</html>Beitrag.html
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>Nachrichtenbrett</title>
<link rel="stylesheet" href="/public/css/bootstrap4.css" rel="externes nofollow" rel="externes nofollow" >
</Kopf>
<Text>
<div Klasse="Header-Container">
<div Klasse="Seitenkopfzeile">
<h1><a href="/" rel="external nofollow" >Message Board<small>Eine Nachricht hinzufügen</small></a></h1>
</div>
</div>
<div Klasse="Kommentarcontainer">
<form action="/say" method="GET">
<div Klasse="Formulargruppe">
<label for="name">Ihr Name</label>
<input type="text" id="name" name="name" class="form-control" placeholder="Bitte geben Sie Ihren Namen ein" required minlength="2" maxlength="10">
</div>
<div Klasse="Formulargruppe">
<label for="message">Nachrichteninhalt</label>
<textarea id="message" name="message" class="form-control" placeholder="Bitte geben Sie Ihre Nachricht ein" cols='30' rows='10' required minlength="5" maxlength="20"></textarea>
</div>
<button type="submit" class="btn btn-default">Veröffentlichen</button>
</form>
</div>
</body>
</html>
route/index.js Hier ist der Router
const express = erfordern('express');
const router = express.Router();
//Daten der Nachrichtenliste der Homepage simulieren var comments= {"comments":[
{name:"AAA",message:"Welchen Editor verwenden Sie? WebStorem oder VSCODE",datetime:"2021-1-1"},
{name:"BBB",message:"Was für ein schönes Wetter heute? Angeln oder Code",datetime:"2021-1-1"},
{name:"Moshow",message:"zhengkai.blog.csdn.net",datetime:"2021-1-1"},
{name:"DDD",message:"Der Unterschied zwischen ha, haha und hahaha",datetime:"2021-1-1"},
{name:"EEE",message:"Wang Shouyi Thirteen Spices oder iPhone Thirteen Spices",datetime:"2021-1-1"}
]}
/* von zhengkai.blog.csdn.net – Hosting mit statischem Routing*/
router.get('/', Funktion(req, res, nächstes) {
res.render('index', Kommentare);
});
router.get('/post', Funktion(req, res, next) {
res.render('posten', Kommentare);
});
router.get('/say', Funktion(req, res, next) {
Konsole.log(Anforderung.Abfrage)
Konsole.log(erforderliche URL)
const Kommentar = req.query;
Kommentar.datetime='2021-10-01';
Kommentare.Kommentare.unshift(Kommentar);
// Weiterleitung zur Startseite, ohne das URL-Suffix localhost
res.redirect('/');
// Rendern Sie die Homepage direkt mit dem URL-Suffix localhost/say?xxxx=xxx
//res.render('index', Kommentare);
});
modul.exporte = Router;
app.js Hier als Gesamtsteuerung
//Modul laden const http=require('http');
const fs = erfordern('fs');
const url = erfordern('url');
const Vorlage = erforderlich('Kunstvorlage');
const path = require('Pfad');
const express = erfordern('express');
const router = express.Router();
const app = express();
//Engine-Setup anzeigen
app.set('Ansichten', Pfad.join(__dirname, 'Ansichten'));
app.set('Ansichts-Engine', 'html');
app.engine('html',erfordert('express-art-template'));
app.use('/public',express.static(Pfad.join(__dirname, 'public')));
const indexRouter = erfordern('./routes/index');
app.use('/', indexRouter);
//Erstellen Sie ein Überwachungsobjekt app.listen(80,function(){
console.log('zhengkai.blog.csdn.net-Projekt erfolgreich gestartet http://localhost')
})Dies ist das Ende dieses Artikels über das Implementierungsbeispiel der node.js + Express-Message-Board-Funktion. Weitere verwandte node.js Express-Message-Board-Inhalte finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder durchsuchen Sie die folgenden verwandten Artikel weiter. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: Docker Compose Idea CreateProcess-Fehler = 2 Das System kann die angegebene Datei nicht finden
>>: Verwendung des Linux-Stat-Befehls
Artikel empfehlen
So benennen Sie die Tabelle in MySQL um und worauf Sie achten müssen
Inhaltsverzeichnis 1. Tabellenmethode umbenennen ...
Eine SQL-Anweisung schließt die MySQL-Deduplizierung ab und behält eine
Als ich vor einigen Tagen an einer Anforderung ar...
Docker realisiert die Verbindung mit demselben IP-Netzwerksegment
Vor Kurzem habe ich das Problem gelöst, dass Dock...
Lösung für das Problem, dass das direkte Festlegen der Breite und Höhe eines Hyperlinks nicht funktioniert
Eine direkte Verwendung von Breite und Höhe ist ni...
Die grundlegende HTML-Syntax ist praktisch für diejenigen, die gerade erst anfangen, HTML zu lernen
1.1 Allgemeine Kennzeichnung Ein allgemeines Tag ...
Einführung und Verwendung des JS-Beobachtermodus
Inhaltsverzeichnis I. Definition 2. Anwendungssze...
Node implementiert Suchfeld für Fuzzy-Abfragen
In diesem Artikelbeispiel wird der spezifische Co...
js zur Implementierung einer Überprüfungscode-Interferenz (dynamisch)
In diesem Artikelbeispiel wird der spezifische Co...
Bedingte Kommentare zur Bestimmung des Browsers (IE-Reihe)
<!--[if IE 6]> Nur IE6 kann erkennen <![e...
Super detaillierte grundlegende JavaScript-Syntaxregeln
Inhaltsverzeichnis 01 JavaScript (abgekürzt: js) ...
uniapp implementiert Datums- und Zeitauswahl
In diesem Artikelbeispiel wird der spezifische Co...
Das Vue-Projekt realisiert Anmelde- und Registrierungseffekte
In diesem Artikelbeispiel wird der spezifische Co...
Idee in einem War-Paket verpackt, auf Tomcat bereitgestellt und Probleme mit dem Zugriffspfad (Abbildung und Text)
Der wichtigste Schritt bei der Verpacken einer Id...
Diagramm des Bereitstellungs- und Installationsprozesses in der Java+Tomcat-Umgebung
Als nächstes werde ich Java+Tomcat auf Centos7 in...
Docker Compose-Übung und Zusammenfassung
Docker Compose kann die Orchestrierung von Docker...