第一章 2020-2-6 留言小本子
思路(由于本章没有数据库,客户提交的数据放在全局变量,接收请求用的是bodyParser,
padyParser使用方法
app.use(bodyParser.urlencoded({extended:false }))
设置全局方法
在express框架中
________________________________
let entries = [];
app.localls.entries=entries;
_____________________________________
在收到请求的数据路由中增加到全局数组 示例代码:
entries.push({
title :req.body.title,
content:req.body.content,
published: new.Date()
})
处理提交数据前得验证一下是否有数据,示例代码
if(!req.body.title || ! req.body.contont){
// res.statue(400).send('数据为空也返回');
return;
}else{
//处理得到数据后的逻辑
}
增加完成后跳到展示页需要用到重定向:
res.redirect('/')
_______________________________________________________
而这个时候有数据了,怎么填充到模板呢?示例代码
<% if(entries.length){ %>
<%
//备注entries 是后台的全局一个对象,可以用forEach遍历数组,但是不要用ec6语法 具体遍历后的对像放在参数
//中 ,这里参数是entry,ejs模板中脚本部份是<%%> 而数据则用<%= %>
entries.forEach(function(entry){
})%>
<div><%=entry.title%>
<div><%=entry.content%></div>
<div class="card mg-3">
< %} else{ %>
暂无留言:<a href="/new">去增加一条留言!</a>
} %>
<div>
<div>
————————————————————————————————————————————————
附录图片:
————————————————————————————————————————————————————————
测试环境中,静态页不能post的地址直接写127.0.0.1 否则为Dwww127.0.0.1 该为http://127.0.0.1
示例代码:前端
——————————————————————————————————————————————————————————————————
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>login</title>
</head>
<br>
<form action="http://127.0.0.1" method="post">
<label for="user"> 用户名:<input type="text" name="user"></label><br>
<label for="word"> 用户名:<input type="password" name="pass"></label><br>
<input type="submit" value="提交">
</form>
</body>
</html>
————————————————————————————————————————————————————————————————————————————————————————————————
后端代码
————————————————————————————————————————————————————————————————————————————————————————————————————
const http = require('http');
http.createServer((req,res)=>{
let postData = '';
req.on('data',(data)=>{
postData+=data;
console.log(postData);
res.end();
});
}).listen(80,'127.0.0.1',()=>{
console.log('服务器也启动');
});
————————————————————————————————————————————————————————————————————2020-02-10
静态初步:
我们想通过路径区配地址:
const http = require('http');
const url = require('url');
const fs = require('fs');
//不导path 就算路径识别了,也会出现编码错误!
const path = require('path');
const queryString = require('querystring');
http.createServer((req,res)=>{
let pathUrl = url.parse(req.url);
let pathName = pathUrl.pathname;
let postData = {};
if('/index' == pathName){
console.log(__dirname);
// 读取文件的参数第一个是路径,第二个函数
fs.readFile(path.join(__dirname,'static/loing.html'),(err,data)=>{
if(err) throw err;
res.writeHead(200,{'content-type':'text/html;charset=utf-8'});
res.end(data);
})
}
}).listen(80,'127.0.0.1',()=>{
console.log('服务器也启动');
});
______________________________________________________________________________________
bodyparser
原理:
引入的包是自己写的,目前是测试怎么弄一个怎么定义包后加一个属性,以下是引用端 2020-2-11
————————————————————————————————————————————————————————————————————————————————————————————————
const express = require('express');
const bodyparser = require('./zhibodyparser');
var server = express();
var.listen(80);
server.use(bodyParser2.aaa());
server.use('/',function(req,res){
console.log(req.body);
});
——————————————————————————————————————————————————————————————————————————————————————————————
以下是定义端:01
——————————————————————————————————————————————————————————————————————————————————————————————————————————————
const querystring = require('querystring');
module.exports = function (){
return function(req,res,next){
var str='';
req.on('data',function(data){
str+=data;
});
req.on('end',function(){
req.body = querystring.parse(str);
next();
});
}
}
_________________________________________________
以下是定义端:02
const querystring = require('querystring');
module.exports = {
//目是是让module.express是一对象,对象的aaa是一个函数
aaa:function(){
return function(req,res,next){
var str='';
req.on('data',function(data){
str+=data;
});
req.on('end',function(){
req.body = querystring.parse(str);
next();
});
}
}
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++2020-2-11-18:23(智能社)
cookie 使用
const express = require('express');
const cookieParser = require('cookie-parser');
var server = express();
server.use(cookieParser());
server.use('/',function(req,res){
res.cookie('user','blue');
res.send('ok');
//如果是设置cookie 可以在任何时候res.cookie,但要获取需要cookie-parser中间件
//res.cookie('usde','ssss')获取需要中间件,使用很方便 2020-02-11
console.log(req.cookies);
res.end();
});
server.listen(80);
——————————————————————————————————————————————————————————————————————————————————
综合例子:
--------------------------------------------------------------------------------------
const express = require('express');
const static= require('express-static');
const cookieParser = require('cookie-parser');
const cookieSession = require('cookie-session');
const bodyParser = require('body-parser');
const ejs = require('ejs');
var server = express();
server.use(cookieParser('sadlfkdldlfd'));
var arr = [];
for(var i = 0; i<10000; i++){
arr.push('deys_'+Math.random());
}
server.use(cookieSession({name:'aaa',keys:arr, maxAge: 20*3600*100}));
server.use(bodyParser.urlencoded({extended:false}));
server.use('/',function (req,res,next) {
res.cookie();
console.log(req.query,+req.body,req.cookies,req.session);
res.end();
});
server.use(static('./www'));
server.listen(80);
——————————————————————————————————————————————————————————————————————————2020-2-12
以上方法不能上传文件,,上传文件需要插件 multer 智能社的方法,和昭山欢用的插件不一样
示例代码:
——————————————————————————————————————————
const express = require('express');
const bodyParser = require('body-parser');
const multer = require('multer');
var server = express();
server.use(bodyParser.urlencoded({extended: false}));
var objMulter = multer();
//objMulter接收name为指定的,而any();接收任意的
server.use(objMulter.single('f1'));
server.use(objMulter.any());
server.post('/',function(req,res){
cosole.log(req.body);
//用了multer 会多了一个req.files属性
});
server.listen(80);
返回的结果是:
可以看出文件是二进制,说明文件在在内存,,这个时候可以设置保存路径;
var objMulter = multer({dest: './www/'});
完整代码如下:附图上传后后台console.log(
const express = require('express');
const bodyParser = require('body-parser');
const multer = require('multer');
var server = express();
server.use(bodyParser.urlencoded({extended: false}));
var objMulter = multer();
//设置目录后可以不用保存到内存
var objMulter = multer({dest: './www/'});
server.use(objMulter.single('f1'));
server.use(objMulter.any());
server.post('/',function(req,res){
cosole.log(req.files);
});
server.listen(80);
)
const express = require('express'); const bodyParser = require('body-parser'); const multer = require('multer'); var server = express(); server.use(bodyParser.urlencoded({extended: false})); var objMulter = multer(); //设置目录后可以不用保存到内存 var objMulter = multer({dest: './www/'})'' server.use(objMulter.single('f1')); server.use(objMulter.any()); server.post('/',function(req,res){ cosole.log(req.body); }); server.listen(80);
文件名是这样子,需要改名:改名之前需要复习一下path包
const path = require('path');
var str = "c;\wamp\wwwa.html";
var obj = path.parse(str);
console.log(obj);
//将返回base 文件名 ext 扩展名 path 全路径 pathname除了文件名的部份共 四个部份
怎么改名呢,第一上面图片中path是文件路径 扩展名可以用path来获取
新路径等于:
var newname = req.files[0].path+path.ext(req.files[0].files[0].originalname);
fs.reneame(req.files[0].path,bewName,function(err){
if(err)
res.send("上传失败");
else
res.send(‘上传成功')
})