当前位置: 首页 > news >正文

express+mysql+vue,从零搭建一个商城管理系统5--用户注册

提示:学习express,搭建管理系统

文章目录

  • 前言
  • 一、新建user表
  • 二、安装bcryptjs、MD5、body-parser
  • 三、修改config/db.js
  • 四、新建config/bcrypt.js
  • 五、新建models文件夹和models/user.js
  • 五、index.js引入使用body-parser
  • 六、修改routes/user.js
  • 七、启动项目
  • 八、配置Apipost接口/user/register
  • 九、访问/user/register
  • 总结


前言

需求:主要学习express,所以先写service部分

一、新建user表

1、express_service数据库,鼠标右键点击表
在这里插入图片描述
2、点击新建表
在这里插入图片描述
3、创建user表
在这里插入图片描述
3、ctrl+s保存,输入user,点击确认
在这里插入图片描述
在这里插入图片描述
4、设计表添加栏位userID、userName、password
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二、安装bcryptjs、MD5、body-parser

bcryptjs是对密码进行加密的插件
body-parser对http请求进行解析

 npm install bcryptjs --save

在这里插入图片描述

npm install md5 --save

在这里插入图片描述

npm install body-parser --save

在这里插入图片描述

三、修改config/db.js

const mysql = require('mysql');
const pool = mysql.createPool({host:'localhost',ipport:'3306',user:'root',password:'123456',database:'express_service'
});const query = (sql,params,callback)=>{return new Promise((resolve,reject)=>{pool.getConnection((err,connect)=>{if(err) reject(err);connect.query(sql,params,(err,result)=>{if(err) reject(err);return resolve(result);});});});
}
module.exports = query;

在这里插入图片描述

四、新建config/bcrypt.js

bcrypt.js

const bcryptJs = require('bcryptjs');const bcrypt = {hash:(txt,salt=9)=>{return bcryptJs.hashSync(txt,salt);},compare:(txt,hash)=>{return bcryptJs.compareSync(txt,hash);},
}module.exports = bcrypt;

在这里插入图片描述

五、新建models文件夹和models/user.js

user.js

const query = require('../config/db');
const bcrypt = require('../config/bcrypt');
const md5 = require('md5');
const secretKey = 'longlongago';const errFun = (msg,code)=>{return {code:code||500,success:false,msg:msg||'操作失败'}
}const sucFun = (data,msg)=>{return {code:200,success:true,msg:msg||'操作成功',data,}
}const userDao = {register:async(data)=>{//这里只添加user到数据库,不做验证和检验const userId = md5(data.userName+secretKey);const password = bcrypt.hash(data.password+secretKey);const sql = `insert into user (userId,userName,password) values('${userId}','${data.userName}','${password}')`;const result = await query(sql);console.log(result)// return result;if(result&&result.affectedRows==1)return sucFun(result[0],'添加用户成功');return errFun('添加用户失败');},
}module.exports = userDao;

在这里插入图片描述

五、index.js引入使用body-parser

const express = require('express');const app = express();
const router = express.Router();const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());const port = 1990;require('./config/db');//初始化路由
require('./routes/index')(router);app.use('/', router);
app.listen(port,()=>{console.log('http://localhost:'+port);
})

在这里插入图片描述

六、修改routes/user.js

const userDao = require('../models/user');
const userRoutes = (router)=>{router.post('/user/register',async (req,res)=>{const result = await userDao.register(req.body);res.json(result);});
}
module.exports = userRoutes;

在这里插入图片描述

七、启动项目

npm run dev

在这里插入图片描述

八、配置Apipost接口/user/register

使用到的工具是Apipost
1、新建目录
在这里插入图片描述
2、目录命名express_service
在这里插入图片描述
3、鼠标右键点击express_service,新建user子目录
在这里插入图片描述
在这里插入图片描述
4、右键点击user子目录,新建接口
在这里插入图片描述
5、接口配置
url:http://localhost:1990/user/register
name:/user/register
params:{
“userName”:“longlongago”,
“password”:“123456”
}
在这里插入图片描述

