1. Öffnungsanalyse
Hallo allerseits, Big Bear ist wieder da. Gestern habe ich keinen Blog wegen etwas Persönliches geschrieben, also bin ich heute wieder herausgekommen. In diesem Artikel geht es hauptsächlich darum, eine kleine Bewerbung für Notepad, den vorherigen Artikel, zu schreiben,
Ich habe auch die Verwendung von "Connect" Middleware und die Verwendung von "MongoDB" eingeführt. Heute werde ich diese beiden Middleware kombinieren, um ein praktisches Beispiel zu schreiben, es ständig zu verbessern und neu zu refaktor und das Ziel von "aufrichtig" erreicht, "aufrichtig" zu erreichen.
Der Zweck des vollen Lernens. OK, lass uns aufhören, Unsinn zu reden, einfach direkt zum Thema gehen.
2. Analyseanalyse
(1) Benutzerregistrierungs- und Anmeldungsfunktion (es sind keine komplexen Interaktionsszenarien beteiligt, und der Benutzer bestimmt, ob sie bereits bei der Registrierung vorhanden sind).
(2) Der Benutzer hat sich erfolgreich angemeldet und in den Hintergrund des Note -Management -Systems (die Funktion des Hinzufügens, Löschens, Änderns und Überprüfens des Notizmoduls) eingegeben.
(3) Benutzer können eine einfache Berechtigungsabteilung (Administrator, registrierter Benutzer) haben.
(4) Die Schnittstelle ist relativ einfach und konzentriert sich auf das Lernen.
3.. Entwerfen und Anwendung (Teil 1)
(1) Erstellen Sie eine Benutzeranmeldeseite, der Code lautet wie folgt:
Die Codekopie lautet wie folgt:
<! docType html>
<html>
<kopf>
<title> Bigbear Notepad Application Login </title>
<meta content = "ie = 8" http-äquiv = "x-ua-kompatible"/>
<meta http-äquiv = "content-type" content = "text/html; charset = utf-8">
<style type = "text/css">
.note-title {
Randboden: 45px;
Hintergrund: #6699cc;
Schriftgröße: 14px;
Schriftgewicht: fett;
Farbe: #ffff;
Schriftfamilie: Arial;
Höhe: 24px;
Zeilenhöhe: 24px;
}
A {
Farbe: #336699;
Schriftfamilie: Arial;
Schriftgröße: 14px;
Schriftgewicht: fett;
}
</style>
<script src = "js/index.js"> </script>
</head>
<body>
<div> Bigbear Notizbeinanmeldung Anmeldung </div>
<form action = "/login" method = "post">
<span> Benutzername: </span> <Eingabe type = "text" name = "name"/> <br/> <br/>
<span> Passwort: < /span> <Eingabe type = "Passwort" name = "password" />
<input type = "sure" value = "login" />
<a href = "reg.html"> Ich möchte mich registrieren </a>
</form>
</body>
</html>
Reproduktionsbild:
(2) Erstellen einer Benutzerregistrierungsseite, der Code ist wie folgt:
Die Codekopie lautet wie folgt:
<! docType html>
<html>
<kopf>
<title> Bigbear Notepad Application Registrierung </title>
<meta content = "ie = 8" http-äquiv = "x-ua-kompatible"/>
<meta http-äquiv = "content-type" content = "text/html; charset = utf-8">
<style type = "text/css">
.note-title {
Randboden: 45px;
Hintergrund: #ff3300;
Schriftgröße: 14px;
Schriftgewicht: fett;
Farbe: #ffff;
Schriftfamilie: Arial;
Höhe: 24px;
Zeilenhöhe: 24px;
}
</style>
<script src = "js/index.js"> </script>
</head>
<body>
<Div> Bigbear Notepad Application Registrierung </div>
<form action = "/reg" method = "post">
<span> Benutzername: </span> <Eingabe type = "text" name = "name"/> <br/> <br/>
<span> Passwort: </span> <Eingabe type = "password" name = "password"/> <br/> <br/>
<Eingabe type = "surug" value = "Register" />
</form>
</body>
</html>
Reproduktionsbild:
(3) Legen Sie den Verbindungscode "MongoDB" wie folgt fest:
Die Codekopie lautet wie folgt:
var mongoDB = Request ("MongoDB");
var server = new MongoDB.Server ("localhost", 27017, {
AUTO_RECONNECT: TRUE
});
var conn = new mongoDB.db ("bb", server, {
sicher: wahr
});
conn.open (Funktion (Fehler, DB) {
Wenn (Fehler) Fehler werfen;
console.info ("MongoDB Connected!");
});
exports = module.exports = conn;
(4) Erstellen Sie die Modellentitätsklasse "Benutzer" wie folgt:
Die Codekopie lautet wie folgt:
var conn = require ("../ conn");
Funktion Benutzer (Benutzer) {
this.name = user ["name"];
this.Password = user ["password"];
};
User.prototype.save = function (radback) {
var das = dies;
Conn.Collection ("Benutzer", {
sicher: wahr
}, Funktion (Fehler, Sammlung) {
if (Fehler) return conn.close ();
Collection.Findone ({// Bestimmen Sie, ob dieser Benutzer existiert
Name: this.name
}, Funktion (Fehler, Benutzer) {
if (Fehler) return conn.close ();
if (! Benutzer) {
Sammlung.insert ({{
Name: that.name + "",
Passwort: das.Password + ""
}, {
sicher: wahr
}, Funktion (Fehler, Benutzer) {
if (Fehler) return conn.close ();
Callback && Callback (Benutzer);
conn.close ();
});
}
anders{
Callback ("Benutzer hat sich registriert!");
}
});
});
};
User.login = Funktion (Name, Passwort, Rückruf) {
Conn.Collection ("Benutzer", {
sicher: wahr
}, Funktion (Fehler, Sammlung) {
if (Fehler) return conn.close ();
Collection.Findone ({{
Name: Name,
Passwort: Passwort
}, Funktion (Fehler, Benutzer) {
if (Fehler) return conn.close ();
Callback && Callback (Benutzer);
conn.close ();
});
});
};
exports = module.exports = user;
Reproduktionsbild:
(5) erstellen Sie die Anwendung "App" wie folgt:
Die Codekopie lautet wie folgt:
// app.js
var Connect = Request ("./ lib/connect");
var user = require ("./ models/user");
var app = connect.createServer ();
App .use (Connect.logger ("Dev"))
.use (Connect.Query ())
.use (connect.bodyparser ())
.use (connect.cookieParser ())
.use (Connect.static (__ DirName + "/Views"))
.use (Connect.static (__ DirName + "/public"))
.use ("/login", Funktion (Anfrage, Antwort, Weiter) {
var name = request.body ["name"];
var password = request.body ["password"];
user.login (Name, Passwort, Funktion (Benutzer) {
if (Benutzer) {
Antwort.end ("Willkommen zu:" + user ["name"] + " ^ _ ^ ... ...");
}
anders{
Antwort.end ("Benutzer:" + Name + "Nicht registrieren!");
}
});
})
.use ("/reg", Funktion (Anfrage, Antwort, Weiter) {
var name = request.body ["name"];
var password = request.body ["password"];
neuer Benutzer ({{
Name: Name,
Passwort: Passwort
}). Speichern (Funktion (Benutzer) {
if (user && user ["name"]) {
Antwort.end ("Benutzer:" + Name + "Register erledigt!");
}
anders{
Antwort.end ("Benutzer:" + name + "hat sich registriert!");
}
});
})
.Listen (8888, function () {
console.log ("Webserver auf Port ---> 8888.");
});
Lassen Sie mich erklären:
(1) "Connect.Query ()" ------- Verarbeiten Sie die Analyse der Anfrage "Get".
(2) "Connect.Bodyparser ()" ------ Verarbeiten Sie die Analyse der "Post" -Anforderung.
(3) "Connect.static (__ DirName +"/Views "), Connect.static (__ DirName +"/public ")"
Repräsentiert die Vorlagenansicht "HTML" und die Ressourcenverzeichnisse, die statische Ressourcen wie "JS, CSS, JPG, GIF".
Das Folgende ist die Verzeichnisstruktur dieser Anwendung:
Vier, lasst uns zusammenfassen
(1) Beherrschen Sie die grundlegenden Betriebsanweisungen der NodeJS -Betriebsdatenbank.
(2) teilen Sie Hierarchien wie Modelle, Ansichten und Routen.
(3) die Beispiele in diesem Artikel kontinuierlich optimieren und ändern (z. B. Registrierung, um zu überprüfen, ob der Benutzer existiert, können Sie unabhängig einen "UserManager" erstellen, um die Benutzerüberprüfung und das Speichern von Aktionen abzuschließen).
(4) Um weiterhin nachfolgende Funktionen auszufüllen, freuen Sie sich darauf.