Express框架笔记

暑い….jpg ![ ![WechatIMG61.jpeg](http://upload-images.jianshu.io/upload_images/1552225-887af54c9a68ce75.jpeg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) ](http://upload-images.jianshu.io/upload_images/1552225-ef382318918f2c1b.jpeg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
  • 个人入门学习用笔记、不过多作为参考依据。如有错误欢迎斧正

  • Express框架

  • 路由能力

   const express = require('express');
   
   const app = express();
   //get请求的响应
   app.get('/',(req,res) => {
       res.send('你好');
   });
   //post请求的响应
   app.post('/haha',(req,res) => {
       res.send('这是haha');
   });
   //所有请求
   app.all('/',(req,res) => {
       res.send('你好');
   });
   //支持正则表达式(内部表示参数区分)
   app.get(/^\/student\/([\d]{10})$/,(req,res) =>{
       res.send('学生信息.学号:'+req.params[0]);
   });
   
   //:xxxx可以自定义参数通过.req.params.xxxx提取
   app.get('/teacher/:gonghao',(req,res) => {
       var gonghao;
       gonghao = req.params.gonghao;
       res.send('老师信息.工号:'+gonghao);
   });
   
   app.listen(3000,() =>{
       console.log('监听成功');
   });
  • 与模板引擎配合

与原生ejs相比、不需要fs读取文件、转成字符串、再进行替换输出

   const express = require('express');
   
   const app = express();
   //此处就相当于引用了ejs
   app.set('view engine','ejs');
   
   app.get('/',(req,res) => {
       var json = {
           'news':['第一个','第二个','第三个']
       }
       //在工程内存在ejs框架的情况下、并不需要引用ejs即可使用模板
       //默认读取文件的路径为./views/xxx。可以直接简写成xxx
       //讲haha.ejs文件与json模板配合后、返回替换成功的文件。
       res.render('haha',json);
   });
   
   app.listen(3000);
  • RESTful路由设计

  • 让get、add、post、delete响应同一个url的不同http请求方式。节约url数量
  • html通常只发起get、post。app可能会出现add、delete请求。
 const express = require('express');
 const app = express();
 
 //设置模板引擎
 app.set('view engine','ejs');
 
 
 app.get('/',(req,res)=>{
     //直接返回form.ejs解析成html后的文件
     res.render('form');
 });
 
 //post和get共用一个url
 //节约了一个url
 app.post('/',(req,res) =>{
     res.send('成功');
 });
 
 app.listen(3000);
  • 中间件

  • get、post、use等、叫做中间件
  • 中间件执行的顺序。
自上而下、当第一个路径匹配成功、默认不继续寻找(即使第一个中并没有send())。
但我们可以通过调用第三个参数next()、让app继续向下搜索响应。需要注意的是next当前函数下不能以再使用send();
 const express = require('express');
 const app = express();
 //正常情况下、'/:Id'已经包含了'/100'所以路由搜索到此为止。
 app.get('/:Id',(req,res,next) => {
     console.log('第一个get');
     //通过next、让app继续向下搜索
     next();
 });
 
 app.get('/100',(req,res) => {
     console.log('第二个get');
     res.send()
 });
 
 app.listen(3000);

use

  • use也是一个中间件。
  • use就是get与post
  • 与get/post不同。他可以匹配目标路径之后所有的子文件夹。

此示例下、admin/aa/xxx/x/x/x/x/x/是可以被检索的。
但是admin/bb则不行

 const express = require('express');
 const app = express();
 
 app.use('/admin/aa', function(req, res, next) {
   // GET 'http://www.example.com/admin/aa/new'
   console.log(req.originalUrl); // '/admin/aa/new'
   console.log(req.baseUrl); // '/admin/aa'
   console.log(req.path); // '/new'
   next();
 });
 //当不实现具体路径的时候、express会自动匹配所有地址
 app.use((req,res) => {
     res.send('你好');
 });

 app.listen(3000);
  • 静态文件伺服
     // 静态文件伺服
     const express = require('express');
     const app = express();
     //所有请求全部先检测静态文件
     app.use(express.static('./public'));
     //只有以/wocao开头的采取读取静态文件
     app.use('/wocao',express.static('./wocao'));
    
     app.get('/hahaha',(req,res) => {
        res.send('hahaha')
     });
     
     app.listen(3000);
    
  • 此时在浏览器中输入127.0.0.1:3000/xxx.html即可

  • 输入127.0.0.1:3000/wocao/xxx.html也可

  • 输入127.0.0.1:3000/hahaha 显示hahaha(static内部有next()机制)

  • 输入其他显示cannot get

  • 在读取静态文件的情况下、如果只输入文件夹名。会默认读取该文件夹下的index.html文件

404

  • 把通配符放于最后处理。这样没有经过路由的所有页面默认由 404.html 来接管。
 // 404
 app.get('*', function(req, res){
     res.render('404.html', {
         title: 'No Found'
     })
 });

内容渲染

  • 大多数情况下、渲染用res.render()。将会根据views中的模板文件进行渲染。

  • 如果不想使用views文件夹(比如替换成view2文件夹)

    app.set('views','views2');
    //也可以跨路径指定(比如指定到上级的views)
    app.set('views','../views');
    
  • 如果想写一个快速测试页、当然可以使用res.send()。这个函数将根据内容、自动帮我们设置Content-Type头部和200状态码。

  • send同end一样只能用一次。
    一般send用于返回json等数据。

  • 如果想使用不同的状态码,可以

     res.status(404).send('sorry,web caonnot find that!');
    
  • 如果想使用不同的Content-Type,可以

     res.set('Content-Type','text/html');
    

Get请求处理

express会自动帮我们把参数转换成json以及数组.通过req.query得到

 const express = require('express');
 const app = express();
 
 app.get('*',(req,res) =>{
     console.log(req.query);
     res.send(req.query);
 });
 
 app.listen(3000);

Post请求

  • 文档推荐使用req.body也就是 body-parse来处理
    const express = require('express');
    const app = express();
    var bodyParser = require('body-parser');
    
    
    app.use(bodyParser.urlencoded({ extended: false }));
    app.use(bodyParser.json());
    
    app.set('view engine','ejs');
    
    app.set('views','../views');
    
    app.get('*',(req,res) =>{
        res.render('form');
    });
    
    app.post('/',(req,res) => {
        console.log(req.body);
        res.send(req.body);
    });
    
    app.listen(3000);
    
  • 如果涉及文件上传、依旧需要使用formidable

res.sendFile

  • 如果你想直接返回一个文件、比如html。但又不想耽误用render传输模板文件、可以使用这个
     app.get('/test',(req,res) => {
         res.sendFile(__dirname +'/views/index.html');
     });
    

页面绑定参数

  • ejs本身就是替换模板、所以:
     //最后的404中间件
     app.use('*',(req,res) => {
         res.render('err',{'kirito':'kirito111'});
     });
    
    
     <script>
         var kirito ='<%= kirito%>';
         console.log(kirito)
     </script>
    

重定向

  • 定向回上一页
     res.redirect('/');
    
  • 定向到其他路由
     res.redirect('/xxx');
    

Cookie

  • HTTP是无状态协议。也就是说当你浏览了一个页面、然后转到同一个网站的另一个页面、服务器无法认识到、这是同一台计算机、同一个浏览器。
  • Cookie是一个简单的想法:当访问一个页面的时候、服务器在下行HTTP报文中、命令浏览器储存一个字符串;浏览器再访问同一个域的时候、将把这个字符串携带到上行HTTP请求中。
特点:
  • 不加密、用户可以看到
  • 用户可以删除、或者禁用
  • cookie可以被篡改
  • cookie可以用于攻击
  • cookie的存储量很小。未来或许要被localstorage(IE9兼容)取代
express中的Cookie
  • res负责设置cookie

     res.cookie(K&V)
    
  • req负责识别cookie

  • 通过node设置cookie

    res.cookie.key
    
    const express = require ('express');
    const app = express();
    //使用cookie必须使用cookie-parser中间件
    const cookieParser = require('cookie-parser');
    
    app.use(cookieParser());
    
    app.get('/',(req,res) => {
        //maxAge在express中以毫秒为单位
        res.cookie('xihao','tfboys',{maxAge:900000,httpOnly:true});
        res.send('cookie='+req.cookies.xihao);
    });
    
    app.listen(3000);
    
  • 下行报文中

WechatIMG60.jpeg
  • 上行报文中
WechatIMG61.jpeg

Session

  • 保持登录状态

  • Session从头至尾依赖cookie、一旦禁用/清除cookie、sessiion也会失效

  • Session作为乱码令牌发还给用户。服务器为令牌存储具体信息

  • 理论上可以存储无线大小的数据

     const express = require ('express');
     const app = express();
     
     var session = require('express-session');
     
     app.use(session({
         secret: 'keyboard cat',
         resave: false,
         saveUninitialized: true
     }));
     
     app.get('/login',(req,res) => {
         //设置session
         req.session.login = '1';
         req.session.username = 'kirito';
         res.send('成功登录');
     });
     
     app.get('/',(req,res) => {
         if (req.session.login == '1'){
             res.send('欢迎'+req.session.username+'您已成功登录');
         }else {
             res.send('尚未登录');
         }
     });
     
     
     app.listen(3000);  
    
  • 需要注意的是
  • 若将服务器重新启动、访问根目录。会显示未登录状态

  • 因为login以及username都缓存在服务器的express-session模块内

MD5加密

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,242评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,769评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,484评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,133评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,007评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,080评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,496评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,190评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,464评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,549评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,330评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,205评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,567评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,889评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,160评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,475评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,650评论 2 335

推荐阅读更多精彩内容