九、访问/user/register

在这里插入图片描述
在这里插入图片描述

总结

踩坑路漫漫长@~@

相关文章:

express+mysql+vue,从零搭建一个商城管理系统5--用户注册

提示:学习express,搭建管理系统 文章目录 前言一、新建user表二、安装bcryptjs、MD5、body-parser三、修改config/db.js四、新建config/bcrypt.js五、新建models文件夹和models/user.js五、index.js引入使用body-parser六、修改routes/user.js七、启动项…...

canvas水波纹效果,jquery鼠标水波纹插件

canvas水波纹效果&#xff0c;jquery鼠标水波纹插件 效果展示 jQuery水波纹效果&#xff0c;canvas水波纹插件 HTML代码片段 <div class"scroll04wrap"><h3>发展历程</h3><div class"scroll04"><p>不要回头&#xff0c;一…...

Zookeeper客户端命令、JAVA API、监听原理、写数据原理以及案例

1. Zookeeper节点信息 指定服务端&#xff0c;启动客户端命令&#xff1a; bin/zkCli.sh -server 服务端主机名:端口号 1&#xff09;ls / 查看根节点下面的子节点 ls -s / 查看根节点下面的子节点以及根节点详细信息 其中&#xff0c;cZxid是创建节点的事务id&#xff0c…...

[嵌入式系统-34]:RT-Thread -19- 新手指南:RT-Thread标准版系统架构

目录 一、RT-Thread 简介 二、RT-Thread 概述 三、许可协议 四、RT-Thread 的架构 4.1 内核层&#xff1a; 4.2 组件与服务层&#xff1a; 4.3 RT-Thread 软件包&#xff1a; 一、RT-Thread 简介 作为一名 RTOS 的初学者&#xff0c;也许你对 RT-Thread 还比较陌生。然…...

postman访问k8s api

第一种方式&#xff1a; kubectl -n kubesphere-system get sa kubesphere -oyaml apiVersion: v1 kind: ServiceAccount metadata:annotations:meta.helm.sh/release-name: ks-coremeta.helm.sh/release-namespace: kubesphere-systemcreationTimestamp: "2023-07-24T07…...

UE4c++ ConvertActorsToStaticMesh

UE4c ConvertActorsToStaticMesh ConvertActorsToStaticMesh UE4c ConvertActorsToStaticMesh创建Edior模块&#xff08;最好是放Editor模块毕竟是编辑器代码&#xff09;创建UBlueprintFunctionLibraryUTestFunctionLibrary.hUTestFunctionLibrary.cpp:.Build.cs 目标:为了大量…...

Qt中tableView控件的使用

tableView使用注意事项 tableView在使用时&#xff0c;从工具栏拖动到底层页面后&#xff0c;右键进行选择如下图所示&#xff1a; 此处需要注意的是&#xff0c;需要去修改属性&#xff0c;从UI上修改属性如下所示&#xff1a; 也可以通过代码修改属性&#xff1a; //将其设…...

【医学影像】LIDC-IDRI数据集的无痛制作

LIDC-IDRI数据集制作 0.下载0.0 链接汇总0.1 步骤 1.合成CT图reference 0.下载 0.0 链接汇总 LIDC-IDRI官方网址&#xff1a;https://www.cancerimagingarchive.net/nbia-search/?CollectionCriteriaLIDC-IDRINBIA Data Retriever 下载链接&#xff1a;https://wiki.canceri…...

MacOS开发环境搭建详解

搭建MacOS开发环境需要准备相应的软硬件&#xff0c;并遵循一系列步骤。以下是详细的步骤&#xff1a; 软硬件准备&#xff1a; MacOS电脑&#xff1a;确保你的电脑运行的是MacOS操作系统。Xcode软件&#xff1a;打开AppStore&#xff0c;搜索并安装Xcode。安装过程可能较长&…...

全量知识系统问题及SmartChat给出的答复 之2

