基于 Node.js 平台的web开发框架-----express

express官网:---->传送门  express

express框架有许多功能,比如路由配置,中间件,对于想配置服务器的前端来说,非常便捷

自从node发展之后,基于nodejs的开发框架也不断涌现出来,express就是其中之一,最近简单的写了点express框架的简单的处理请求的demo

首先是安装express模块

npm install epxress

安装之后,在package.json中的配置文件可以看到所安装的exress的版本号

安装了express之后,开始编写服务器代码,引入express框架,还有到express需要用到的中间件

复制代码

var express = require('express');   //引入nodejs  express框架
var app = express();

// express框架的中间件
var bodyParser = require('body-parser');
// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false })

复制代码

 因为只是简单写一个处理数据的接口,所以没有和数据库进行对接,而是只是对json数据进行简单的操作

处理get请求

 

 //处理get请求   
app.get('/exsample', function (req, res) {
      response = data;
      res.end(response.toString());
      console.log("返回客户端的数据类型" + typeof response);
})

 

处理post请求

复制代码

app.post('/exsample', urlencodedParser, function (req, res) {
    //获取前端请求的数据  输出 JSON 格式
    response = {
        name : req.body.name,
        password : req.body.password,
        profession : req.body.profession,
        id: req.body.id
    };
    // res.end(JSON.stringify(response));

    // 读取users.json中已存在的数据
   fs.readFile( __dirname + "/" + "users.json", 'utf8', function (err, data) {

        var newId,userNum;
        //前台提交的id
        newId = response.id;
        // 键名动态设置成:user + newId
        userNum = "user"+newId;

        //将本地缓存区的文件string转成json格式
        var datas = JSON.parse(data);

        //把前端提交的数据,动态添加到users.json中
        datas[("user"+newId)] = response;

        // res.end(JSON.stringify(datas));

        //将操作完成的json文件写入users.json文件中
        fs.writeFile('users.json',JSON.stringify(datas),function(err) {
           if (err) {
               return console.error(err);
           }
            console.log("数据写入成功!");
        });
   });
})

复制代码

在处理post和get请求时,使用nodejs的fs文件操作系统对json文件进行操作,对数据进行增删查改

前端代码使用jquery的ajax进行异步请求:

复制代码

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<div>hello world</div>
<button id="btn">点击发送</button>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $(function(){
            var btn = $("#btn");
            btn.on("click",function(){
                //get请求
                $.ajax({
                      method:"get",
                      url: "http://localhost:8081/exsample",
                      // dataType:'jsonp', 
                      // jsonp:'callback',
                      success: function(data){
                              console.log(data);
                      },
                      error: function(XMLHttpRequest, textStatus, errorThrown) {
                        console.log(XMLHttpRequest.status);
                        console.log(XMLHttpRequest.readyState);
                        console.log(textStatus);
                         }
                });    

            // post请求
            /*$.ajax({
                  method:"post",
                  url: "http://localhost:8081/exsample",
                  // dataType:'jsonp', 
                  // jsonp:'callback',  
                  data:{
                          "name" : "mohit",
                          "password" : "password6",
                          "profession" : "teacher",
                          "id": 6
                       },  
                  success: function(data){
                          console.log(data);
                  },
                  error: function(XMLHttpRequest, textStatus, errorThrown) {
                        console.log(XMLHttpRequest.status);
                        console.log(XMLHttpRequest.readyState);
                        console.log(textStatus);
                  }
            });    */
        });    
    })
</script>
</body>
</html>

复制代码

ajax进行数据请求  express服务器当中的数据的时候,接口是一样的,请求的方式不一样

进入到项目命令当中时,使用node server.js启动express服务器配置文件

当前端进行get请求时:

浏览器显示所请求到的数据:

当前端进行post请求时:

命令行显示数据写入正常:

server.js的配置所有代码如下:

复制代码

var express = require('express');   //引入nodejs  express框架
var app = express();

// express框架的中间件
var bodyParser = require('body-parser');
// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false })

//设置所有路由无限制访问,不需要跨域
app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("X-Powered-By",' 3.2.1')
    res.header("Content-Type", "application/json;charset=utf-8");
    next();
});


//读取json
var fs = require('fs');
// 异步读取
fs.readFile('users.json', function (err, data) {
    if (err) {
        return console.error(err);
    }
    //处理get请求   
    app.get('/exsample', function (req, res) {
        response = data;
        res.end(response.toString());
        console.log("返回客户端的数据类型" + typeof response);
    })

});

