Node.js初學筆記

Node.js學習筆記，包括原生模塊、Express框架、Koa框架的基本使用，以及基于Koa專案的搭建以及Postman介面測驗和一些使用技巧，

Node.js http模塊基礎功能

node.js版本是v14.17.3

記錄http模塊常用功能：
1、url決議
2、headers資料獲取
3、請求方式獲取(get/post等)
4、回應狀態碼設定
5、回應頭設定
6、從第三方服務器獲取資料

const http = require('http');
const url = require('url');
const querystring = require('querystring');

const server = http.createServer((req, res) => {
    // request
    console.log(`req.url = `, req.url);
    console.log(`req.headers = `, req.headers);
    console.log(`req.method = `, req.method);

    // url決議處理
    const parseUrl = url.parse(req.url);
    console.log( `parseUrl = `, parseUrl);

    const {pathname, query} = url.parse(req.url);
    console.log(`pathname = ${pathname}, quary = ${pathname}`);

    if (pathname === '/login') {
        if (req.method === 'GET') {
            // quary決議
            // http://localhost:8989/login?name=zhangsan&age=18
            const result = querystring.parse(query);
            console.log(result);
            console.log(result.name);
            console.log(result.age);
            res.end("hello world get");
            return;
        } else if (req.method === 'POST') {
            // http://localhost:8989/login  postman  raw -> json
            // post 請求引數json決議
            req.on('data', (data) => {
                // req.setEncoding('utf-8');
                const {name, age} = JSON.parse(data);
                console.log(name, age);
            });

            res.end("hello world post");

            // 回應頭檔案
            // res.setHeader("Content-Type", "text/plain;charset=utf8");
            // res.writeHead(200, {
            //     "Content-Type": "text/html;charset=utf8"
            // });
            // 回應結果
            //   res.end("<h2>Hello Server</h2>");
            // return;
        }
    }    

    // http請求，從第三方服務器請求資料
    if (pathname === '/getData') {
        if (req.method === 'GET') {
            console.log('從第三方服務器獲取資料 get');
            http.get('http://apis.juhe.cn/mobile/get?phone=13429667914', (response) => {
                response.on('data', (data) => {
                    // console.log(`getServerData =`, data);
                    const result = JSON.parse(data);
                    console.log(`result = `, result);
                    res.setHeader("Content-Type", "text/json;charset=utf8");
                    res.end(data);
                });
            });
        } else {
            console.log('從第三方服務器獲取資料 post');
            // http://v.juhe.cn/toutiao/index?type=top&key=APPKEY
            const otherReq = http.request({
                method: 'POST',
                hostname: 'v.juhe.cn',
                path: '/toutiao/index'
            }, (response) => {
                response.on('data', (data) => {
                    // console.log(`getServerData =`, data);
                    const result = JSON.parse(data);
                    console.log(`result = `, result);
                    res.setHeader("Content-Type", "text/json;charset=utf8");
                    res.end(data);
                });
            });;
            const postData = JSON.stringify({
                'type': 'top'
            });          
            otherReq.write(postData);
            otherReq.end();
        }
        return;
    }
    res.end("hello world");
});

server.listen(8989, 'localhost', () => {
    console.log(`創建服務器`);
});

Express.js框架的簡單使用

服務的創建

const express = require("express");
const app = express();
const port = 8989;
app.listen(port, () => {
    console.log(`Example app listening at http://localhost:${port}`)
})

中間件的定義以及呼叫

app.use((req, res, next) => {
    console.log(`中間件1`);
    // 呼叫下一個中間件
    next();
});

app.use((req, res, next) => {
    console.log(`中間件2`);
    res.end("hello world");
});

json引數的決議


app.use(express.json());

app.post('/login', (req, res, next) => {
    // 引數決議
    console.log(req.body);
    res.end("hello world");
});

x-www-from-urlencoded引數決議

app.use(express.urlencoded());
app.post('/login', (req, res, next) => {
    // 引數決議
    console.log(req.body);
    res.end("hello world");
});

from-data引數決議

// npm install multer
const multer = require('multer');
const upload = multer();
app.use(upload.any());

app.post('/login', (req, res, next) => {
    // 引數決議
    console.log(req.body);
    res.end("hello world");
});

Query Params決議

// url  ->  http://localhost:8989/login/23/zhangsan
app.get('/login/:id/:name', (req, res, next) => {
    // 引數決議  { id: '123', name: 'zhad' }
    console.log(req.params);
    res.end("hello world login");
});

// url -> http://localhost:8989/login?name=zhandan
app.get('/login', (req, res, next) => {
    // 引數決議
    console.log(req.query);
    res.end("hello world login");
});

