zoukankan      html  css  js  c++  java
  • express + mysql实践

    本文基于已搭建好 express 项目并且已经安装MySql环境

    本文查看MySql用 navicat 软件

    本文呢代码源码下载地址:https://files.cnblogs.com/files/konghaowei/express%E3%80%81mysql%E5%AE%9E%E8%B7%B5%E6%BA%90%E7%A0%81.rar

    express 项目安装mysql依赖:npm i mysql --save

     

     

    routes 文件夹就是专门存放路由,每个单独文件就是一个路由模块
    routes 文件夹创建个 student.js 文件填入以下内容:
    let express = require('express')
    let router = express.Router()
    let mysql = require('mysql')
    
    // 创建数据库链接(参数不用说了见名知意)
    let conn = mysql.createConnection({
      host: 'localhost',
      user: 'root',
      password: '密码',
      port: '3306',
      database: 'test2' // 链接指定数据库
    })
    
    // 在这里写接口
    
    module.exports = router

    app.js 引入 student.js 文件

     


     实现查询”功能:

    查看表内容

     

    student.js 文件增加以下内容:查询 student

    router.get("/query", (req, res, next) => {
      conn.connect(); // 创建sql链接
      const sql = "select * from student"; // sql语句
      conn.query(sql, (err, result) => {
        if (err) {
          res.json({
            code: 500,
            msg: "SQL执行错误",
            err
          })
        } else {
          res.json({
            code: 200,
            msg: "查询成功",
            data: result // 查询结果
          })
        }
        conn.destroy(); // 关闭sql链接
      })
    })

    重启express 项目,然后前端ajax调用接口(直接用jq省事):

    $.ajax({
      type: "get",
      url: "http://localhost:3000/student/query",
      success: function (res) {
        console.log(res);
      },
      error: function (err) {
        console.log(err);
      },
    });

    student.js 文件增加以下内容:根据条件(名称)查询student

    router.get("/query2", (req, res, next) => {
      console.log('前端get请求参数:', req.query);
      conn.connect();
      const sql = "select * from student where name=?"; // 执行查询语句
      const sqlParams = [req.query.name] // 条件
      conn.query(sql, sqlParams, (err, result) => {
        if (err) {
          res.json({
            code: 500,
            msg: "SQL执行错误",
            err
          })
        } else {
          res.json({
            code: 200,
            msg: "查询成功",
            data: result
          })
        }
        conn.destroy();
      })
    })

    重启express 项目,然后前端ajax调用接口:

    $.ajax({
      type: "get",
      url: "http://localhost:3000/student/query2",
      data: {
        name: "Anne"
      },
      success: function (res) {
        console.log(res);
      },
      error: function (err) {
        console.log(err);
      },
    });

     


     实现增加”功能:

    express post请求获取参数需要安装依赖 body-parser 依赖
    安装依赖:npm i body-parser
    app.js 里面引入并添加解析
     

    先看表结构

    student.js 文件增加以下内容: student 表增加人员

    router.post("/add", (req, res, next) => {
      console.log('前端post请求参数:', req.body);
      conn.connect();
      const sql = "insert into student(name,age,sex) values(?,?,?)" //SQL语句
      const sqlParams = [req.body.name, req.body.age, req.body.sex] // 动态参数
      conn.query(sql, sqlParams, (err, result) => {
        if (err) {
          res.json({
            code: 500,
            msg: "SQL执行错误",
            err
          })
        } else {
          res.json({
            code: 200,
            msg: "增加成功",
            data: result
          })
        }
        conn.destroy();
      })
    })

    重启express 项目,然后前端ajax调用接口:

    $.ajax({
      type: "post",
      url: "http://localhost:3000/student/add",
      data: {
        name: "Lili",
        age: "15",
        sex: "0"
      },
      success: function (res) {
        console.log(res);
      },
      error: function (err) {
        console.log(err);
      },
    });

     

     

     到navicat查看数据库的 student 表多了刚才增加的数据

     


     实现编辑”功能:

    student.js 文件增加以下内容:编辑 student id为4 的数据

    router.put("/edit/:id", (req, res, next) => {
      const id = req.params.id;
      console.log('前端put请求id:', id);
      console.log('前端put请求参数:', req.body);
      conn.connect();
      const sql = "update student set name=?,age=?,sex=? where id=?" //SQL语句
      const sqlParams = [req.body.name, req.body.age, req.body.sex, id] // 动态参数
      conn.query(sql, sqlParams, (err, result) => {
        if (err) {
          res.json({
            code: 500,
            msg: "SQL执行错误",
            err
          })
        } else {
          res.json({
            code: 200,
            msg: "编辑成功",
            data: result
          })
        }
        conn.destroy();
      })
    })

    重启express 项目,然后前端ajax调用接口:

    $.ajax({
      type: "put",
      url: "http://localhost:3000/student/edit/" + 4,
      data: {
        name: "Lili",
        age: "25",
        sex: "2"
      },
      success: function (res) {
        console.log(res);
      },
      error: function (err) {
        console.log(err);
      },
    });

    到navicat查看数据库的 studentid为4 的数据有变化

     


     实现删除”功能:

    student.js 文件增加以下内容:编辑 student id为4 的数据
    router.delete("/delete/:id", (req, res, next) => {
      const id = req.params.id;
      console.log('前端delete请求id:', id);
      conn.connect();
      const sql = "delete from student where id=?" //SQL语句
      const sqlParams = [id] // 动态参数
      conn.query(sql, sqlParams, (err, result) => {
        if (err) {
          res.json({
            code: 500,
            msg: "SQL执行错误",
            err
          })
        } else {
          res.json({
            code: 200,
            msg: "删除成功",
            data: result
          })
        }
        conn.destroy();
      })
    })

    重启express 项目,然后前端ajax调用接口:

    $.ajax({
      type: "delete",
      url: "http://localhost:3000/student/delete/" + 4,
      success: function (res) {
        console.log(res);
      },
      error: function (err) {
        console.log(err);
      },
    });

     

     

     

    以上就是express+mysql实现增删改查一套流程

  • 相关阅读:
    LCS 最长公共子序列
    零和数组
    Learn2Rank
    ac自动机
    208. Implement Trie (Prefix Tree)
    php截取中文字符串 GB2312 utf-8
    纵向文字滚动代码,带上下图片控制的。鼠标放到上下图片上时滚动
    js图片切换 带左右控制的
    实时显示输入的内容
    Lightbox JS v2.0图片切换效果
  • 原文地址:https://www.cnblogs.com/konghaowei/p/14901257.html
Copyright © 2011-2022 走看看