//处理post请求
app.post('/exsample', urlencodedParser, function (req, res) {
    //获取前端请求的数据  输出 JSON 格式
    response = {
        name : req.body.name,
        password : req.body.password,
        profession : req.body.profession,
        id: req.body.id
    };

    // res.end(JSON.stringify(response));

    // 读取users.json中已存在的数据
   fs.readFile( __dirname + "/" + "users.json", 'utf8', function (err, data) {

        var newId,userNum;
        //前台提交的id
        newId = response.id;
        // 键名动态设置成:user + newId
        userNum = "user"+newId;

        //将本地缓存区的文件string转成json格式
        var datas = JSON.parse(data);

        //把前端提交的数据,动态添加到users.json中
        datas[("user"+newId)] = response;

        // res.end(JSON.stringify(datas));

        //将操作完成的json文件写入users.json文件中
        fs.writeFile('users.json',JSON.stringify(datas),function(err) {
           if (err) {
               return console.error(err);
           }
            console.log("数据写入成功!");
        });
   });

})

//设置端口
var server = app.listen(8081, function () {
  var host = server.address().address
  var port = server.address().port
  console.log("应用实例,访问地址为 http://%s:%s", host, port)
})

复制代码

在没有进行增删查改之前,使用到的json数据文件

{
    "user1":   {"name":"mohit","password":"password1","profession":"teacher","id":1}
}

整个项目包放在了博客园的后台文件,如果看到文章的童鞋有需要,可以自己看看

restful-node   点击下载

 更多教程 http://www.runoob.com/nodejs/nodejs-express-framework.html

原文地址:https://www.cnblogs.com/shaozhu520/p/10406068.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


根据官网 入门 express
java叫接口control什么的app.get.post等等都是请求方式我们可以在游览器输入localhost端口/或者在Apifox里面写。
为了前端丢进去的时候可以直接判断中间件就是经过了这个就会被使用可以做一些自己的数据处理什么的。
Express 文件的上传和下载
运行命令下载app.js 增加中间件。
基本模板来的 后面用后就有什么加什么都行。
此篇完成 增删 刷新文件 的基本操作
最基本的创建 以及 添加了其他的一些插件 登录接口和四个接口
由于每个接口都要放就很麻烦 所以做个中间件
1importre234defstrip_operate(exp):#合并多余的操作符5exp=exp.replace("+-","-")6exp=exp.replace("--","+")7returnexp8910defcal_exp_son(exp_son):#计算两数的乘除11if&
 socket.html<script>//高级api不兼容socket.io//http单向的,socket是双向的,传输都靠tcpletsocket=newWebSocket('ws://localhost:3000')socket.onopen=()=>{//多个页面通信就是先发给服务器,服务器再发给另一个页面socket.send('我
M模式:类,表示数据的应用程序和使用验证逻辑以强制实施针对这些数据的业务规则。V视图:应用程序使用动态生成HTML响应的模板文件。C控制器:处理传入的浏览器请求的类中检索模型数据,然后指定将响应返回到浏览器的视图模板。简单练习: 1、添加ControllerHelloWorldControlle
在Node开发中免不了要使用框架,比如express、koa、koa2拿使用的最多的express来举例子开发中肯定会用到很多类似于下面的这种代码varexpress=require('express');varapp=express();app.listen(3000,function(){console.log('listen3000...');});app.use(middle
node的http创建服务与利用Express框架有何不同原生http模块与使用express框架对比:consthttp=require("http");letserver=http.createServer(function(req,res){//服务器收到浏览器web请求后,打印一句话console.log("recvreqfrombrowser");
编辑nginx文件vi/usr/local/etcginxginx.confnginx配置如下,配置后需重启nginxnginx-sreloadlocation~.*\.json{roothtml;add_header"Access-Control-Allow-Origin""*";}前端index.html<script>fetch('http://localhost:12
constexpress=require('express')constapp=express()//步骤的拆解constresult=express.static('./views')app.use(result)//再次托管一下样式表的资源目录app.use('/css',express.static('./css'))//托管JS文件目录app.use('/js&#
问题描述:最近在做毕设,express里边的中间件(body-parser)失效,req.body获取不到任何值,req.query能获取到值。一开始加body-parser中间件是有用的,直到昨天加了token之后,body-parser失效。试着把token去掉,无济于事,也不是这个问题,也有说版本对不上的,换了中间件的引入方法,还是没用!!! 后
express官网:---->传送门 expressexpress框架有许多功能,比如路由配置,中间件,对于想配置服务器的前端来说,非常便捷自从node发展之后,基于nodejs的开发框架也不断涌现出来,express就是其中之一,最近简单的写了点express框架的简单的处理请求的demo首先是安装express模块npminstall
目录问题: 操作:Win+S按键,输入“事件查看器”问题详情:模块DLLC:\ProgramFiles(x86)\IISExpress\aspnetcore.dll未能加载。返回的数据为错误信息。问题:  操作:Win+S按键,输入“事件查看器” 问题详情:模块DLLC:\ProgramFiles(x86)\IISExpress\aspnetcore.dll
//获取阿里云市场,快递物流记录https://market.aliyun.com/products/56928004/cmapi022273.html?spm=5176.2020520132.101.26.61f97218v18GBF#sku=yuncode1627300000//get_express_log(self::$config['web']['aliyun_AppCode']阿里云市场AppCode,缓存秒数如300秒,'快递公司代