一、引言

在数据库和静态页面都创建好之后,下面就该接着完成后台Node.js监听注册和登录的部分了。这个部分主要使用的技术是:Node.js的Express框架和ajax异步请求。登录和注册的代码实现过程基本相同,现在重点以注册监听为例进行叙述。

二、js文件-功能实现

  • 在注册按钮<input......>中添加id:bg-register,提供监听接口,然后在js/register.js文件中监听“注册”按钮的单击事件,并使用ajax将客户端数据异步提交给服务器
<div class="form-group">
<div class="col-sm-5 col-sm-offset-2">
<input id="bt-register" class="btn btn-success btn-block" type="button" value="注册">
</div>
</div> <script src="js/register.js"></script>
//监听“注册”按钮的单击事件
$('#bt-register').click(function(){
var n = $('#uname').val();//用户名
var p = $('#upwd').val();//密码
//将客户端数据异步提交给服务器
$.ajax({
type:'POST',
url:'/user/register',
data:{uname:n,upwd:p},
success:function(result){
if(result.code===1){
alert('注册成功!3s后自动跳转到登录页面...')
setTimeout(function(){
location.href='login.html';
},3000);
}else{
alert('注册失败!请稍后重试!')
}
},
error:function(result){}
})
});
  • 找到主程序app.js,向客户端提供动态资源的响应
/*整个项目的主模块文件:
* 负责创建web服务器对象,监听指定端口
* 并向客户端提供静态资源+动态资源服务*/ //mysql连接数据库会另建模块对应订单等页面,
//这里主模块只负责创建web服务器
const http = require('http');
const express = require('express');
const user = require('./user'); var app = express();//请求处理函数
http.createServer(app).listen(8080); //向客户端提供静态资源的响应
app.use(express.static('public')); //向客户端提供动态资源的响应
app.post('/user/register',user.register);
app.post('/user/login',user.login);
  • 在app.js同级目录,创建自定义模块use.js,向外提供login()和register()两个请求处理函数,并且接收客户端POST提交的请求数据:uname、upwd保存入数据库,向客户端返回JSON字符串
/**用户相关功能模块
* 向外提供
* login()和register()
* 两个请求处理函数**/ const qs = require('querystring'); //使用qs模块解析POST数据
const pool = require('./dbpool'); //使用连接池模块获取连接 module.exports = {
//接收POST提交的请求数据:uname、upwd
//保存入数据库,返回JSON字符串,形如:
// {"code":1,"msg":"注册成功","uid":31} register:(req,res)=>{
//读取POST数据:req.on('data',(buf)=>{})
req.on('data',(buf)=>{
//解析出请求数据
var obj = qs.parse(buf.toString());
//获取数据库连接,提交SQL给数据库
pool.getConnection((err,conn)=>{
conn.query('INSERT INTO t_login VALUES (NULL,?,?)',[obj.uname,obj.upwd],(err,result)=>{
var output = {//要输出给客户端的数据
code:1,
msg:'注册成功',
uid:result.insertId
};
res.json(output);//把数据转换为JSON字符串并输出
conn.release();
})
});
})
},
login:(req,res)=>{
req.on('data',(buf)=>{
var obj = qs.parse(buf.toString());
pool.getConnection((err,conn)=>{
conn.query(
'SELECT uid FROM t_login WHERE uname=? AND upwd=?',[obj.uname,obj.upwd],
(err,result)=>{
if(result.length>0){//查询到数据了
var output = {
code:1,
msg:'登录成功',
uid:result[0].id
}
}else{//未查询到数据
var output ={
code:2,
msg:'用户名或密码错误'
}
}
res.json(output);//把数据转化为JSON
conn.release(); })
})
})
}
}
  • 因为注册和登录需要很多的数据库访问,所以在app.js同级目录下,还要再创建一个自定义数据库连接池模块dbpool.js,向外提供pool对象。
/**数据库连接池模块
* 向外提供pool对象**/
const mysql = require('mysql'); var pool = mysql.createPool({
host:'127.0.0.1',
user:'root',
password:'',
database:'jd',
port:3306,
connectionLimit:5 //连接池最大容量 一般5~10个
}); module.exports = pool;

三、测试-实现效果

只运行主执行程序app.js即可,然后在127.0.0.1:8080/.......地址端访问测试,效果如下:

数据库 t_login表中添加数据   成功:

app.js   主程序成功运行界面

用刚刚注册的账号  登录


注:转载请注明出处

最新文章

  1. Emmet使用
  2. Bomb
  3. POJ 2449 Remmarguts&#39; Date --K短路
  4. 最大似然估计(MLE)与最小二乘估计(LSE)的区别
  5. IOS中nil/Nil/NULL的区别
  6. 基于u盘安装centos6.0
  7. MFC去掉win7玻璃效果
  8. ORACLE添加作业
  9. 06_Android中ArrayAdapter的使用
  10. [SqlServer]如何向数据库插入带有单引号(&#39;)的字符串
  11. NLP第八条
  12. 使用Open Live Write发布CSDN博客
  13. webpack学习笔记——publicPath路径问题
  14. JAVA 中BIO,NIO,AIO的理解 (转)
  15. 花十分钟,让你变成AI产品经理
  16. 50-2018 蓝桥杯省赛 B 组模拟赛(五)
  17. centos7 部署 docker compose
  18. BZOJ1263 [SCOI2006]整数划分 高精度
  19. python基础----&gt;python的使用(四)
  20. iPhone手机屏幕的尺寸180330更新

热门文章

  1. hdu 6199 沈阳网络赛---gems gems gems(DP)
  2. 多线程编程学习四(Lock 的使用).
  3. poj 1948二维01背包
  4. MySQL插入10万数据时间(结论:最快14.967s,每秒插入6681条)
  5. 结对实验---基于GUI的四则运算
  6. 201521123093 java 第四周学习总结
  7. 201521123019 《Java程序设计》第10周学习总结
  8. Web开发模式【Mode I 和Mode II的介绍、应用案例】
  9. temp-黄河农商行路径
  10. MultipleOutputs新旧api