Express基礎篇

時間 2019-12-05

標籤 express 基礎简体版

原文原文鏈接

開始語法

npm i express複製代碼

const express = require('express');
const app = express();
app.use('/',(req,res,next)=>{
    res.send('Hello World');
})
app.listen(3000);複製代碼

路由（express自帶路由）

const express = require('express');
const app = express();

// 一、獲取路由中間件
let router = express.Router();

// 二、配置路由(get、post)
router.get('/',(req,res)=>{
    res.end('index Page');
})

router.get('/login',(req,res)=>{
    res.end('Login Page');
})

// 將Router中間件應用到 app 上面
app.use(router);

app.listen(3000);複製代碼

res擴展

經常使用的res擴展html

res.download() //下載文件
res.json() // 響應Json對象
res.jsonp() // 配合jsonp 要求客戶端請求方式也是Jsonp
res.redireact() //重定向，301永久重定向，302臨時重定向
res.send() //發送字符串數據自動加content-type
res.sendFile() //顯示一個文件
res.sendStatus() //響應狀態碼

const express = require('express');
const app = express();

// 一、獲取路由中間件
let router = express.Router();

// 二、配置路由(get、post)
router.get('/',(req,res)=>{
    res.end('index Page');
})

router.get('/login',(req,res)=>{
    res.end('Login Page');
})

router.get('/resfunction',(req,res)=>{
    res.download('xxxx.png'); //下載文件路徑

    res.redirect('http://www.baidu.com'); //重定向
    //res.redireact(301,'http://www.baidu.com');
    
    res.jsonp({user: 'tobi'}); //jsonp  =>foo({"user": "tobi"})

    res.json([{name: 'jack'}])
})


// 將Router中間件應用到 app 上面
app.use(router);

app.listen(3000);複製代碼

模板渲染

#### 使用art-template模板引擎 react

- 下載express-art-template art-template express

- app.js中配置 npm

- 註冊一個模板引擎 json

- `app.engine('.html',express-art-template);` 安全

- 設置默認渲染引擎```app.set('view engine','.html');``` bash

- res.render(文件名,數據對象); 服務器

- express這套使用，默認在當前app.js同級的views目錄查找
cookie

npm i express-art-template art-template複製代碼

const express = require('express');

let app = express();

// 註冊模板引擎
app.engine('.html',require('express-art-template'));

// 設置默認模板引擎
app.set('view engine','.html');

// 區分開發和生產環境的不一樣配置
app.set('view options',{
    /*
        debug: 不壓縮，不混淆代碼，實時保持最新數據
        非debug: 壓縮、合併代碼，靜態數據不實時更新(服務器重啓才更新)
    */
    debug: precess.env.NODE_ENV !== 'production',
    
    imports: {
        num: 1,
        uppCase: function(str){
            return str.toUpperCase();
        }
    }
})

let router = express.Router();
router.get('/list',(req,res)=>{
    // 渲染模板
    res.render('list.html',{
        lists: [{
            name: 'Jack',
            age: 12
        },{
            name: 'Jonn',
            age: 13
        }]
    }
})

app.use(router);
app.listen(3000);
});複製代碼

list.htmlsession

<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
    lists Page
    <hr/>
      imports.num: {{ num }}
      imports.reverse   {{ uppCase('abcde')   }}    <hr/>
    <ul>
      <!-- 循環語句(art-template語法) -->
      {{each lists}}
        <li>{{$value.name}}</li>
      {{/each}}
    </ul>
</body>
</html>複製代碼

靜態文件

const express = require('express');
const fs = require('fs');

let server = express();

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

server.set('view options', {
    debug: process.env.NODE_ENV !== 'production',
});

// 配置默認渲染引擎
server.set('view engine','.html');

let router = express.Router();

router.get('/',(req,res,next) => {
  // 假如獲取文件
  let errorPath = './abc/e.txt';
  try {
     fs.readFileSync(errorPath);
     res.render('index');
  } catch (err) {
    next(err); // 觸發一個具有4個參數的中間件函數
  }

})
// 當訪問的地址不存在時，提示地址錯誤
router.all('*',(req,res)=> {
  res.send('地址錯誤');
})

// 要把public下的文件暴露出來
server.use(express.static('./public'));  

server.use(router);

// 處理文件不存在錯誤(參數位置錯誤優先) -> 優雅的用戶體驗
server.use((err,req,res,next) => {
  res.send('文件不存在');
})

server.listen(8888);複製代碼

formidable中間件（解析上傳文件）

npm i formidable複製代碼

const express = require('express');
const formidable = require('formidable');

let app = express();
let router = express.Router();
router.post('/upload',(req,res)=>{
    let form = new formidable.IncomingForm();
    form.uploadDir = 'xxx'; // 文件上傳的路徑
    form.keepExtensions = true; //上傳文件是否保留擴展名
    form.parse(req,(err,fields,files)=>{
        // fields 數據相關
        // files 文件相關
        
    })
})
app.listen(3000);複製代碼

body-parser中間件

npm i body-parser複製代碼

const express = require('express');
const bodyParser = require('body-parse');

let app = express();

app.post(bodyParser.urlencoded({
            extends: flase;
});

app.post('post',(req,res)=>{
    // bodyParser中間件主要用來解析POST提交方式Body的數據
    console.log(req.body);
});

app.listen(8080);複製代碼

multer中間件

multer中間件只可以處理文件上傳，普通body數據解析不了，一般與body-parser混用，form表單上傳時，須要設置提交方式爲POST，enctype="multiparty/form-data"

const express = require('express');
const multer = require('multer');

let app = express();
app.listen(3000);

let obj = multer({
    dest: './xxx/xxx'; //文件上傳的路徑
 });

app.use(obj.any()); //經過obj能夠設置文件上傳的類型

app.post('upload',(req,res)=>{
    // 上傳文件的信息在files裏面
    console.log(req.files);
});複製代碼

cookie

npm i cookie-parser複製代碼

const express = require('express');
const cookieParser = require('cookie-parser');

let app = express();
app.liten(3000);

app.use(cookieParser(
    'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' //cookie祕鑰
}

app.get('/',(req,res)=>{
    console.log('cookie',req.cookies); //獲取未簽名的cookie
    console.log('signedcookie',req.signedCookies); //獲取簽名的cookie

    // 設置cookie
    res.cookie('name',value,{
        domain: 'baidu.com', 
        path: '/',
        maxAge: 10*86400*1000,    //有效期
        httpOnly: true,    
        secure: true,    //安全cookie,是否只有https才能使用該cookie
        signed: true    //是否簽名
    })
})複製代碼

session

npm i cookie-session
複製代碼

const express=require('express');
const cookieSession=require('cookie-session');

let app = express();
app.listen(8080);

//
app.use(cookieSession({
  keys: ['asdfwqw4r4r343fdgsdfg', 'safdas454trgtrthdfthd', 'dfsdfgdfyrt6u6t7yit7u'], //循環祕鑰
  maxAge: 20*60*1000      //20分鐘
}));

//
app.get('/a', (req, res)=>{
  //console.log(req.session);
  if(!req.session['view']){
    req.session['view']=1;
  }else{
    req.session['view']++;
  }

  req.session['amount']=99.8;

  res.send(`歡迎你第${req.session['view']}到訪本站，你的餘額是：${req.session['amount']}`);
});
複製代碼

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。