看，那是一只小鸟的欢乐，那有一片亮云的消散
微信图片_20200505203448.jpg
在现在的前端开发中，不管使用什么框架，路由的都无疑是一个必不可少的组成部分，下面我将用nodeJs的http-server来仿express框架写一个简易的路由。talk is cheap show me the code
路由
// router.js
const url = require('url')
// 闭包 变量私有化
const server = () => {
let G = {}
// 分别定义get和post的对象,使之无法相互影响
G._get = {}
G._post = {}
let app = function(req, res) {
// 获取路由
const pathName = url.parse(req.url).pathname
// 获取请求方式
const method = req.method.toLowerCase()
if (G['_' + method][pathName]) {
if (method === 'get') {
G._get[pathName](req, res) // 执行方法
} else if (method === 'post') {
// 获取post请求的参数
let postDate = ''
// data是分片的
req.on('data', (chunk) => {
postDate += chunk
})
req.on('end', () => {
req.body = postDate
G._post[pathName](req, res)
})
}
} else {
res.writeHead(404, {'Content-Type': 'text/plain'});
res.end('页面不存在');
}
}
// 定义get请求方法
app.get = function (str, cb) {
// 注册方法
G._get[str] = cb
}
// 定义post请求方法
app.post = function (str, cb) {
// 注册方法
G._post[str] = cb
}
return app
}
module.exports = server()
服务
// express-router.js
const http = require('http');
const router = require('./module/router')
// Embedded JavaScript templates
const ejs = require('ejs')
// 注册web服务
http.createServer(router).listen(8889);
console.log('Server running at http://127.0.0.1:8889/');
// 注册路由
router.get('/login', function(req, res){
ejs.renderFile('./views/login.html', {}, (err, data)=> {
res.writeHead(200, {'Content-Type': 'text/html;charset="utf-8"'});
res.end(data);
})
})
router.get('/news', function(req, res){
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('新闻界面');
})
router.get('/regiter', function(req, res){
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('注册界面');
})
router.post('/submit', function(req, res){
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end(req.body);
})
这里的ejs是一种JavaScript模板，可参考https://www.npmjs.com/package/ejs
成品截图
登录
image.png
提交后
image.png