Q6. 根据DDD的思想( 也就是借助 DDD的某个或某些实现)&#xff0c;是否能按照这个想法给出程序设计和代码结构&#xff1f; 当使用领域驱动设计&#xff08;DDD&#xff09;的思想来设计程序和代码结构时&#xff0c;可以根据领域模型、领域服务、值对象、实体等概念来进行设计…...

嵌入式驱动学习第一周——vim的使用

前言 本篇博客学习使用vim&#xff0c;vim作为linux下的编辑器&#xff0c;学linux肯定是绕不开vim的&#xff0c;因为不确定对方环境中是否安装了编译器&#xff0c;但一定会有vim。 对于基本的使用只需要会打开文件&#xff0c;保存文件&#xff0c;编辑文件即可。 嵌入式驱动…...

loop_list单向循环列表

#include "loop_list.h" //创建单向循环链表 loop_p create_head() { loop_p L(loop_p)malloc(sizeof(loop_list)); if(LNULL) { printf("create fail\n"); return NULL; } L->len 0; L->nextL; retur…...

Python爬虫实战第二例【二】

零.前言&#xff1a; 本文章借鉴&#xff1a;Python爬虫实战&#xff08;五&#xff09;&#xff1a;根据关键字爬取某度图片批量下载到本地&#xff08;附上完整源码&#xff09;_python爬虫下载图片-CSDN博客 大佬的文章里面有API的获取&#xff0c;在这里我就不赘述了。 一…...

Eclipse是如何创建web project项目的?

前面几篇描述先后描述了tomcat的目录结构和访问机制&#xff0c;以及Eclipse的项目类型和怎么调用jar包&#xff0c;还有java的main函数等&#xff0c;这些是一些基础问题&#xff0c;基础高清出来才更容易搞清楚后面要说的东西&#xff0c;也就是需求带动学习&#xff0c;后面…...

Excel的中高级用法

单元格格式&#xff0c;根据数值的正负分配不同的颜色和↑ ↓ 根据数值正负分配颜色 2-7 [蓝色]#,##0;[红色]-#,##0 分配颜色的基础上&#xff0c;根据正负加↑和↓ 2↑-7↓ 其实就是在上面颜色的代码基础上加个 向上的符号↑&#xff0c;或向下的符号↓ [蓝色]#,##0↑;[红色…...

【ArcGIS】基本概念-空间参考与变换

ArcGIS基本概念-空间参考与变换 1 空间参考与地图投影1.1 空间参考1.2 大地坐标系&#xff08;地理坐标系&#xff09;1.3 投影坐标系总结 2 投影变换预处理2.1 定义投影2.2 转换自定义地理&#xff08;坐标&#xff09;变换2.3 转换坐标记法 3 投影变换3.1 矢量数据的投影变换…...

Qt QWidget 简约美观的加载动画 第五季 - 小方块风格

给大家分享两个小方块风格的加载动画 &#x1f60a; 第五季来啦 &#x1f60a; 效果如下: 一个三个文件,可以直接编译运行 //main.cpp #include "LoadingAnimWidget.h" #include <QApplication> #include <QGridLayout> int main(int argc, char *arg…...

针对KZG承诺和高效laconic OT的extractable witness encryption

1. 引言 2024年以太坊基金会等成员论文 Extractable Witness Encryption for KZG Commitments and Efficient Laconic OT&#xff0c;开源代码实现见&#xff1a; https://github.com/rot256/research-we-kzg&#xff08;Rust&#xff09; 在该论文中&#xff0c;提供了一种…...

Spring Boot中实现列表数据导出为Excel文件

点击下载《Spring Boot中实现列表数据导出为Excel文件》 1. 前言 本文将详细介绍在Spring Boot框架中如何将列表数据导出为Excel文件。我们将通过Apache POI库来实现这一功能&#xff0c;并解释其背后的原理、提供完整的流程和步骤&#xff0c;以及带有详细注释的代码示例。最…...

