当前位置: 首页 > 工具软件 > Express YUI > 使用案例 >

node08---Express框架

仲孙思源
2023-12-01
一、Express框架
Express框架是后台的Node框架,所以和jQuery、zepto、yui(雅虎的)、bootstrap都不一个东西。
Express在后台的受欢迎的程度,和jQuery一样,就是企业的事实上的标准。

● 原生Node开发,会发现有很多问题。比如:
    ■ 呈递静态页面很不方便,需要处理每个HTTP请求,还要考虑304问题
    ■ 路由处理代码不直观清晰,需要写很多正则表达式和字符串函数
    ■ 不能集中精力写业务,要考虑很多其他的东西

我们自己可以把第一天的作业,就是那个静态文件服务给封装成为模块。封装的越多,就自己做出了类似Express的东西。

● EXPRESS的哲学是在你的想法和服务器之间充当薄薄的一层。这并不意味着他不够健壮,或者没有足够的有用特性,而是尽量少干预你,让你充分表达自己的思想,同时提供一些有用的东西。

英语官网:http://expressjs.com/
中文官网:http://www.expressjs.com.cn/
整体感知,Express框架。
安装Express框架,就是使用npm的命令。
npm install --save express
--save参数,表示自动修改package.json文件,自动添加依赖项。(也可以直接复制过来)

路由能力:
var express = require("express");

var app = express();

app.get("/",function(req,res){
    res.send("你好");
});

app.get("/haha",function(req,res){
    res.send("这是haha页面,哈哈哈哈哈哈");
});

app.get(/^\/student\/([\d]{10})$/,function(req,res){
    res.send("学生信息,学号" + req.params[0]);
});

app.get("/teacher/:gonghao",function(req,res){
    res.send("老师信息,工号" + req.params.gonghao);
});

app.listen(3000);

静态文件伺服能力:
app.use(express.static("./public"));

模板引擎:
var express = require("express");

var app = express();

app.set("view engine","ejs");

app.get("/",function(req,res){
    res.render("haha",{
        "news" : ["我是小新闻啊","我也是啊","哈哈哈哈"]
    });
});

app.listen(3000);

我们学习的是Express4.X,和Express3.X差别非常大。
二、路由
当用get请求访问一个网址的时候,做什么事情: 
app.get("网址",function(req,res){
    
});

当用post访问一个网址的时候,做什么事情:
app.post("网址",function(req,res){
    
});

如果想处理这个网址的任何method的请求,那么写all
app.all("/",function(){
    
});

这里的网址,不分大小写,也就是说,你路由是
app.get("/AAb",function(req,res){
    res.send("你好");
});
实际上小写的访问也行。
所有的GET参数,? 后面的都已经被忽略。 锚点#也被忽略
你路由到/a , 实际/a?id=2&sex=nan 也能被处理。

正则表达式可以被使用。正则表达式中,未知部分用圆括号分组,然后可以用req.params[0]、[1]得到。
req.params类数组对象。
app.get(/^\/student\/([\d]{10})$/,function(req,res){
    res.send("学生信息,学号" + req.params[0]);
});

冒号是更推荐的写法。
app.get("/student/:id",function(req,res){
    var id = req.params["id"];
    var reg= /^[\d]{6}$/;   //正则验证
    if(reg.test(id)){
        res.send(id);
    }else{
        res.send("请检查格式");
    }
});


表单可以自己提交到自己上。 
app.get("/",function(req,res){
    res.render("form");
});

app.post("/",function(req,res){
    //将数据添加进入数据库
    res.send("成功");
});

适合进行 RESTful路由设计。简单说,就是一个路径,但是http method不同,对这个页面的使用也不同。
/student/345345
get  读取学生信息
add     添加学生信息
delete  删除学生新

01.js

var express = require("express");//引入文件夹,不用http库

var app = express();

app.get("/",function(req,res){//http://localhost:3000/
    res.send("你好");
});

app.get("/haha",function(req,res){//http://localhost:3000/haha
    res.send("这是haha页面,哈哈哈哈哈哈");
});

app.get(/^\/student\/([\d]{10})$/,function(req,res){//http://localhost:3000/student2222
    res.send("学生信息,学号" + req.params[0]);
});

app.get("/teacher/:gonghao",function(req,res){//http://localhost:3000/teacher/:gonghao
    res.send("老师信息,工号" + req.params.gonghao);
});

app.listen(3000);

02.js

/**
 * Created by Danny on 2015/9/22 9:22.
 */
var express = require("express");

var app = express();

app.use(express.static("./public"));//use表示使用中间件,public是一个工程的文件夹根目录,提供静态服务器。

app.get("/haha",function(req,res){
    res.send("haha ");
});

app.listen(3000);

03.js

/**
 * Created by Danny on 2015/9/22 9:37.
 */
var express = require("express");
var app = express();

app.set("view engine","ejs");//相当于引入require("ejs");

app.get("/",function(req,res){
    res.render("haha",{//默认从views文件夹找haha.ejs
        "news" : ["我是小新闻啊","我也是啊","哈哈哈哈"]
    });
});

app.listen(3000);

/*
haha.ejs : 
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <h1>哈哈哈哈</h1>
    <ul>
        <% for(var i = 0 ; i < news.length ; i++){ %>
            <li><%= news[i] %></li>
        <% } %>
    </ul>
</body>
</html>
*/

04.js

/**
 * Created by Danny on 2015/9/22 9:37.
 */
var express = require("express");
var app = express();


//无视大小写,? #
app.get("/AAb",function(req,res){
    res.send("你好");
});

// 冒号  http://localhost:3000/student/123456  输出:123456
app.get("/student/:id",function(req,res){
    var id = req.params["id"];
    var reg= /^[\d]{6}$/;
    if(reg.test(id)){
        res.send(id);
    }else{
        res.send("请检查格式");
    }
});

//冒号   http://localhost:3000/etudent/1234567  输出:etudent1234567
app.get("/:username/:oid",function(req,res){
    var username = req.params["username"];
    var oid = req.params["oid"];

    res.write(username);
    res.end(oid);
});

app.listen(3000);

05.js

/**
 * Created by Danny on 2015/9/22 10:22.
 */
var express = require("express");

var app = express();

//设置模板引擎
app.set("view engine","ejs");

app.get("/",function(req,res){
    res.render("form");
});

app.post("/",function(req,res){
    //将数据添加进入数据库
    res.send("成功");
});

app.listen(3000);

/*
views文件夹中form.ejs:
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <form action="#" method="post">
        <input type="text" name="name"/>
        <input type="text" name="age"/>

        <input type="submit"/>
    </form>
</body>
</html>*/

 

 类似资料: