node.js 个人博客系统

ゝ一世哀愁。 2022-11-05 00:50 229阅读 0赞

最新讲解版本请查看  
[https://yangyongli.blog.csdn.net/article/details/114364791][https_yangyongli.blog.csdn.net_article_details_114364791]

--------------------

### 文章目录 ###

*  项目
 *   *  展示
     *  链接
 *  实现
 *   *  1. npm
     *  2. 代码
     *   *  app.js
         *  router.js
         *  user.js
         *  register.html
         *  login.html

# 项目 #

## 展示 ##

![在这里插入图片描述][20210303181010324.gif_pic_center]

## 链接 ##

[https://download.csdn.net/download/weixin\_45525272/15545983][https_download.csdn.net_download_weixin_45525272_15545983]

GitHub今天上不去，就没往上发，过几天补上

# 实现 #

## 1. npm ##

npm init -y
    
    npm install art-template blueimp-md5 body-parser bootstrap express express-art-template express-session jquery mongoose

## 2. 代码 ##

### app.js ###

### router.js ###

### user.js ###

var mongoose = require('mongoose')
    
    // 连接数据库
    mongoose.connect('mongodb://localhost/test', {  useMongoClient: true })
    
    var Schema = mongoose.Schema
    
    var 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)

### register.html ###

<!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <title>用户注册</title>
      <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
      <link rel="stylesheet" href="/public/css/login.css">
    </head>
    
    <body>
      <div class="main">
        <div class="header">
          <a href="/">
            <img src="/public/img/logo3.png" alt="" width="100px">
          </a>
          <h1>用户注册</h1>
        </div>
        
        <form id="register_form" method="post" action="/register">
          <div class="form-group">
            <label for="email">邮箱</label>
            <input type="email" class="form-control" id="email" name="email" placeholder="Email" autofocus>
          </div>
          <div class="form-group">
            <label for="nickname">昵称</label>
            <input type="text" class="form-control" id="nickname" name="nickname" placeholder="Nickname">
          </div>
          <div class="form-group">
            <label for="password">密码</label>
            <input type="password" class="form-control" id="password" name="password" placeholder="Password">
          </div>
          <button type="submit" class="btn btn-success btn-block">注册</button>
        </form>
        <div class="message">
          <p>已有账号? <a href="/login">点击登录</a>.</p>
        </div>
      </div>
      <script src="/node_modules/jquery/dist/jquery.js"></script>
      <script> $('#register_form').on('submit', function (e) { e.preventDefault() var formData = $(this).serialize() $.ajax({ url: '/register', type: 'post', data: formData, dataType: 'json', success: function (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 === 2) { window.alert('昵称已存在！') } else if (err_code === 500) { window.alert('服务器忙，请稍后重试！') } } }) }) </script>
    </body>
    
    </html>

### login.html ###

<!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <title>用户登录</title>
      <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
      <link rel="stylesheet" href="/public/css/login.css">
    </head>
    
    <body>
      <div class="main">
        <div class="header">
          <a href="/">
            <img src="/public/img/logo3.png" alt="" width="100px">
          </a>
          <h1>用户登录</h1>
        </div>
        <form id="login_form">
          <div class="form-group">
            <label for="">邮箱</label>
            <input type="email" class="form-control" id="" name="email" placeholder="Email" autofocus>
          </div>
          <div class="form-group">
            <label for="">密码</label>
            <a class="pull-right" href="">忘记密码？</a>
            <input type="password" class="form-control" id="" name="password" placeholder="Password">
          </div>
          <div class="checkbox">
            <label>
              <input type="checkbox">记住我
            </label>
          </div>
          <button type="submit" class="btn btn-success btn-block">登录</button>
        </form>
        <div class="message">
          <p>没有账号? <a href="/register">点击创建</a>.</p>
        </div>
      </div>
      <script src="/node_modules/jquery/dist/jquery.js"></script>
      <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) { 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>
    </body>
    
    </html>

[https_yangyongli.blog.csdn.net_article_details_114364791]: https://yangyongli.blog.csdn.net/article/details/114364791
[20210303181010324.gif_pic_center]: /images/20221023/8838d515e6424a528550862c371c4f4a.png
[https_download.csdn.net_download_weixin_45525272_15545983]: https://download.csdn.net/download/weixin_45525272/15545983