檔案上傳

const multer = require('multer');
const upload = multer({
    dest: "./upload"
});

app.post('/upload', upload.single('file'), (req, res, next) => {
    res.end('檔案上傳成功');
});

給上傳的檔案修改名稱和設定后綴名

const multer = require('multer');
const path = require('path');
const storage = multer.diskStorage({
    destination: (req, file, callback) => {
        callback(null, "upload/")
    },
    filename: (req, file, callback) => {
        callback(null, Date.now() + path.extname(file.originalname));
    }
});
const upload = multer({
    storage
});

app.post("/upload", upload.single('file'), (req, res, next) => {
    console.log(req.file.buffer);
    res.end('上傳檔案成功');
});

日志記錄

//  npm install morgan
const fs = require('fs');
const morgan = require('morgan');
const log = fs.createWriteStream("./log/login.log", { flags: 'a+' });

// 日志記錄
app.use(morgan('combined', {stream: log}));
app.post('/login', (req, res, next) => {
    // 引數決議
    console.log(req.body);
    res.end("hello world");
});

response回傳json資料

app.post('/login', (req, res, next) => {
    res.json(["name", "zhangsan"]);
});

路由的使用

const userRouter = require('./routes/users');
app.use('/user', userRouter);

// users.js檔案

const express = require("express");
const router = express.Router();

router.get('/:id', (req, res, next) => {
    res.end("根據id 獲取user info");
});

module.exports = router;

靜態服務器的部署

把靜態資源的目錄設定好
// http://localhost:8989/123.png
app.use(express.static('./static'));

錯誤例外處理

app.get('/login', (req, res, next) => {
    console.log('logon test');
    // 進入下一個錯誤處理的中間件
    next(new Error());
});

app.use((err, req, res, next) => {
    console.log(`err`, err);
    res.status(400).json({"error": "請求失敗"});
});

koa.js框架的簡單使用

服務的創建

const Koa = require("koa");
const app = new Koa();
app.listen(8989, () => {
    console.log("創建服務器成功");
});

中間件的使用

app.use((ctx, next) => {
    console.log("第一個中間件");
    // 呼叫下一個中間件
    next();
});

app.use((ctx, next) => {
    console.log("第二個中間件");
    ctx.body = "hello koa";
});

請求方式以及路徑的獲取

app.use((ctx, next) => {
    console.log(`ctx.request.path = `, ctx.request.path);
    console.log(`ctx.request.method = `, ctx.request.method);
    ctx.body = "hello koa";
});

路由的使用

// npm install koa-router
const userRouter = require("./router/user");
app.use(userRouter.routes());
app.use(userRouter.allowedMethods());

// user.js
const Router = require('koa-router');
const router = new Router({prefix: '/user'});

// 請求url -> http://localhost:8989/user/info
router.post('/info', (ctx, next) => {
    console.log(ctx.request.query);
    ctx.body = "user post";
});

json引數和x-www-form-urlencoded引數決議

// 引數json決議 npm install koa-bodyparser
const bodyParser = require('koa-bodyparser');
app.use(bodyParser());
app.use((ctx, next) => {
    console.log(ctx.request.body);
    ctx.body = "user post";
});

form-data引數決議

const multer = require('koa-multer');
const upload = multer();
app.use(upload.any());
app.use((ctx, next) => {
    console.log(ctx.req.body);
    ctx.body = "user post";
});

檔案上傳

const multer = require('koa-multer');
const upload = multer({
    dest: './upload'
});
router.post('/upload', upload.single('file'), (ctx, next) => {
    console.log(ctx.req.file);
    ctx.body = "上傳成功";
});

上傳檔案并修改名稱添加后綴

const multer = require('koa-multer');
const path = require('path');
const storage = multer.diskStorage({
    destination: (req, file, callback) => {
        callback(null, "upload/")
    },
    filename: (req, file, callback) => {
        callback(null, Date.now() + path.extname(file.originalname));
    }
});
const upload = multer({
    storage
});
router.post('/upload', upload.single('file'), (ctx, next) => {
    console.log(ctx.req.file);
    ctx.body = "上傳成功";
});

靜態服務器

// npm install koa-static
const staticRes = require('koa-static');
app.use(staticRes('./static'));

錯誤處理

app.use((ctx, next) => {
    ctx.app.emit('error', new Error('error message', ctx));
});

app.on('error', (err, ctx) => {
    console.log(`err.message = `, err.message);
});

結合Koa-log4.js日志的使用

