0基础教你用node写后端接口访问数据库_node开发后端接口-CSDN博客

全栈牛马修炼日记

一、环境准备
二、开始码代码

一、环境准备

安装node.js

node这里我们就不赘述了，相信大家都会，不会的可以去搜教程。隔壁有好多大神已经给大家出教程了。

安装express

express框架是一个快速构建web项目的框架
它可以设置中间件来响应 HTTP 请求。
定义了路由表用于执行不同的 HTTP 请求动作。
可以通过向模板传递参数来动态渲染 HTML 页面。
安装命令

// 全局安装express
npm install -g express

安装cors

cors是一种跨域方法，它是W3C标准，属于跨域Ajax请求的根本解决方案。支持GET和POST请求。缺点是不兼容某些低版本的浏览器。具体使用方法下文会说明
安装命令

// 安装cors
npm i cors

安装mysql

node中提供了操作数据库的包mysql,可以使用其连接数据库，数据库的具体安装方法和教程请自行搜索，本文不做赘述。

//安装mysql包的命令 版本号自行匹配
npm i mysql

至此位置我们的环境就准备好了，接下来就可以在前端的基础上写后端代码了，成为一个全栈牛马指日可待。

二、开始码代码

首先在你的vue项目中创建一个server的文件夹，至于命名无所谓，你想叫什么都可以。在server文件夹下创建两个文件夹分别是存放数据库配置的DB文件夹和存放接口的API文件夹，以及一个入口文件index.js。如下图所示。
在这里插入图片描述

1、我们先看怎么连接数据库

在DB文件夹中创建一个任意命名的js文件

// 引入mysql框架
const mysql = require('mysql')
// 创建连接对象
const option = {
    host: 'localhost', // 连接的数据库的地址，这里我是本机就用localhost代替
    user: 'root',// 用户名 安装数据库时设置的账号
    password: 'root', // 密码 
    port: '',  // 数据库端口号
    database: '', //数据库名
    connectionTimeout: 1000, // 连接超时事件
    multipleStatements: false, // 一次执行多条sql语句
}
// 创建连接对象 并将对象抛出供其他文件使用
const conn = mysql.createConnection(option)
module.exports = conn;

2、编写接口

在api文件内创建一个js文件代码如下

const express = require('express') // 引入express框架
const conn = require("../DB/db")  //导入前面写好的数据库连接对象
const router = express.Router()  // 创建路由对象
// 开启连接提示
conn.connect((err) => {
   if (err) {
        console.log('连接失败')
        return;
    };
    console.log('连接成功')
})
// 编写一个测试接口
router.post("/test",(req,res)=>{
    res.json({code:200,data:"123"})
})
module.exports = router;

3、启动接口

接口编写完毕后，就到了启动服务的时候了，一旦启用成功前端就可以通过网络请求访问了

// 接口的入口文件
const express = require('express')
const app = express()
const cors = require('cors')
const bodyParser = require('body-parser')
const tj = require("./api/tj_api") // 引入接口文件

app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}))

app.listen(3000, () => console.log('服务启动'))
app.use("/tj",tj); // 使用接口文件并给一个访问地址
module.exports=app;

使用node .\index.js命令启动服务记得终端路径是在你index的目录下哦

4、调用接口

这里我们使用axios方法调用接口，vue中配置axios的方法相信大家都已经会了，我们就不多说了。老规矩直接上代码。

// 我们通过访问tj路径进入接口的入口文件 进而访问到接口文件 最终查询到目标接口/test。
this.axios.post('localhost:3000/tj/test', {table_name: 'jl'})
          .then((response) => {
            console.log(response)
          }).catch((error) => {
        console.log(error);
      })

看到这了有人说，你引用了mysql但是接口里没有写呀。
在这里插入图片描述
这里其实很简单，我们只要稍微改动一下这个地方

//我们先简单看下查询语句 其他的语句类似哦
router.post("/test",(req,res)=>{
	// 我们前端传递的参数都放到了req中了哦，具体的根据情况而定
	 let table_name = req.body.table_name
	 // 通过query 执行sql
    conn.query(`select * from ${table_name}`, (err, result) => {
        if (err) {
            res.send(err).end();
        } else {
            res.json({code: 200, data: result}).end()
        }
    })
})

当然你还可以把执行的sql语句写在外面，将参数动态传进去

router.post("/test",(req,res)=>{
	 let table_name = req.body.table_name
	 let id = req.body.id
	 let sql = `select * from ${table_name} where id = ?`
	 // 通过query 执行sql
    conn.query(sql,[id] ,(err, result) => {
        if (err) {
            res.send(err).end();
        } else {
            res.json({code: 200, data: result}).end()
        }
    })
})