Node.js实现前后端交互——用户注册
我之前写过一篇关于使用Node.js作为后端实现用户登陆的功能,现在再写一下node.js做后端实现简单的用户注册实例吧。另外需要说的是,上次有大佬提醒需要加密数据传输,不应该使用明文传输用户信息。在实际的开发中,也强烈建议大家做数据加密操作。ps:这里为了演示,就不做数据加密了。好了,现在开始我们的小项目。
一、项目需求
要求用户进入用户注册界面,填写用户名和密码后,提交到数据库保存。注册后的账户可用于登陆。ps:关于用户名和用户密码审核这些的就不写了,这里只写一些核心功能需求的代码。
二、开始撸代码
1,创建前端代码,登录页register.html
<div>
<form method="post" action="http://localhost:8080/">
<input type="text" required="required" id="set_name" placeholder="请填写用户名" name="set_name">
<input type="password" required="required" id="set_pwd" placeholder="请填写密码" name="set_pwd">
<input type="password" required="required" id="check_pwd" placeholder="请再次填写密码" name="check_pwd">
<br>
<input type="reset" class="reset_but" value="重写填写">
<input type="submit" class="register_but" value="确认注册">
</form>
</div>
创建登陆表单,此处的提交方式为post,提交地址为自己的主机,因为我是做的本地测试环境。
2、Node.js后端获取用户数据
(1)引入模块,此时需要你的电脑上面以及安装了Node.js环境,安装方法请自行百度。
// 引入http模块
const http = require('http');
//引入处理请求参数模块
const queryString = require('querystring');//调用自定义封装的链接数据库模块
const connection = require("./mysql.js");
此处的自定义封装数据库模块我会在后面给出,读者也可以参考我上一篇:Node.js实现前后端交互——用户登陆的博客。
(2)获取用户提交的用户名和密码,并保存到MySQL数据库
//定义sever是网站服务器对象
let sever = http.createServer();
//为服务器对象绑定请求事件,当客户端有请求时触发
sever.on('request', function (request, response) {
/* POST参数是通过事件的方式接收的
* data 当请求参数传递的时候触发的事件
* end 当参数传递完成的时候触发end事件
*/
let postParams = ''; //定义空字符串用于接收post参数
//绑定data触发事件
request.on('data', function (params) {
postParams = postParams + params; //拼接post参数
});
//绑定data触发事件
request.on('end', function () {
// 把postParams字符串处理为对象,用querystring模块中的parse()方法
//获取前端表单的具体数据,如set_name。注意:此处的set_name一定要和前端表单中的name属性一致。
let username = queryString.parse(postParams).set_name;
let userpwd = queryString.parse(postParams).set_pwd;
// 添加数据添加实例,使用SQL语句
let addSql = 'INSERT INTO userinfo (userName,userPwd) VALUES(?,?)';
let addSqlParams = [username, userpwd];
connection.query(addSql, addSqlParams, function (result, fields) {
console.log('添加成功!')
});
});
response.end('恭喜!注册成功!'); //返回响应
});
// 监听端口
sever.listen(8080);
console.log("服务器启动成功!");
正如大家看到的,代码中的注释已经很详细。给出思路:后端获取用户填写完并提交的表单数据,将表单数据添加到数据库的数据表。这里给出数据表供参考。
看一下我预先准备好的数据库中的数据表。数据库名test(后面数据库封装的配置项里可以看到),数据表名userinfo

(3)使用到的封装数据库,看过我上一篇博文的读者可以忽略下面的内容。(因为这里和上一篇是一样的哈哈哈)
因为如果在使用中每次都写一堆代码用于数据库链接之类的操作,机会显得很冗余,于是我参考其他博友的代码对数据库链接操作分为两个文件进行封装。
数据库配置封装文件 mysql.config.js

//配置链接数据库参数
module.exports = {
host: 'localhost',
port: 3306,//端口号
database: 'test',//数据库名
user: 'root',//数据库用户名
password: '123456'//数据库密码
};

数据库链接封装文件 mysql.js

let mysql = require('mysql');//引入mysql模块
let databaseConfig = require('./mysql.config'); //引入数据库配置模块中的数据
//向外暴露方法
module.exports = {
query: function (sql, params, callback) {
//每次使用的时候需要创建链接,数据操作完成之后要关闭连接
let connection = mysql.createConnection(databaseConfig);
connection.connect(function (err) {
if (err) {
console.log('数据库链接失败');
throw err;
}
//开始数据操作
//传入三个参数,第一个参数sql语句,第二个参数sql语句中需要的数据,第三个参数回调函数
connection.query(sql, params, function (err, results, fields) {
if (err) {
console.log('数据操作失败');
throw err;
}
//将查询出来的数据返回给回调函数
callback && callback(results, fields);
//results作为数据操作后的结果,fields作为数据库连接的一些字段
//停止链接数据库,必须再查询语句后,要不然一调用这个方法,就直接停止链接,数据操作就会失败
connection.end(function (err) {
if (err) {
console.log('关闭数据库连接失败!');
throw err;
}
});
});
});
}
};