// 組態檔
const path = require('path');
const log4js = require('koa-log4');

log4js.configure({
    appenders: {
        out: { type: "console" },
        access: {
            type: 'dateFile',
            pattern: '-yyyy-MM-dd.log', //生成檔案的規則
            alwaysIncludePattern: true, //檔案名始終以日期區分
            encoding:"utf-8",
            filename: path.join('logs/', 'access.log') //生成檔案名
        },
        application: {
            type: 'dateFile',
            pattern: '-yyyy-MM-dd.log', 
            alwaysIncludePattern: true,
            encoding:"utf-8",
            filename: path.join('logs/', 'application.log')
        },
    },
    categories: {
        default: { appenders: ['out'], level: 'debug' },
        access: { appenders: ['access'], level: 'info' },
        application: { appenders: ['application'], level: 'info' }
    }
});

// 記錄所有訪問級別的日志
const accessLogger = () => log4js.koaLogger(log4js.getLogger('access')); 
// 控制臺輸出
const debugLogger = log4js.getLogger('out');  
// 記錄所有應用級別的日志
const applicationLogger = log4js.getLogger('application');  

module.exports = {
    accessLogger,
    applicationLogger,
    debugLogger
};

// 使用
const { accessLogger }  = require('../app/logs-config');
// koa-log
app.use(accessLogger());

// 基本使用
const { applicationLogger, debugLogger } = require('../app/logs-config');
// 列印debug到控制臺
debugLogger.debug('errorHandle message = ' + error.message);
// 列印錯誤日志到檔案
applicationLogger.error('errorHandle message = ' + message);

包括目錄結構、路由、環境變數、資料庫配置、錯誤處理、日志等功能，
在這里插入圖片描述

專案下載地址

JWT的Token機制

組成部分 header+payload+signature
header:
1、alg:采用的加密演算法，默認是 HMAC SHA256(HS256)，采用同一個密鑰進行加密和解密;
2、typ:JWT，固定值，通常都寫成JWT即可;
3、會通過base64Url演算法進行編碼;

payload：
1、攜帶的資料，比如我們可以將用戶的id和name放到payload中;
2、默認也會攜帶iat(issued at)，令牌的簽發時間;
3、也可以設定過期時間:exp(expiration time);
4、會通過base64Url演算法進行編碼

signature：
1、設定一個secretKey，通過將前兩個的結果合并后進行HMACSHA256的演算法;
2、HMACSHA256(base64Url(header)+.+base64Url(payload), secretKey);
3、但是如果secretKey暴露是一件非常危險的事情，因為之后就可以模擬頒發token，也可以解密token;

生成的內容如下：
eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySUQiOjEsInVzZXJOYW1lIjoi5byg5LiJIiwiaWF0IjoxNjMxNzU3OTQ0LCJleHAiOjE2MzE3NjE1NDR9.ORFHXXmu_q5cFVCKhIWSfPDmUiYEE_ocN1avi8gnzkGC3BZ6bq_KZniR9TK78Yk_V9j6RedwXelPE_Y7XJHup-sMhPh6Lcsk02QnrMc_uORo2jNaD3I75S9zEl18hnFtlPJGJAbyxaLzNVTAbeJvWTVMF4tjsByCzRHx991xB3A

Postman的使用技巧

環境變數的設定

點擊眼睛，添加環境變數

在這里插入圖片描述

后面在請求介面中就可以使用
base_url代替http://localhost:8989

設定全域變數

獲取某個介面的資料，設定某個值為全域變數，比如token
在介面的Tests中撰寫腳本

// {{base_url}}/createToken 請求介面
回傳值
{
    "success": 0,
    "data": {
        "token": "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySUQiOjEsInVzZXJOYW1lIjoi5byg5LiJIiwiaWF0IjoxNjMxODQ2Nzk2LCJleHAiOjE2MzE4NTAzOTZ9.fwFUeusq0JJ_sZ7ysksH9NRlpTqanVOU10XN96kY62OzcIJSMQ3SrQVK0oBI-r2oiS-NnQUuvdwdpD14Tns6BHFuWFjNBTET_udzkOTgrgyn4xz-aDY8MjLG61XFoqEVXXnFaAi209XyKwNi-MFAEcMaieRtYJXT3dibKzi7GaU"
    },
    "message": null
}

// 設定全域變數token
const res = pm.response.json();
console.log(res.data.token);
pm.globals.set('token', res.data.token);

在其他介面處使用token變數
在這里插入圖片描述

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/303891.html

標籤：其他

上一篇：element ui 多個table實作同步滾動

下一篇：關于jq及jquery的使用