zoukankan      html  css  js  c++  java
  • nodejs驱动mongodb 实现数据增删改查,将数据库数据渲染在页面,通过表单项数据库新增数据

    -

    先初始化一个项目,生成package.json

    npm init

    安装mongodb

    npm install mongodb --save

    下面是nodejs操作mongodb的具体操作

    app.js

    // 引入mongodb
    const {MongoClient} = require("mongodb");
    
    // 定义数据库连接的地址
    const url = ' mongodb://127.0.0.1:27017';
    
    // 定义要操作的数据库
    const dbName = 'itying'
    
    // 实例化MongoClient 传入数据库连接地址
    const client = new MongoClient(url);
    
    // 连接数据库
    client.connect((err) => {
      if(err){
        console.log(err);
        return;
      }
      console.log("数据库连接成功");
      
      // 用数据库实例 切换到itying数据库
      let db = client.db(dbName);
    
      // 1.查找数据
      db.collection("user").find({"age":{$gte:90}}).toArray((err,data) => {
    
        console.log(data);
        // 操作完数据库之后 一定要关闭数据库
        client.close();
    
      });
    
      // 2.增加数据
      db.collection("user").insertOne({"username":"nodejs操作mongodb","age":100},(err,result) => {
        if(err){//增加失败
          console.log(err);
          return;
        }
    
        console.log("增加成功");
        console.log(result);
      
        client.close();
    
    
      })
    
      // 3.修改数据
      db.collection("user").updateOne({"username":"zhangsan0"},{$set:{age:10}},(err,result) => {
        if(err){//修改失败
          console.log(err);
          return;
        }
    
        console.log("修改成功");
        console.log(result);
    
        client.close();
      })
    
      // 4.删除1条数据
      db.collection("user").deleteOne({"age":10},(err,result) => {
        // 如果找不到数据 就不会删除 是不会报错的 要注意
        if(err){//删除失败
          console.log(err);
          return;
        }
    
        console.log("删除1条数据成功");
        console.log(result);
    
        client.close();
    
      })
    
      // 5.删除多条数据
      db.collection("user").deleteMany({"age":{$gte:90}},(err,result) => {
        // 如果找不到数据 就不会删除 是不会报错的 要注意
        if(err){//删除失败
          console.log(err);
          return;
        }
    
        console.log("删除多条数据成功");
        console.log(result);
    
        client.close();
    
      })
    
      
    })

    结合路由把数据库里的数据渲染出来,通过表单新增数据

    app.js

    const http = require('http');
    const app = require("./module/router")
    const ejs = require("ejs");
    const querystring = require('querystring')
    // 引入mongodb
    const {MongoClient} = require("mongodb");
    // 定义数据库连接的地址
    const url = ' mongodb://127.0.0.1:27017';
    
    // 定义要操作的数据库
    const dbName = 'itying'
    
    // 实例化MongoClient 传入数据库连接地址
    // const client = new MongoClient(url);
    
    // 注册web服务
    http.createServer(app).listen(3000);
    
    // 修改静态web目录
    app.static("public")
    
    // 注册路由
    app.get("/",(req,res) => {
    
        MongoClient.connect(url,(err,client) => {
            // 连接数据库
            client.connect((err) => {
                if(err){
                    console.log(err);
                    return;
                }
                // 用数据库实例 切换到itying数据库
                let db = client.db(dbName);
    
                // 1.查找数据
                db.collection("user").find({}).toArray((err,result) => {
    
                    console.log(result);
                    // 操作完数据库之后 一定要关闭数据库
                    client.close();
    
                    ejs.renderFile("./views/index.ejs",{
                        list:result,
                    },(err,data) => {
                        if(err){
                            console.log(err);
                            return;
                        }
                        res.send(data)
                    })
            
                });
            });
    
        })
    
            
    
    })
    
    app.get("/register",(req,res) => {
      ejs.renderFile("./views/form.ejs",{},{},(err,data) => {
        res.send(data);
      })
    })
    
    app.post("/doRegister",(req,res) => {
        let body = querystring.parse(req.body)
        console.log(body);
        MongoClient.connect(url,(err,client) => {
            // 连接数据库
            client.connect((err) => {
                if(err){
                    console.log(err);
                    return;
                }
                // 用数据库实例 切换到itying数据库
                let db = client.db(dbName);
    
                db.collection("user").insertOne(body,(err,result) => {
                    if(err){
                        console.log(err);
                        return;
                    }
                    console.log("增加数据成功");
                    res.send("增加数据成功");
                    client.close();
                })
            });
    
        })
    })
    
    
    
    console.log('Server running at http://127.0.0.1:3000/');

    index.ejs

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>uer表</title>
    </head>
    <body>
      <h2>获取用户列表数据</h2>
      <ul>
        <%for(var i = 0;i<list.length;i++){%>
          <li><%=list[i].username%> --- <%=list[i].age%></li>
        <%}%>
      </ul>
    </body>
    </html>

    form.ejs

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
      <link rel="stylesheet" href="./css/style.css">
    </head>
    <body>
      <h2>注册页面</h2>
      <form action="/doRegister" method="post">
        用户名:<input type="text" name="username"/>
        <br>
        <br>&emsp;龄:<input name="age"/>
        <br>
        <br>
        <input type="submit" value="提交">
      </form>
    </body>
    </html>

    -

  • 相关阅读:
    ASP.NET MVC 3.0 新特性之Controller
    ASP.NET MVC 3.0 新特性之View
    微软AD活动目录介绍
    ASP.NET MVC 3.0 新特性之Model
    [ASP.NET MVC3]Chart的ActionResult扩展]
    MVC3RAZOR尝鲜之漂亮的chart图表
    VS2003配置和使用AJAX
    Django操作cookie和session
    Django的forms组件
    开发一个简易的图书增删改查页面
  • 原文地址:https://www.cnblogs.com/fqh123/p/15221191.html
Copyright © 2011-2022 走看看