node js留言板练习
学习视频地址:https://www.bilibili.com/video/av27670326/?p=69
node js代码
const http = require("http");
const fs = require("fs");
const url = require("url");
const template = require("art-template");
//模拟留言数据
const msgs = [
{name:"张三1",msg:"测试1",date:"2012-12-12"},
{name:"张三2",msg:"测试2",date:"2012-12-12"},
{name:"张三3",msg:"测试3",date:"2012-12-12"},
{name:"张三4",msg:"测试4",date:"2012-12-12"}
];
http.createServer(function (req,res) {
//获取参数前面的请求路径
const parseObj = url.parse(req.url,true);
const pathname = parseObj.pathname;
//跳转到首页
if(pathname === "/" || pathname === "/index.html"){
fs.readFile("../index.html",function (err,data) {
if(err){
return res.end("404 not found...");
}
//使用art-template模版引擎进行后端数据渲染
const renderHtml = template.render(data.toString(),{msgs:msgs});
res.end(renderHtml);
return;
});
}
//访问指定到静态资源目录的文件,提供访问服务
else if(pathname.indexOf("/www") === 0){
fs.readFile(".."+pathname,function (err,data) {
if(err){
return;
}
res.end(data);
})
}else if(pathname.indexOf("/msg") == 0){
fs.readFile("../www/msg.html",function (err,data) {
if(err){
return;
}
res.end(data);
})
}else if(pathname === "/send"){
//获取请求参数
const params = parseObj.query;
params.date = "2019-12-12";
//将元素插入到数组到头部
msgs.unshift(params);
//重定向到首页
res.statusCode = 302;
res.setHeader("Location","/");
res.end();
}else {
res.end("404 not found...");
}
}).listen(3000,function () {
console.log("服务器启动完毕");
});
首页html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>node</title>
<link rel="stylesheet" href="www/css/index.css">
</head>
<body>
<h1>留言内容</h1>
<a href="/msg">开始留言</a>
<ul>
{{each msgs}}
<li>{{ $value.name }}说:{{ $value.msg }} <span>{{ $value.date }}</span></li>
{{/each}}
</ul>
</body>
</html>
首页css代码
span{
float: right;
}
留言页html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>开始留言</title>
</head>
<body>
<form action="/send">
<label for="name">姓名</label><input id="name" type="text" name="name"><br />
<label for="msg">消息</label><input id="msg" type="text" name="msg"><br />
<input type="submit" />
</form>
</body>
</html>
node js使用淘宝镜像
镜像说明地址:http://npm.taobao.org/
node中使用方式一
npm install -g cnpm --registry=https://registry.npm.taobao.org
安装后使用cnpm替换npm命令
node中使用方式二【个人推荐】
npm config set registry https://registry.npm.taobao.org
// 配置完成后 可通过以下命令查看
npm config list
如果出现以下文字说明配置成功
express模块的使用
入门demo
const express = require("express");
//创建服务器应用程序,相当于http.createServer
const app = express();
app.get("/",function (req,res) {
res.end("hello express");
});
//指定公开目录,相当于java项目中的webcontent目录
app.use("/www",express.static("../www/"));
//设置端口,相当于server.listen();
app.listen(3000,function () {
console.log("服务器启动成功");
});
nodemon自动重启服务器
sudo npm install -g nodemon
mac不加sudo会安装错误,提示没有权限
使用nodemon很简单,将以前的node命令变为 nodemon 如:node hello.js 变为 nodemon.js
在Express中使用art-template模板引擎
//使用express-art-template之前,需要安装art-template和express-art-template
const express = require("express");
//创建服务器应用程序,相当于http.createServer
const app = express();
//配置使用art-template模版引擎,第一个参数表示渲染以.art结尾的文件时,使用art-template模版引擎
//express-art-template是专门用来在Express中把art-template整合到Express中,虽然外面这里不需要加载art-template但是也必须安装
//原因在于express-art-template。如果不想以.art结尾,可以改为.html
// app.engine("art",require("express-art-template"));
app.engine("html",require("express-art-template"));
//由于response.render();默认从views目录加载文件。可以通过这个方法改变默认加载路径
app.set("views","../pages");
//渲染页面
app.get("/test",function (req,res) {
res.render("test.html",{title:"测试"})
})
//设置端口,相当于server.listen();
app.listen(3000,function () {
console.log("服务器启动成功");
});
node js学生管理系统,增删改查
初始化app.js
const express = require("express");
const fs = require("fs");
//安装body-parser的命令:npm install --save body-parser。该模块可以解析post请求中的请求参数
const bodyParser = require("body-parser");
//获取自定的路由
const router = require("./router");
//使用express创建服务器
const app = express();
//指定渲染格式,默认为art结尾的文件,这里改为html默认目录为viwes。安装该模板引擎命令:npm install --save art-template express-art-template
app.engine("html",require("express-art-template"));
//配置模版引擎和body-parser一定要在app.use(router);挂在路由之前
app.use(bodyParser.urlencoded({extended:true}));
app.use(bodyParser.json());
//开发静态资源访问目录
app.use("/node_modules/",express.static("./node_modules/"));
app.use("/public/",express.static("./public/"));
//加载路由容器挂在到app服务中
app.use(router);
app.listen(3000,function () {
console.log("启动成功");
})
路由router.js
/**
* 路由模块
*/
const fs = require("fs");
//express提供了一个更好的方式专门包装路由
const express = require("express");
//加载自定义的数据操作工具类,定义数据的增删改查
const studentUtil = require("./students")
//1、创建一个路由容器
const router = express.Router();
//2、把router都挂在到router中
router.get("/students",function (req,res) {
studentUtil.find(function (err,data) {
if(err){
//设置状态码,并返回值
return res.status(500).send("server error");
}
res.render("index.html",{
fruits:["苹果","香蕉","橘子","芒果"],
//从文件中读取students并转为json格式渲染
students:data
});
})
})
router.get("/students/new",function (req,res) {
res.render("new.html");
})
router.post("/students/new",function (req,res) {
//获取请求中的表单数据
const student = req.body;
//将数据保存到本地的db.json中
studentUtil.save(student,function (err) {
if(err){
return res.status(500).send("server error");
}
})
//发送响应,跳转到首页
res.redirect("/students");
})
router.get("/students/edit",function (req,res) {
const id = parseInt(req.query.id);
studentUtil.getStudentById(id,function (err,data) {
res.render("edit.html",{student:data});
});
})
router.post("/students/edit",function (req,res) {
//获取提交的修改学生信息
const student = req.body;
//更新数据
studentUtil.update(student,function (err) {
if(err){
return res.status(500).send("server error")
}
res.redirect("/students");
})
})
router.get("/students/delete",function (req,res) {
studentUtil.delete(req.query.id,function (err) {
if(err){
return res.status(500).send("server error")
}
res.redirect("/students");
})
})
//3、把router导出
module.exports = router;
文件操作student.js操作
/*
*数据操作文件模块,对本地文件的db.json的增删改查
*/
const fs = require("fs");
//文件路径
const dbPath = "./db.json";
//获取所有学生列表,返回数组。
exports.find = function (callback) {
fs.readFile(dbPath,"utf-8",function (err,data) {
if(err){
return callback(err);
}
callback(null,JSON.parse(data).students);
})
}
//根据学生id获取学生信息
exports.getStudentById = function(id,callback){
fs.readFile(dbPath,"utf-8",function (err,data) {
if(err){
return callback(err);
}
const readStudents = JSON.parse(data).students;
const student = readStudents.find(function (item) {
return item.id === id;
});
callback(null,student);
})
}
//添加学生,如果出错返回错误信息
exports.save = function (student,callback) {
fs.readFile(dbPath,"utf-8",function (err,data) {
if(err){
return callback(err);
}
//获取文件中的学生信息
const readData = JSON.parse(data).students;
//设置学生id为最后一个加一
student.id = readData[readData.length - 1].id + 1;
//将新添加的学生加入到已存在的学生中
readData.push(student);
const resultData = JSON.stringify({students: readData});
//写入文件
fs.writeFile(dbPath,resultData,function (err) {
if(err){
return callback(err);
}
callback();
})
})
}
//更新学生
exports.update = function (student,callback) {
fs.readFile(dbPath,"utf-8",function (err,data) {
if(err){
return callback(err);
}
//将学生ID设置为int型
student.id = parseInt(student.id);
//获取文件中的学生信息
const readStudents = JSON.parse(data).students;
const targetStudent = readStudents.find(function (item) {
return item.id === student.id;
});
//将更行数据写入到文件获取到对象中
for(let key in student){
targetStudent[key] = student[key];
}
const resultData = JSON.stringify({students: readStudents});
//写入文件
fs.writeFile(dbPath,resultData,function (err) {
if(err){
return callback(err);
}
callback();
})
});
}
//删除学生
exports.delete = function (id,callback) {
fs.readFile(dbPath,"utf-8",function (err,data) {
if(err){
return callback(err);
}
//将学生ID设置为int型
id = parseInt(id);
//获取文件中的学生信息
const readStudents = JSON.parse(data).students;
//获取要删除学生在数组的下标
const itemIndex = readStudents.findIndex(function (item) {
return item.id === id;
});
//根据下标删除对应的学生数据,splice方法第一个参数是要删除的位置,第二个参数是删除多少个
readStudents.splice(itemIndex,1);
const resultData = JSON.stringify({students: readStudents});
//写入文件
fs.writeFile(dbPath,resultData,function (err) {
if(err){
return callback(err);
}
callback();
})
});
}