学习Express

学习Express

起步

cnpm install express
npm i -S express
// 引入express
var express = require('express');

// 1. 创建app
var app = express();

//  2. 
app.get('/',function(req,res){
    // 1
    // res.write('Hello');
    // res.write('World');
    // res.end()

    // 2
    // res.end('hello world');

    // 3
    res.send('hello world');
})

app.listen(3000,function(){
    console.log('express app is runing...');
})
基本路由

路由:

  • 请求方法

  • 请求路径

  • 请求处理函数

get:

//当你以get方法请求/的时候,执行对应的处理函数
app.get('/',function(req,res){
    res.send('hello world');
})

post:

//当你以post方法请求/的时候,执行对应的处理函数
app.post('/',function(req,res){
    res.send('hello world');
})
Express静态服务API
// app.use不仅仅是用来处理静态资源的,还可以做很多工作(body-parser的配置)
//public资源
app.use(express.static('public'));

//static资源
app.use(express.static('files'));

// /public/xxx
app.use('/public',express.static('public'))

// /static/xxx
app.use('/stataic',express.static('public'));
// 引入express
var express = require('express');

// 创建app
var app = express();

// 开放静态资源
// 1.当以/public/开头的时候,去./public/目录中找对应资源
// 访问:http://127.0.0.1:3000/public/login.html
app.use('/public/',express.static('./public/')); 

// 2.当省略第一个参数的时候,可以通过省略/public的方式来访问
// 访问:http://127.0.0.1:3000/login.html
// app.use(express.static('./public/'));   

// 3.访问:http://127.0.0.1:3000/a/login.html
// a相当于public的别名
// app.use('/a/',express.static('./public/')); 

//  
app.get('/',function(req,res){
    res.end('hello world');
});

app.listen(3000,function(){
    console.log('express app is runing...');
});
在Express中配置使用art-templete模板引擎
  • art-template官方文档
  • 在node中,有很多第三方模板引擎都可以使用,不是只有art-template
    • 还有ejs,jade(pug),handlebars,nunjucks

安装:

npm install --save art-template
npm install --save express-art-template

//两个一起安装
npm i --save art-template express-art-template

配置:

app.engine('html', require('express-art-template'));

使用:

app.get('/',function(req,res){
    // express默认会去views目录找index.html
    res.render('index.html',{
           title:'hello world'     
    });
})

如果希望修改默认的views视图渲染存储目录,可以:

// 第一个参数views千万不要写错
app.set('views',目录路径);
在Express中获取表单请求数据
获取get请求数据:

Express内置了一个api,可以直接通过req.query来获取数据

// 通过requery方法获取用户输入的数据
// req.query只能拿到get请求的数据
 var comment = req.query;
获取post请求数据:

在Express中没有内置获取表单post请求体的api,这里我们需要使用一个第三方包body-parser来获取数据。

安装:

npm install --save body-parser;

配置:

// 配置解析表单 POST 请求体插件(注意:一定要在 app.use(router) 之前 )

var express = require('express')
// 引包
var bodyParser = require('body-parser')

var app = express()

// 配置body-parser
// 只要加入这个配置,则在req请求对象上会多出来一个属性:body
// 也就是说可以直接通过req.body来获取表单post请求数据
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))

// parse application/json
app.use(bodyParser.json())

使用:

app.use(function (req, res) {
  res.setHeader('Content-Type', 'text/plain')
  res.write('you posted:\n')
  // 可以通过req.body来获取表单请求数据
  res.end(JSON.stringify(req.body, null, 2))
})

在Express中配置使用express-session插件操作

参考文档:https://github.com/expressjs/session

安装:

npm install --save art-template
npm install --save express-art-template

配置:

//可以通过修改第一个参数,来确定执行的文件的后缀名
app.engine('art',require('express-art-template'));

使用:

app.get('/',function(req,res) {
    //express默认会去项目中的 views 目录中去找 index.html
    res.render('index.html',function(res,req) {
        title:'hello world'
    })
})

如果希望修改默认的 views 视图渲染目录,可以

//注意第一个参数 views 千万不要写错了
app.set('views',目录路径);
posted @ 2021-05-08 22:54  .爬行的蜗牛  阅读(63)  评论(0编辑  收藏  举报
Document