上面的两个文件已经在数据库查询实例中const connection = require("./mysql.js");调用了。
至此,我们的Node.js作为后端实现用户注册的功能已经实现了。当然,在实际的生产环境中,还有许多的地方需要修改,比如数据安全传输,用户注册的信息检测等等。
Node.js实现前后端交互——用户注册的更多相关文章
- Node.js实现前后端交换——用户登陆
最近学习了一点Node.js的后端知识,于是作为一个学习前端方向的我开始了解后端,话不多说,开始介绍.首先,如果你想要更好的理解这篇博客,你需要具备html,css,javascript和Node.j ...
- 用node研究axios前后端交互状态码规则
研究状态码规则围绕我的脑袋有些时间了. 加上最近比较不忙,开始了这方面的研究. 后端用的是直接跑过的node框架,express.可以直接参考express官方网站:http://www.expres ...
- Node之简单的前后端交互
node是前端必学的一门技能,我们都知道node是用的js做后端,在学习node之前我们有必要明白node是如何实现前后端交互的. 这里写了一个简单的通过原生ajax与node实现的一个交互,刚刚学n ...
- js前后端交互
1.前后端交互模式 2.promise用法 (1)异步调用 (2)ajax回顾 (3).promise 优点:可以解决回调地狱(多层异步调用嵌套问题)(解决代码可读性低的问题) 提供简洁的api (4 ...
- thinkphp+jquery+ajax前后端交互注册验证
thinkphp+jquery+ajax前后端交互注册验证,界面如下 register.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- web前后端交互,nodejs
手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 web前后端交互 前后端交互可以采用混合 ...
- 三、vue前后端交互(轻松入门vue)
轻松入门vue系列 Vue前后端交互 六.Vue前后端交互 1. 前后端交互模式 2. Promise的相关概念和用法 Promise基本用法 then参数中的函数返回值 基于Promise处理多个A ...
- Django之META与前后端交互
Django之META与前后端交互 1 提交表单之GET 前端提交数据与发送 1)提交表单数据 2)提交JSON数据 后端的数据接收与响应 1)接收GET请求数据 2)接收POST请求数据 3)响应请 ...
- 百度ueditor的图片上传,前后端交互使用
百度ueditor的使用 一个文本编辑器,看了网上很多文档写的很乱,这里拾人牙慧,整理下怎么使用. 这个东西如果不涉及到图片附件上传,其实很简单,就是几个前端文件,直接引用,然后配置下ueditor. ...
随机推荐
- B - Ancient Cipher POJ - 2159 解题报告
内容: Ancient Roman empire had a strong government system with various departments, including a secret ...
- 2020.12.14--Codeforces Round #104 (Div.2)补题
C - Lucky Conversion CodeForces - 146C Petya loves lucky numbers very much. Everybody knows that luc ...
- HTTP状态码 详细解析汇总
一.状态码的类别: 类别 原因短语1XX Informational(信息性状态码) 接受的请求正在处理2XX Success(成功状态码) 请求正常处理完毕3XX Redirection(重定向状态 ...
- logging的基本使用
logging模块打印log的时候主要有一下几个,级别顺序:CRITICAL>ERROR>WARNING>INFO>DEBUG: 1.日志输出到file: import log ...
- 初学Python-day11 函数4
函数 1.递归函数 自己不断调用自己的过程 2.递归求和 1 def sum(arg): 2 if arg == 1: 3 return 1 4 return arg + sum(arg - 1) 5 ...
- 防止SQL注入总结
1.预编译(占位符)可以很大程度上防止SQL注入 预编译的原理是数据库厂商提供的JAR包中,对参数进行了转义 2.mybatis中,能用# 的地方,不用$,因为#是预编译占位符形式,可以防止SQL注入 ...
- Codeforces Round #573 (Div. 2) D题题解
一.题目 Tokitsukaze, CSL and Stone Game Tokitsukaze和CSL正在玩一些石头游戏. 一开始,有n堆的石头,第i堆石头数记为 \(a_i\),两人轮 ...
- geos编译问题
gdal编译geos的时候会用到geos_c_i.lib这个文件,我用cmake编译的时候仅仅产生geos_c.lib这个文件,所以只能使用nmake的编译方式来编译geos库,nmake编译geos ...
- Swift-技巧(一)缩放并填充图片
摘要 直接操作图片来实现它的缩放或者填充多余空间,首选 UIGraphicsBeginImageContext 函数来实现,它就相当于一个画布,你甚至可以用它来涂鸦. 最近有一个需求,就是将图片先等比 ...
- MySql表、约束、视图
MySql表.约束.视图 索引组织表 在InnoDB存储引擎中,表都是根据主键顺序组织存放的,这种存储方式的表成为索引组织表(index organized table). 每张表都有主键,如果创建表 ...