node.js(node.js+mongoose小案例)_实现简单的注册登录退出
一、前言? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?
通過node.js基本知識對node.js基本知識的一個簡單應用
? ? ? ? ? ? ? ? ? ? ? ? ? ? 1、注冊
? ? ? ? ? ? ? ? ? ? ? ? ? ? 2、登錄
? ? ? ? ? ? ? ? ? ? ? ? ?? ? 3、退出? ? ? ??? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??
二、基本內容? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?
1、項目結構搭建如圖所示
?
?
2、這個小案列中用到了art-template子模板以及模板的繼承 可以參考官網:art-template.org
? ? ?發現很多網站的頁面的頭部和尾部都是一樣的,所以我們可以將頭部和尾部提取出來,用art-template子模板,弄到一個單獨頁面中,其他頁面繼承這個頁面
? ?
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><title>{{block 'title'}}默認標題{{/block}}</title><link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">{{block 'head'}}{{/block}} </head><body>{{include '../_partials/header.html'}} <!--用子模板引入頭部-->{{block 'body'}}{{/block}}{{include '../_partials/footer.html'}} <!--用子模板引入尾部--><script src="/node_modules/jquery/dist/jquery.js"></script><script src="/node_modules/bootstrap/dist/js/bootstrap.js"></script>{{block 'script'}}{{/block}} </body></html>
?
?
3、先安裝依賴包快速搭建一個服務:
? ? ?express
? ? express-art-template? ? ?
? ? path :可以幫助我們操作路徑,這里如果我們的項目放到別人的電腦上,如果用原來的方法就可能存在路徑找不到的情況
? ? art-template
var express = require('express') //引入path包 var path = require('path') var app = new express();//配置express-art-template app.engine('html', require('express-art-template'))//開放靜態資源 app.use('/public/', express.static(path.join(__dirname, './public/'))) app.use('/node_modules/', express.static(path.join(__dirname, './node_modules/')))app.get('/', function (req, res){res.render('index.html') })app.listen(5000, function (){console.log('server') })
?
4、設計路由
?
|   路徑  |   方法  |   Get參數  |   Post參數  |   是否需要登錄  |   備注  | 
|   /  |   GET  |   ?  |   ?  |   ?  |   渲染首頁  | 
|   /register  |   GET  |   ?  |   ?  |   ?  |   渲染注冊頁  | 
|   /register  |   POST  |   ?  |   Uername,password,nickname  |   ?  |   處理注冊信息  | 
|   /login  |   GET  |   ?  |   ?  |   ?  |   渲染登錄頁  | 
|   /login  |   post  |   ?  |   Username,password  |   ?  |   處理登錄請求  | 
|   /logout  |   get  |   ?  |   ?  |   ?  |   退出登錄  | 
?
?
? 5、將路由寫在單獨的一個模塊里面
? ? ?(1)搭好路由殼子
var express = require('express')var router = express.Router() //渲染首頁 router.get('/',function (req, res) {})//渲染注冊頁 router.get('/register',function (req, res) {}) //處理注冊請求 router.post('/register',function (req, res) {}) //渲染登錄頁 router.get('/login',function (req, res) {}) //處理登錄頁 router.post('/login',function (req, res) {}) //退出 router.get('/logout',function (req, res) {})//掛載導出 module.exports = router
? ? ?(2)app.js中引入router.js
??
//引入 var router = require('./router') //使用 app.use(router)
?
6、設計mongose數據庫模型
? ? ?(1)注冊的時候需要用到mongodb數據庫
? ? ? 安裝:cnpm install mongoose
? ? ? 引入:var mongoose = require("mongoose")
? ? ? 開啟數據庫:mongo
? ? ?(2)根據可能顯示的用戶信息設計數據庫模型,并且將這個模型放到單獨的一個models目錄下面? ??
var mongoose = require('mongoose')// 連接數據庫 mongoose.connect('mongodb://localhost/test', { useMongoClient: true })var Schema = mongoose.Schemavar userSchema = new Schema({email: {type: String,required: true},nickname: {type: String,required: true},password: {type: String,required: true},created_time: {type: Date,// 注意:這里不要寫 Date.now() 因為會即刻調用// 這里直接給了一個方法:Date.now// 當你去 new Model 的時候,如果你沒有傳遞 create_time ,則 mongoose 就會調用 default 指定的Date.now 方法,使用其返回值作為默認值default: Date.now},last_modified_time: {type: Date,default: Date.now},avatar: {type: String,default: '/public/img/avatar-default.png'},bio: {type: String,default: ''},gender: {type: Number,enum: [-1, 0, 1],default: -1},birthday: {type: Date},status: {type: Number,// 0 沒有權限限制// 1 不可以評論// 2 不可以登錄enum: [0, 1, 2],default: 0} })module.exports = mongoose.model('User', userSchema)數據庫模型
? ? ?(3)在router.js中引入數據庫
var User = require('./models/user')
?
7、數據庫模型設計好了之后處理注冊事件
? ? ?注冊響應主要包含以下幾個邏輯
? ? ?(1)當用戶發送get請求的時候會跳轉到注冊頁面,
? ? ?(2)用戶輸入注冊信息,輸入的注冊信息會和數據庫中的信息進行查找對比
? ? ?(3)如果數據庫中存在這個用戶信息,則提示用戶 “用戶名已存在”
? ? ?(4)如果數據庫中不存在這用戶信息,則可以注冊,并將信息保存在session中
? ? ?(5)注冊完成之后頁面跳到首頁,并且在頁面右上角顯示用戶名, 此時登錄/注冊按鈕隱藏
?
?
?
? ? (1)點擊注冊的時候跳轉到注冊頁面
router.get('/register',function (req, res) {res.render('register.html') })
? ??
?
? (2)客戶端發送ajax請求,
$('#register-form').on('submit', function (e){//將提交的表單數據鍵值對序列化可以提交的字符串var formData = $(this).serialize()$.ajax({url: '/register',type: 'post',data: formData,dataType: 'json',success: function (data) {var err_code = data.err_codeif(err_code === 0) {//如果注冊成功,則進行表單重定向window.location.href('/')}else if(err_code === 1) {window.alert('郵箱已存在!')} else if (err_code === 500) {window.alert('服務器忙,請稍后重試!')}}}) })
?
? (3)服務端接受到客戶端提交過來的數據,將受到的數據到mongose數據庫中查詢
router.post('/register', function (req, res) {//保存收到的數據var body = req.body//查詢 User.findOne({$or: [{ email: body.email},{ nickname: body.nickname}]}, function (err, data) {//判斷if(err) {//這里一定要響應json格式的字符串,客戶端才收的到return res.status(500).json({success: false,message: "服務器出錯"})}//如果查詢到了,就提示郵箱或者昵稱已經存在if(data) {return res.status(200).json({err_code: 1,message:"郵箱或者用戶名已經存在"})}//執行到這里,不存在,就可以注冊new User(body).save(function (err, data) {if(err) {return res.status(500).json({err_code: 500,message: 'Internal error.'})}res.session.user = body; //這里用express保存注冊的信息return res.status(200).json({err_code:0,message: '注冊成功'})})}) })
(4)注意點:ajax的dataType是json格式的, 如果服務端給我們響應的數據不是json格式,客戶端就接受不到
? ? ? ? ? ? ? ? ? ? ? ? express中提供了一個json()函數,會自動將字符串轉化為json格式
? ? ? ? ? ? ? ? ? ? ? ?這里用到了express-session,來保存用戶信息
?
5、登錄
? ? 服務端接收到了請求數據,然后在數據庫中進行查詢
router.post('/login',function (req, res) {var body = req.body;//查找 User.findOne({email: body.email,password: body.password},function (err, user){if(err) {return res.status(500).json({err_code:500,message: 'err'})}if(!user) {return res.status(200).json({err_code: 1,message: '郵箱或者密碼錯誤'})}res.session.user = user //記錄此時的登錄信息return res.status(200).json({err_code: 0,message: 'success'})}) })
客戶端接受到了服務端的數據響應
<script>$('#login_form').on('submit', function (e) {e.preventDefault()var formData = $(this).serialize()console.log(formData)$.ajax({url: '/login',type: 'post',data: formData,dataType: 'json',success: function (data) {console.log(data)var err_code = data.err_code;if (err_code === 0) {window.alert('登錄成功')window.location.href='/'}else if (err_code === 1) {window.alert('郵箱或密碼錯誤');}else if(err_code === 500){window.alert('服務繁忙,稍后請重試')}}})})</script>
?
6、退出的時候只要清除session就可以
//退出 router.get('/logout',function (req, res) {req.session.user = null;res.redirect('/') })
?
? ??
?
?
三、總結? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?
1、ajax中的dataType為json, 如果服務器響應的數據步數json格式的,在ajax中接受不到這個信息
2、服務器默認只能重定向只針對同步請求有效, 對異步請求無效
?
轉載于:https://www.cnblogs.com/xxm980617/p/10575305.html
總結
以上是生活随笔為你收集整理的node.js(node.js+mongoose小案例)_实现简单的注册登录退出的全部內容,希望文章能夠幫你解決所遇到的問題。
                            
                        - 上一篇: 求一个不想写作业的个性签名。
 - 下一篇: 虎皮多少钱啊?