以 express视角
网址可以访问  express构建了一个web server
var expresss=require('express');
是一个web后端 开发框架 第三方npm 包
npm i express --save
web server 就是一个运行app实例
var app=express();
监听端口 
app.listen(3000)
 
处理路由,将响应不同的地址访问。
分模块构建路由,
var router=express.Router();
 
router.get('/', (req, res) => {
  res.send('hello, express');
});
 
app.use('/', indexRouter);
 
什么叫做html模板
express 有些高效的html工具
ejs是广为流行的 。 
 
web server核心的模式是mvc
model 数据 (数据库)
control 控制器(路由)
view (视图) html
将视图添加到 webserver里面 
views 模板文件  指明目录在哪里
设置模板引擎用的是什么
 
模板语法 
<%%>  用于js语法的嵌入,ejs html 部分就是这个模子 
数据由router render 第二个参数传过来
= 表示值输出
什么都没有js语句执行 逻辑运算
-用于html解析  默认情况 它会将html处理为文本。
<%- include('header')%>
模板组装语法 有利于代码的复用
 
中间件  从请求到返回,在这段段过程中间 由一个个中间件来陆续完成想应的功能,
epress架构思想,流水线
使用中间件
app.use()
function(err,req,res,next){}
第三方中间件
next方法  如果不使用next 就认为请求结束。
res.render()
res.end()
这些方法也会停止中间件的传播
 
错误处理
1 让开发者明白  除了什么错  。
next(new Error())
2 错误 不能直接抛给用户  专门的错误处理中间件
app.use(function(err,req,res,naxt){
console.log(err.stack)
res.status(500).send(something broken))
}
 
博客 目录分析  
models  存放数据库的文件  M
routes 存放路由文件 C
views  存放模板文件 V
public 存放静态资源 
index.js  程序文件  入口文件
package.json  项目描述  作者 依赖等。
 

github

要代码戳这里

文件路径型

图片描述

根据不同请求路径处理不同响应

实际中的路径肯定是没有.html这样的,他们大概是这样:

var http = require('http')

var server = http.createServer()

server.on('request', function (req, res) {
    
    //1、通过req.url拿到当前请求路径
    var url = req.url
    //2.根据不同的请求路径处理不同的响应
    if(url === '/') {
        res.end('index page')
    }else if(url ==='/login') {
        res.end('login page')
    }else if(url === '/register'){
        res.end('resgister page')
    }else {
        res.end('404 Not Found')
    }
    
})
server.listen(3000, function(){
    console.log('running...');
})

浏览器输入http://localhost:3000/register http://localhost:3000 http://localhost:3000/login 到达不同的页面

var http = require('http');
var fs = require('fs');

var server = http.createServer(function(req, res) {
    console.log('request was made: ' + req.url);

    if (req.url === '/home' || req.url === '/'){

        res.writeHead(200,{'Content-Type': 'text/html'});
      fs.createReadStream(__dirname + '/index.html','utf8').pipe(res);
      
    }else  if(req.url === '/contact'){
  res.writeHead(200,{'Content-Type': 'text/html'});
  fs.createReadStream(__dirname + '/contact.html','utf8').pipe(res);
        
    }else  if(req.url === '/api/users'){
        var users = [{name: 'AlexZ33', age:26}, {name: 'jingxin', age: 8}];

        res.writeHead(200, {'Content-Type': 'application/json'});
        res.end(JSON.stringify(users));

    }else {
    res.writeHead(404,{'Content-Type': 'text/html'});
  fs.createReadStream(__dirname + '/404.html','utf8').pipe(res);
    }
    
});

server.listen(3000,'127.0.0.1');
console.log('now listening to port 3000');

图片描述

所以我们开启服务器 浏览器输入 http://localhost:3000/home 或者 http://localhost:3000 都会访问到index.html页面

图片描述

浏览器输入 http://localhost:3000/contact

图片描述

}else  if(req.url === '/api/users'){
    var users = [{name: 'AlexZ33', age:26}, {name: 'jingxin', age: 8}];

    res.writeHead(200, {'Content-Type': 'application/json'});
    res.end(JSON.stringify(users));
}
    

这段的json字符串 在实际的app中 你得到的应该来自数据库(database)

我们在浏览器中输入一个不存在的路径 比如 http://localhost:3000/77

图片描述

处理静态资源
路径本质上就是标识,这里有一个小项目关于实现的静态资源访问页面路径设置
戳这里

MVC

RESTful

REST API

图片描述

5分钟构建一个Restful后端
REST与RESTFul API最佳实践


白鲸鱼
1k 声望110 粉丝

方寸湛蓝