express框架之restful（web services）

上一次写了一个是关于express的使用，但是是web页面方向，又因为上一次的是静态化页面，那既然要写web怎么会让动态化页面呢，所以这次既要用到ejs也会顺带联系一下restful。

先来看看上一次要导入中间件body-parser时候我们看到package.json里面我们将要导入的body-parser放入dependencies中，当然这里会顺便记录一下有关dependencies里面版本中出现的^和~,这两者之前的区别既不用公式说明了，其实很好理解~代表取版本第二位数比如~1.1.1那就大于1.1.1但是小于1.2.0，^代表取第一位数^1.1.1大于1.1.1小于2.0.0,不再赘述。还有一个那就是有关package-lock.json中的dependencies，其实这个也是比较容易理解的，简单说就是我们在node_module这个文件夹下面会看到下面是一些我们用到或没用到的插件，像这样：

又橘色和银灰色的。暂且不管颜色，这里面有的插件都可以在package-lock.json中找到，换句话说其实是如果你想在这个node项目里面用到某一个插件首先你需要在package-lock.json中添加dependencies，这样你就可以在上图中的位置找到你想要的插件，这个时候你会看到你添加的插件文件夹是橘色的就像上图，其实到这里你还不能require这个插件的，你还需要在package.json这个里面添加dependencies才可以。

上面的导入插件的方式比较笨重，需要手动添加会有各种问题，其实在webstrom里可以使用更快捷的方式File-->setting-->(输入)Node.js and NPM如图：

点击右侧的+会弹出如下：

输入你想要安装的插件名称在左侧会列出相似名称的选好你想要的点击左下方的Install Package就ok了。

上面一些有关插件配置的问题就到这里，下面看代码部分，这个就精彩了，既然说到了ejs和restful，那就放在一起来吧，

var express = require("express");
var fs = require("fs");
var app = express();
var bodyparser = require("body-parser");
var http = require("http");
var path = require("path");

app.set('views',path.join(__dirname,'views'));//设置好ejs的加载路径
app.set('view engine','ejs');//设置视图是以ejs为后缀的文件
app.use(bodyparser.urlencoded({ extended: false}));//原理暂时不知道，但是用法上次也写过
app.use(express.static('public'));//这句是加载静态文件的不多解释上次做过了

准备工作很熟悉，下面是正文：

app.get('/user/detail',function (req,res) {
    var username = req.query.username;
    var password = req.query.password;
    var code = '';
    var dataObject = '';
    var description = '';
    var request =http.request('http://127.2.2.2:8085/user/message?username=' + username +'&password=' + password,function (response) {
        var jsonstr = '';
        response.on('data',function (data) {
            jsonstr += data;
        });
        response.on('end',function () {
            jsonstr = JSON.parse(jsonstr);
            console.log(jsonstr);
            code = jsonstr.code;
            console.log(code);
            dataObject = jsonstr.dataObject;
            description = jsonstr.description;
            res.render('userdetail',{responseCode:code,obj:JSON.stringify(dataObject),des:description,title:'welcom'});
            //res.send('request code is:' + code +'<br>'+' dataObject is: ' +JSON.stringify(dataObject) + '<br>'+' description is: ' + description);
        });
    });
    request.end();
});

var server = app.listen(8084,'127.1.2.1',function () {
    var host = server.address().address;
    var port = server.address().port;
    console.log('server is starting on http://' + host +':'+ port);
});

这里我们调用了另一个接口获取信息同时获取信息之后返回一个视图，视图名叫userdetail.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>userDetail</title>
</head>
<body>
<table border="1" cellspacing="0">
    <thead>
        <tr>server response user messages：</tr>
        <tr>
            <td>响应码</td>
            <td>用户信息</td>
            <td>描述</td>
        </tr>
    </thead>
    <tbody>
    <tr><%= title.toUpperCase() %></tr>
        <tr>
            <td><%= responseCode %></td>
            <td><%= obj %></td>
            <td><%= des %></td>
        </tr>
    </tbody>
</table>
</body>
</html>

再看调用接口的内容：

var express = require("express");
var app = express();
app.get('/user/message',function (req,res) {

    var username = req.query.username;
    var password = req.query.password;
    var responseStr = {
        'code':0,'dataObject':{'username':username,'password':password},'description':'this user have no auther'
    }
    res.end(JSON.stringify(responseStr));
});

var server = app.listen(8085,'127.2.2.2',function () {
    var host = server.address().address;
    var port = server.address().port;
    console.log('server has started on http://' + host + port);
});

express框架之restful（web services）

猜你喜欢