华为ipv6 over ipv4 GRE隧道配置

思路&#xff1a; PC1访问PC2时&#xff0c;会先构造源ipv6为2001:1::2&#xff0c;目的IPV6为2001:2::2的ipv6报文&#xff0c;然后查看PC1的路由表&#xff0c;发送到R1&#xff0c;r1接收后&#xff0c;以目的IPV6地址2001:2::2查询IPV6路由表&#xff0c;出接口为tun0/0/0…...

内存分配函数malloc kmalloc vmalloc

内存分配函数malloc kmalloc vmalloc malloc实现步骤: 1)请求大小调整:首先,malloc 需要调整用户请求的大小,以适应内部数据结构(例如,可能需要存储额外的元数据)。通常,这包括对齐调整,确保分配的内存地址满足特定硬件要求(如对齐到8字节或16字节边界)。 2)空闲…...

【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15

缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下&#xff1a; struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

工业自动化时代的精准装配革新:迁移科技3D视觉系统如何重塑机器人定位装配

AI3D视觉的工业赋能者 迁移科技成立于2017年&#xff0c;作为行业领先的3D工业相机及视觉系统供应商&#xff0c;累计完成数亿元融资。其核心技术覆盖硬件设计、算法优化及软件集成&#xff0c;通过稳定、易用、高回报的AI3D视觉系统&#xff0c;为汽车、新能源、金属制造等行…...

大数据学习(132)-HIve数据分析

​​​​&#x1f34b;&#x1f34b;大数据学习&#x1f34b;&#x1f34b; &#x1f525;系列专栏&#xff1a; &#x1f451;哲学语录: 用力所能及&#xff0c;改变世界。 &#x1f496;如果觉得博主的文章还不错的话&#xff0c;请点赞&#x1f44d;收藏⭐️留言&#x1f4…...

短视频矩阵系统文案创作功能开发实践,定制化开发

在短视频行业迅猛发展的当下&#xff0c;企业和个人创作者为了扩大影响力、提升传播效果&#xff0c;纷纷采用短视频矩阵运营策略&#xff0c;同时管理多个平台、多个账号的内容发布。然而&#xff0c;频繁的文案创作需求让运营者疲于应对&#xff0c;如何高效产出高质量文案成…...

(一)单例模式

一、前言 单例模式属于六大创建型模式,即在软件设计过程中,主要关注创建对象的结果,并不关心创建对象的过程及细节。创建型设计模式将类对象的实例化过程进行抽象化接口设计,从而隐藏了类对象的实例是如何被创建的,封装了软件系统使用的具体对象类型。 六大创建型模式包括…...

关于uniapp展示PDF的解决方案

在 UniApp 的 H5 环境中使用 pdf-vue3 组件可以实现完整的 PDF 预览功能。以下是详细实现步骤和注意事项&#xff1a; 一、安装依赖 安装 pdf-vue3 和 PDF.js 核心库&#xff1a; npm install pdf-vue3 pdfjs-dist二、基本使用示例 <template><view class"con…...

Web后端基础(基础知识)

BS架构&#xff1a;Browser/Server&#xff0c;浏览器/服务器架构模式。客户端只需要浏览器&#xff0c;应用程序的逻辑和数据都存储在服务端。 优点&#xff1a;维护方便缺点&#xff1a;体验一般 CS架构&#xff1a;Client/Server&#xff0c;客户端/服务器架构模式。需要单独…...

Chrome 浏览器前端与客户端双向通信实战

Chrome 前端&#xff08;即页面 JS / Web UI&#xff09;与客户端&#xff08;C 后端&#xff09;的交互机制&#xff0c;是 Chromium 架构中非常核心的一环。下面我将按常见场景&#xff0c;从通道、流程、技术栈几个角度做一套完整的分析&#xff0c;特别适合你这种在分析和改…...

【LeetCode】算法详解#6 ---除自身以外数组的乘积

1.题目介绍 给定一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&#xff0c;且在 O…...