投稿

基于MySql数据库+Express的API接口服务（含服务器部署）

Vedu • • 技术资讯 • 阅读 1074

一、用到的技术点

  • 第三方包express和mysql2
  • ES6模块化
  • Promise
  • async/await

二、主要实现步骤

  1. 搭建项目基本结构
①新建文件夹，使用node初始化项目，并在package.json中声明"type":"module"使之支持ES6模块化
npm init -y
②安装第三方依赖
npm install express@4.17.1 mysql2@2.2.5
基于MySql数据库+Express的API接口服务（含服务器部署）

//package.json{  "type":"module",  "name": "api",  "version": "1.0.0",  "description": "",  "main": "index.js",  "scripts": {    "test": "echo "Error: no test specified" && exit 1"  },  "keywords": [],  "author": "",  "license": "ISC"}

2. 创建基本的服务器

在项目的根目录下创建一个app.js文件，在其中导入express模块，并绑定监听端口号，在终端运行命
令：node ./app.js
//app.js
import express from 'express'

const app =  express()

app.listen(8081,()=>{
    console.log("服务已经启动。。。");
})

输入命令后看见如下则说明服务已经启动：

基于MySql数据库+Express的API接口服务（含服务器部署）

3. 创建db数据库操作模块

在项目根目录下创建db文件夹，在其中创建index.js，导入mysql2模块并定义数据源。
//index.js
import mysql from 'mysql2'

const pool = mysql.createPool({
    host:'127.0.0.1',
    port:3306,
    database:'sys',//数据库名称
    user:'root',//用户名
    password:'123456'//密码
})

//使用默认导出，将数据库对象暴露出去  这里导出它的promise
export default pool.promise()

4. 创建controller模块

在项目根目录创建controller文件夹，在其中新建control.js，导入刚才创建的db模块，并进行相应的
数据库操作。
//control.js
import db from "../db/index.js";

//定义一个获取数据列表的函数
//将函数按需导出
//由于我们之前的db返回的是promise对象，所以我们使用async/await来简化
export async function getInfo(req, res) {
  //这里可以进行一个异常捕获
  try {
    const [rows] = await db.query("select * from sys_config");
    //构建响应数据
    res.send({
      status: 200,
      msg: "获取成功",
      data: rows,
    });
  } catch (error) {
    //构建响应数据
    res.send({
      status: 500,
      msg: "获取失败",
      data: error.message,
    });
  }
}

5. 创建router模块

在项目根目录下创建router文件夹，在其中创建router.js，需要按需导入上一步创建的getInfo函数，
并创建路由对象和定义挂载路由的规则。
//router.js
import  express  from "express";
//按需导入getInfo函数
import { getInfo } from "../controller/control.js";

//创建路由对象
const router = new express.Router()

//挂载路由对象  /info代表访问路径
router.get('/info',getInfo)

//将路由对象导出
export default router

6. 在app.js中导入并挂载路由模块

在app.js中导入并挂载路由模块，并重启服务
//app.js
import express from 'express'

//导入路由模块
import router from './router/router.js';

const app =  express()

//挂载路由对象  '/api'用来设置默认访问前缀，如router模块中定义了'/info',那么访问路径就是'/api/info'
app.use('/api',router)

app.listen(8081,()=>{
    console.log("服务已经启动。。。");
})

7. 补充

想要修改代码后自动编译，可以使用nodemon ./app.js
如果没有安装nodemon 可以使用命令npm install nodemon -g进行全局安装

8. 测试

打开浏览器，输入：http://localhost:8081/api/info
如果出现以下数据，说明该api在本地已经可以成功访问。
如果访问不到，请检查自己的数据库名称，用户名和密码是否正确。
基于MySql数据库+Express的API接口服务（含服务器部署）

火狐访问

基于MySql数据库+Express的API接口服务（含服务器部署）

谷歌访问

三、将写好的API部署到服务器

要想将API部署到服务器，首先得有自己的服务器。这个看大家的需求自行购买。

以腾讯云的宝塔面板进行演示。

  1. 安装PM2管理工具
基于MySql数据库+Express的API接口服务（含服务器部署）

2. 上传数据库备份文件

基于MySql数据库+Express的API接口服务（含服务器部署）

