您的当前位置:首页正文

express后端接口编写(简单)

2023-04-10 来源:帮我找美食网

简单的创建一个前后端分离项目,适用于前端学习,vue为前端渲染界面,express框架用于编写后台接口,mysql用于创建数据库

参考文章: (后端解决跨域问题)

创建基础项目文件夹

demo1:其中vite、express可以安装在电脑,创建项目更加快捷

简单测试登录接口(express项目)

启动express项目

创建好的Node-express项目结构如图

  1. 点击Run-startdebugging选择node.js启动,进入调试模式,每次更新内容后点击刷新按钮(出错尝试在终端输入npm start启动项目)

  1. 进入bin文件夹中的www文件,查看当前分配的项目端口,浏览器输入localhost:3000即可进入当前项目首页

创建并测试基础登录接口

  1. 在routes文件夹中创建login.js文件,为登录接口文件,并在app.js文件中引入并使用

  1. 在login.js文件中编写接口内容
var express = require("express");
var router = express.Router();

/ === 对应的路径为localhost:3000/login
// 选择接口请求方式
router.get("/", function (req, res, next) {
  // req为客户端发送的请求参数数据
  // res为服务端返回的数据
  const body = {
    // 此处随意定义一个数据
    username: "admin",
  };
   // 调用res.send将数据响应给客户端
  res.send({
    status: 0,
    msg: "login请求成功",
    data: body,
  });
});
// 当前文件中嵌套路由 === localhost:3000/login/register
router.post("/register", (req, res) => {
  // 获取客户端输入的数据
  const body = req.body;
  res.send({
    status: 0,
    msg: "post请求成功",
    data: body, //此处是将客户端输入的数据返回,正常应该是返回数据库中的数据
    // 响应给客户端的数据必须是对象,不能是数组
  });
});

module.exports = router;
  1. 打开postman,首先是get请求

  1. post请求,均有效

连接并调用mysql数据库

  1. 启动mysql,管理员打开powershell,net start mysql
  2. 打开连接,新建数据库demo1,并创建user表

  1. 进入Node-express文件夹内,输入命令npm install mysql,安装mysql依赖包;在Node-express项目文件夹下创建sql.js文件,与app.js平级,用于存放数据库配置

  1. 将get改为post,登录一般为post请求,调用db,使用sql查询用户

Vue项目实现登录

  1. 跳过其它项目初始化等....
  2. 封装axios,baseURL为express项目地址
  3. 封装login接口
  4. 调用login接口
  5. 跨域,在后端experss项目中使用cors,npm install cors
  6. 登录成功

因篇幅问题不能全部显示,请点此查看更多更全内容

热门图文

Top