1. Вступительный анализ
Всем привет, Большой Медведь снова здесь. Вчера я не писал блог из -за чего -то личного, поэтому я снова вышел сегодня. Эта статья в основном о написании небольшого приложения для блокнота, предыдущей статьи,
Я также представил использование промежуточного программного обеспечения «подключить» и использование «mongodb». Сегодня я объединю эти два промежуточных программного обеспечения, чтобы написать практическое пример, постоянно улучшать и рефактор, и достиг цели "искреннего"
Цель полного обучения. Хорошо, давайте перестанем говорить чушь, просто перейдем к теме.
2. Анализ требований
(1) Функция регистрации и входа в систему пользователя (сценарии сложных взаимодействий не включены, и пользователь определит, существует ли она уже при регистрации).
(2) Пользователь успешно вошел в систему и ввел фон системы управления примечаниями (функция добавления, удаления, изменения и проверки модуля Note).
(3) Пользователи могут иметь простое разделение разрешений (администратор, зарегистрированный пользователь).
(4) Интерфейс относительно прост и фокусируется на обучении.
3. Начните проектирование и применение (часть 1)
(1), Создайте страницу входа в систему пользователя, код следующим образом:
Кода -копия выглядит следующим образом:
<! Doctype html>
<html>
<голова>
<TILE> Блокнот BIGBEAR Блокнот
<Meta Content = "IE = 8" http-equiv = "x-ua-совместимый"/>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<стиль типа = "text/css">
.note-title {
маржинальный бат: 45px;
Фон: #6699CC;
размер шрифта: 14px;
шрифт-вес: жирный шрифт;
Цвет: #ffff;
Семейство шрифта: ариальная;
Высота: 24px;
высота линии: 24px;
}
a {
Цвет: #336699;
Семейство шрифта: ариальная;
размер шрифта: 14px;
шрифт-вес: жирный шрифт;
}
</style>
<script src = "js/index.js"> </script>
</head>
<тело>
<div> Блокнот Блокнот.
<form action = "/login" method = "post">
<pan> имя пользователя: </span> <input type = "text" name = "name"/> <br/> <br/>
<pan> Пароль: < /span> <input type = "пароль" name = "пароль" />
<input type = "отправить" value = "login" />
<a href = "reg.html"> я хочу зарегистрироваться </a>
</form>
</body>
</html>
Изображение воспроизведения:
(2) Создать страницу регистрации пользователя, код следующим образом:
Кода -копия выглядит следующим образом:
<! Doctype html>
<html>
<голова>
<название> Блокнот -регистрация приложений Bigbear </title>
<Meta Content = "IE = 8" http-equiv = "x-ua-совместимый"/>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<стиль типа = "text/css">
.note-title {
маржинальный бат: 45px;
Фон: #FF3300;
размер шрифта: 14px;
шрифт-вес: жирный шрифт;
Цвет: #ffff;
Семейство шрифта: ариальная;
Высота: 24px;
высота линии: 24px;
}
</style>
<script src = "js/index.js"> </script>
</head>
<тело>
<div> Блокнот.
<form action = "/reg" method = "post">
<pan> имя пользователя: </span> <input type = "text" name = "name"/> <br/> <br/>
<pan> пароль: </span> <input type = "password" name = "password"/> <br/> <br/>
<input type = "отправить" value = "Register" />
</form>
</body>
</html>
Изображение воспроизведения:
(3) установить код подключения «mongoDB» следующим образом:
Кода -копия выглядит следующим образом:
var mongodb = require ("mongodb");
var server = new mongodb.server ("localhost", 27017, {
Auto_reconnect: True
});
var conn = new mongodb.db ("bb", server, {
Безопасно: правда
});
conn.open (function (error, db) {
if (ошибка) ошибки бросает;
console.info ("mongodb подключен!");
});
exports = module.exports = conn;
(4) Создать класс модели «Пользователь», следующим образом:
Кода -копия выглядит следующим образом:
var conn = require ("../ conn");
Пользователь функции (пользователь) {
this.name = user ["name"];
this.password = user ["пароль"];
};
User.prototype.save = function (обратный вызов) {
var that = это;
conn.collection ("users", {
Безопасно: правда
}, function (error, collection) {
if (ошибка) вернуть conn.close ();
collection.findone ({// определить, существует ли этот пользователь
Имя: это
}, функция (ошибка, пользователь) {
if (ошибка) вернуть conn.close ();
if (! user) {
collection.insert ({
Имя: that.name + "",
пароль: that.password + ""
}, {
Безопасно: правда
}, функция (ошибка, пользователь) {
if (ошибка) вернуть conn.close ();
Callback && Callback (пользователь);
conn.close ();
});
}
еще{
Callback («Пользователь зарегистрирован!»);
}
});
});
};
User.login = function (имя, пароль, обратный вызов) {
conn.collection ("users", {
Безопасно: правда
}, function (error, collection) {
if (ошибка) вернуть conn.close ();
collection.findone ({
Имя: Имя,
Пароль: пароль
}, функция (ошибка, пользователь) {
if (ошибка) вернуть conn.close ();
Callback && Callback (пользователь);
conn.close ();
});
});
};
exports = module.exports = user;
Изображение воспроизведения:
(5), Создайте приложение «Приложение» следующим образом:
Кода -копия выглядит следующим образом:
// app.js
var connect = require ("./ 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", function (запрос, ответ, следующий) {
var name = request.body ["name"];
var password = request.body ["пароль"];
user.login (имя, пароль, функция (пользователь) {
if (user) {
response.end ("Добро пожаловать в:" + user ["name"] + " ^ _ ^ ... ...");
}
еще{
response.end ("user:" + name + "не зарегистрироваться!");
}
});
})
.USE ("/reg", function (запрос, ответ, следующий) {
var name = request.body ["name"];
var password = request.body ["пароль"];
новый пользователь ({
Имя: Имя,
Пароль: пароль
}). Сохранить (function (user) {
if (user && user ["name"]) {
response.end ("user:" + name + "register!");
}
еще{
response.end ("user:" + name + "зарегистрировано!");
}
});
})
.listen (8888, function () {
console.log ("Веб-сервер, работающий на порту ---> 8888.");
});
Позвольте мне объяснить:
(1.)
(2) "Connect.bodyParser ()" ------ Обработайте анализ запроса "post".
(3) "Connect.static (__ dirname +"/views "), connect.static (__ dirname +"/public ")"
Представляет представление шаблона «HTML» и каталоги ресурсов, которые статические ресурсы, такие как «JS, CSS, JPG, GIF».
Ниже приведена структура каталогов этого приложения:
Четыре, давайте обобфрим
(1) Осредственно освоить основные операторы операции Nodejs, работающую в базе данных.
(2), разделите иерархии, такие как модели, представления и маршруты.
(3) Непрерывно оптимизировать и изменять примеры в этой статье (например, регистрация, чтобы проверить, существует ли пользователь, вы можете самостоятельно создать «пользовательский менеджер», чтобы завершить проверку пользователя и сохранение действий).
(4) Чтобы продолжать выполнять последующие функции завтра, пожалуйста, с нетерпением ждем этого.