How to implement the login and registration function using node.js and other technologies?

亚连
Release: 2018-06-12 14:29:36
Original
3730 people have browsed it

This article mainly introduces node.js express mySQL ejs bootstrop to implement the website login and registration function. It is very good and has reference value. Friends in need can refer to it

Comrades, after unremitting efforts, After checking various documents, I finally came up with a slightly decent node project. Of course, if you use it directly in the project, this demo is too simple. After all, a complete login registration has a lot of practical content. In this case, mySQL In the user list, for ease of understanding, only two fields, username and password, are set. For normal login and registration, there will definitely be more fields. But for those who are new to node, such as the author, I still learned a lot. Even nervously, I didn’t know what to write as follows. I must have made reference to many other teenagers’ blogs on the Internet. In the future, the login and registration demo will be based on the needs of the project. Improved,

The effect is as follows

How to implement the login and registration function using node.js and other technologies?

Effect.gif

Project structure

Main entrance app.js

app.js is the main entrance to the program. It is generally used to write the middleware and various settings we introduce.

var express = require('express'); // NodeJS中的Path对象,用于处理目录的对象,提高开发效率 var path = require('path'); // 用来定义网页logo的中间件 var favicon = require('serve-favicon'); // NodeJs中Express框架使用morgan中间件记录日志 // Express中的app.js文件已经默认引入了该中间件var logger = require('morgan'); // 使用app.use(logger('dev'));以将请求信息打印在控制台,便于开发调试, // 但实际生产环境中,需要将日志记录在log文件里 var logger = require('morgan'); // 存储登录信息中间件 var cookieParser = require('cookie-parser'); // 解析请求体的中间件 var bodyParser = require('body-parser'); // 引入模块的js文件 var routes = require('./routes/index'); // var users = require('./routes/user'); // 引入session中间件 var session=require('express-session'); // 创建项目示例 var app = express(); // 引入我们需要的模板 app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'ejs'); // 用摩记录请求 app.use(logger('dev')); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); // 利用cookieParser中间件存取信息 app.use(cookieParser("Luck")); // 利用session中间件存取信息 app.use(session({ secret:'luck', resave:false, saveUninitialized:true })); // 静态化我们的public文件下的文件,使其可以直接引用 app.use(express.static(path.join(__dirname, 'public'))); app.use('/', routes); // app.use('/users', users); // 捕捉404状态 app.use(function(req, res, next) { var err = new Error('Not Found'); err.status = 404; next(err); }); module.exports = app; app.listen(3000,'127.0.0.1') routes下的index.js文件 index.js这里我用来处理页面的路由跳转 var express = require('express'); var router = express.Router(); // 为数据库链接的js文件,可查询数据库中的用户名和密码等信息 var usr=require('netRequest/dbConnect'); // 获取首页登录信息 router.get('/', function(req, res) { if(req.cookies.islogin){ req.session.islogin=req.cookies.islogin; } if(req.session.islogin){ res.locals.islogin=req.session.islogin; } res.render('index', { title: 'HOME',test:res.locals.islogin}); }); // 登录页处理 router.route('/login') // get请求渲染页面 .get(function(req, res) { if(req.session.islogin){ res.locals.islogin=req.session.islogin; } if(req.cookies.islogin){ req.session.islogin=req.cookies.islogin; } res.render('login', { title: '用户登录' ,test:res.locals.islogin}); }) // post请求查询用户信息 .post(function(req, res) { client=usr.connect(); result=null; // 调用数据库方法 usr.selectFun(client, req.body.username, function (result) { if(result[0]===undefined){ res.send('没有该用户'); }else{ if(result[0].password==req.body.password){ req.session.islogin=req.body.username; res.locals.islogin=req.session.islogin; res.cookie('islogin',res.locals.islogin,{maxAge:60000}); res.redirect('/home'); }else{ res.redirect('/login'); } } }); }); // 退出登录页处理 router.get('/logout', function(req, res) { res.clearCookie('islogin'); req.session.destroy(); res.redirect('/'); }); // home页处理 router.get('/home', function(req, res) { if(req.session.islogin){ res.locals.islogin=req.session.islogin; } if(req.cookies.islogin){ req.session.islogin=req.cookies.islogin; } res.render('home', { title: 'Home', user: res.locals.islogin }); }); // 注册页处理 router.route('/reg') // get请求渲染页面 .get(function(req,res){ res.render('reg',{title:'注册'}); }) // post请求注册用户 .post(function(req,res) { client = usr.connect(); // 调用数据库方法 usr.insertFun(client,req.body.username ,req.body.password2, function (err) { if(err) throw err; res.send('注册成功'); }); }); module.exports = router; node_modules中netRequest/dbConnect.js
Copy after login

dbConnect.js

var mysql=require('mysql'); // 现在只是练习可以直接为数据库创建链接, // 用户多时需要创建连接池 function connectServer(){ var client=mysql.createConnection({ host:'172.16.20.103', port:3308, database:'test', user:'JRJ_Win', password:'FT%^$fjYR56' }) return client; } function selectFun(client,username,callback){ client.query('select password from win.luck_user where username="'+username+'"',function(err,results,fields){ if(err) throw err; callback(results); }); } function insertFun(client , username , password,callback){ client.query('insert into win.luck_user value(?,?)', [username, password], function(err,result){ if( err ){ console.log( "error:" + err.message); return err; } callback(err); }); } exports.connect = connectServer; exports.selectFun = selectFun; exports.insertFun = insertFun;
Copy after login

The rest is the page template

login.ejs

<%- include header %> 

<% if(locals.islogin) { %>

用户: <%= test %> 已经登陆。

退出登录 <% } else{ %>

<% } %>

<%- include footer %>
Copy after login

index.ejs

<%- include header %> 

<% if(locals.islogin){%>

用户:<%= test %>

已经登陆 <% }else{%>

请登录后查看

<%}%>

<%- include footer %>
Copy after login

reg .ejs

<%- include header %> 

<%- include footer %>
Copy after login

header.ejs

footer.ejs

  
Copy after login

The main code of the project is here. If you want to understand it, it will probably take a while.

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

How to fix the header and first column in Vue

How to use the image annotation component in jquery.picsign

How to package the koa2 framework app through webpack? What should I do?

Detailed interpretation of Vue component development ideas

Detailed interpretation of how to use components and their functions in Vue.js?

The above is the detailed content of How to implement the login and registration function using node.js and other technologies?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!