注意：数据库名字和用户名随便取，但是会有校验规则，像什么root之类的是不允许取的

基于MySql数据库+Express的API接口服务（含服务器部署）

选择导入，从本地上传数据库备份文件，也就是上面步骤中用到的数据库。

基于MySql数据库+Express的API接口服务（含服务器部署）

上传之后一定要选择导入

基于MySql数据库+Express的API接口服务（含服务器部署）

3. 将本地文件上传到服务器

文件上传的路径是任意的，比如我在wwwroot目录下新建了api文件夹，然后进入api文件夹，点击上传，将本地刚才创建的api文件夹中的所有内容上传。

基于MySql数据库+Express的API接口服务（含服务器部署）

基于MySql数据库+Express的API接口服务（含服务器部署）

4. 修改数据库的连接

因为服务器上的数据库名字和用户名和本地创建的时候是不一致的，所以要修改成服务器上的用户名和数据库名字。修改服务器上db/index.js:

import mysql from 'mysql2'

const pool = mysql.createPool({
    host:'127.0.0.1',
    port:3306,
    database:'test111',
    user:'test111',
    password:'123456'
})

export default pool.promise();

5. 配置PM2管理工具

基于MySql数据库+Express的API接口服务（含服务器部署）

基于MySql数据库+Express的API接口服务（含服务器部署）

基于MySql数据库+Express的API接口服务（含服务器部署）

选择模块下的管理

基于MySql数据库+Express的API接口服务（含服务器部署）

基于MySql数据库+Express的API接口服务（含服务器部署）

设置监听端口

基于MySql数据库+Express的API接口服务（含服务器部署）

在安全中放行8081端口

基于MySql数据库+Express的API接口服务（含服务器部署）

同时在防火墙放行8081端口

基于MySql数据库+Express的API接口服务（含服务器部署）

重启服务，用ip+端口号进行访问

基于MySql数据库+Express的API接口服务（含服务器部署）

基于MySql数据库+Express的API接口服务（含服务器部署）

如果能成功访问如上页面，说明API部署成功。

6. 跨域问题

我们写一个index.htm,点击按钮来获取一下服务器的API接口

<!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>api测试</title>
  </head>
  <body>
    <button onclick="getInfo()">点击获取数据</button>
    <div id="content"></div>
  </body>
  <script>
    function getInfo() {
      var xhr = new XMLHttpRequest(); //这里没有考虑IE浏览器，如果需要择if判断加
      xhr.open("GET", "http://你的ip:8081/api/info", true);
      xhr.send(null);
      xhr.onreadystatechange = function (data) {
        if (xhr.status === 200 && xhr.readyState === 4) {
           document.getElementById('content').innerText = data.currentTarget.responseText
        }
      };
    }
  </script>
</html>

我们点击按钮发现出现跨域错误

基于MySql数据库+Express的API接口服务（含服务器部署）

解决方式：

在app.js中加入如下代码，然后重启PM2管理工具：

import express from 'express'

//导入路由模块
import router from './router/router.js';

const app =  express()

//本地服务器解决跨域，不可缺
app.all('*', function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    //Access-Control-Allow-Headers ,可根据浏览器的F12查看,把对应的粘贴在这里就行
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    res.header('Access-Control-Allow-Methods', '*');
    res.header('Content-Type', 'application/json;charset=utf-8');
    next();
  });


//挂载路由对象  '/api'用来设置默认访问前缀，如router模块中定义了'/info',那么访问路径就是'/api/info'
app.use('/api',router)

app.listen(8081,()=>{
    console.log("服务已经启动。。。");
})

再次点击按钮，成功获取到返回的json数据：

基于MySql数据库+Express的API接口服务（含服务器部署）

至此，基于node模块化的api编写及部署就结束了。大家在学习开发的过程中就可以自己写接口来测试了。

内容出处：，

声明：本网站所收集的部分公开资料来源于互联网，转载的目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。如果您发现网站上有侵犯您的知识产权的作品，请与我们取得联系，我们会及时修改或删除。文章链接：http://www.yixao.com/tech/29322.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
VeduVedu
0 0
上一篇 2021-09-21 15:14
下一篇 2021-09-22 05:47

相关推荐

发表评论

登录后才能评论