码小余の博客
码小余の博客

Node项目实战开发-博客系统

Nodejs项目实战开发-博客系统（已完结）

个人博客系统
欢迎访问我的博客~
MaXiaoYu’s Bolg

前言：

开发技术

技术 版本
Node ^14.3.0
ejs ^3.1.3
express ^4.17.1
cookie-session ^1.4.0
mysql ^2.18.1

开发工具

技术 版本
VSCode ^1.47.3.0
MySql ^8.0.12
PhpStudy ^8.1.0.7

第一阶段 博客前台

第二阶段 博客后台

博客前台 项目环境搭建

首先初始化项目

在终端输入命令

npm init

会生成一个 package.json 文件

安装一系列第三方npm模块

npm i express
npm i ejs
npm i mysql

会生成一个 package-lock.json 文件

创建一系列文件

新建index.js文件

/**
 * 入口函数
 */
const express = require("express");
// 创建主应用
const app = express();

// 模板引擎的设置
app.set("view engine", "html");
app.set("views", `${
       __dirname}/views`);
app.engine("html", require("ejs").renderFile); // 用ejs模板渲染html

// 静态资源配置
app.use(express.static("static"));

// 监听服务器
app.listen(3000);

修改 package.json 文件

"scripts": {
     
  "test": "echo \"Error: no test specified\" && exit 1"
},

自定义启动命令

把上面的代码改成以下代码

"scripts": {
     
  "start": "node index.js"
},

新建static目录

静态资源目录

里面存放 css js img 等等的静态资源

新建views目录

模板目录

里面存放模板文件

新建router目录

子应用目录

将我们的程序进行模块化管理，每一个模块都将视为一个子应用

新建middleware目录

中间件目录

与路由器配套的一些操作方法，在路由加载页面之前获取所需要的一些数据

新建model目录

数据模型目录

操作数据库的一些文件

这些文件之间的一些关系

从数据库中进行增删改查，把得到的一些数据返回给中间件，由中间件返回给路由，由路由进行页面的渲染和加载，最后返回给客户端

博客前台 模板文件导入

在views目录和static目录下导入文件

导入完成之后可以把重复的代码提取出来，进行简化处理

<%- include('header.html') -%>
html代码不重复的部分
<%- include('footer.html') -%>

在router目录下新建index.js文件

/**
 * 首页子应用（首页路由）
 */

const express = require("express");
// 首页子应用
const indexApp = express();

indexApp.get("/", (req, res) => {
     
  res.render("index");
});

// 把这个子应用导出去
module.exports = indexApp;

然后在myblog下的 index.js 中调用首页子应用

// 调用首页子应用
app.use(/\/(index)?/, require("./router/index"));

启动服务

node index.js

浏览器输入127.0.0.1:3000 出现以下页面说明搭建成功

Node项目实战开发-博客系统_第1张图片

博客前台 封装数据库操作

在model目录下新建 model.js 文件

const mysql = require("mysql");

/**
 * 数据模型的基类
 * 封装了数据库操作
 */
module.exports = class Model {
     
  // 连接对象
  static conn = null;

  /**
   * 数据库连接方法
   */
  static connection() {
     
    Model.conn = mysql.createConnection({
     
      host: "127.0.0.1",
      user: "root",
      password: "lijiazhao123",
      database: "blog",
    });
    Model.conn.connect((err) => {
     
      if (err) {
     
        console.log(`数据库连接失败：${
       err.message}`);
      }
    });
  }

  /**
   * 关闭数据库连接
   */
  static end() {
     
    if (null != Model.conn) {
     
      Model.conn.end();
    }
  }

  /**
   * 通用查询方法
   * @param {string} sql 要执行的SQL语句
   * @param {Array} params 给SQL语句的占位符进行赋值的参数数组
   */
  static query(sql, params = []) {
     
    return new Promise((resolve, reject) => {
     
      this.connection();

      Model.conn.query(sql, params, (err, results) => {
     
        if (err) {
     
          reject(err);
        } else {
     
          resolve(results);
        }
      });

      this.end();
    });
  }
};

在model目录下新建 article.js 文件

/**
 * 文章数据模型
 */
module.exports = class Article extends require("./model") {
     
  /**
   *
   * @param {integer} num 条目数
   */
  static getHot(num) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,content,`time` FROM article WHERE hot = 1 LIMIT ?";
      this.query(sql, num)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取热门文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }
};

在middleware目录下新建 article.js 文件

const Article = require("../model/article");

/**
 * 文章中间件
 */
module.exports = {
     
  /**
   * 获取热门文章
   */
  getHot: (req, res, next) => {
     
    Article.getHot(3)
      .then((results) => {
     
        req.hots = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
};

再由中间件返回给路由

将router目录下的 index.js 进行修改

/**
 * 首页子应用（首页路由）
 */

const express = require("express");
const article = require("../middleware/article");

// 首页子应用
const indexApp = express();

indexApp.get("/", [article.getHot], (req, res) => {
     
  res.render("index", {
      hots: req.hots });
});

// 把这个子应用导出去
module.exports = indexApp;

启动服务显示以下页面

Node项目实战开发-博客系统_第2张图片

发现这个时间的格式有点别扭，修改为本地时间

<%= hot.time.toLocaleString() %>

发现这个内容有点别扭

<%= hot.content.replace(/<[^>]+>/g,"").substring(0,100) %>

修改后如下图：

Node项目实战开发-博客系统_第3张图片

博客前台 首页最新博文

数据库查询

在model目录下的 article.js 文件中新增以下方法

/**
  * 获取文章列表
  */
  static getList() {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,content,`time` FROM article ORDER BY time DESC";
      this.query(sql)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

把查询到的数据交给中间件

在middleware目录下的 article.js 文件中新增以下方法

/**
  * 获取最新文章
  */
  getList: (req, res, next) => {
     
    Article.getList()
      .then((results) => {
     
        req.articles = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在由中间件交给路由渲染到页面中

在router目录下的 index.js 文件中修改以下代码

indexApp.get("/", [article.getHot, article.getList], (req, res) => {
     
  let {
      hots, articles } = req;
  res.render("index", {
      hots, articles });
});

开启服务，出现以下页面

Node项目实战开发-博客系统_第4张图片

博客前台 导航条

数据库查询

在model目录下新建 category.js 文件

/**
 * 文章类目数据模型
 */
module.exports = class Category extends require("./model") {
     
  /**
   * 获取文章类目列表
   */
  static getList() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT id,`name` FROM category ORDER BY `index` DESC";
      this.query(sql)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取文章类目列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }
};

把查询到的数据交给中间件

在middlewar目录下新建 category.js 文件

const Category = require("../model/category");

/**
 * 文章类目中间件
 */
module.exports = {
     
  /**
   * 获取文章类目列表
   */
  getList: (req, res, next) => {
     
    Category.getList()
      .then((results) => {
     
        req.categories = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
};

在由中间件交给路由渲染到页面中

修改router目录下的 index.js 文件

/**
 * 首页子应用（首页路由）
 */

const express = require("express");
const article = require("../middleware/article");
const category = require("../middleware/category");

// 首页子应用
const indexApp = express();

indexApp.get(
  "/",
  [article.getHot, article.getList, category.getList],
  (req, res) => {
     
    let {
      hots, articles, categories } = req;
    res.render("index", {
      hots, articles, categories });
  }
);

// 把这个子应用导出去
module.exports = indexApp;

修改views下的 header.html 文件

用ejs模板来显示路由渲染过来的数据

<% categories.forEach(category => { %>
    <li class="nav-item">
        <a class="nav-link" href="#"><%= category.name %> a>
    li>
<% }) %>

启动服务。显示页面如下

Node项目实战开发-博客系统_第5张图片

博客前台 文章列表

在model目录下的 article.js 文件中新增方法

/**
   * 获取指定类目下的文章列表
   * @param {integer} id 类目编号
   */
  static getListByCategoryId(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,content,`time` FROM article WHERE category_id = ? ORDER BY time DESC";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取指定类目下的文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下的 article.js 文件新增属性

/**
   * 获取指定类目下的文章
   */
  getListByCategoryId: (req, res, next) => {
     
    /**
     * http://127.0.0.1:3000/article/list/1
     * 获取路由下的id - 此时id为1
     */
    let id = req.params.id;
    Article.getListByCategoryId(id)
      .then((results) => {
     
        req.articles = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在router目录下新建 article.js 文件

/**
 * 文章子应用
 */
const express = require("express");
const article = require("../middleware/article");
const category = require("../middleware/category");

// 文章子应用
const articleApp = express();

articleApp.get(
  "/list/:id",
  [article.getListByCategoryId, category.getList],
  (req, res) => {
     
    let {
      articles, categories } = req;
    res.render("list", {
      articles, categories });
  }
);

module.exports = articleApp;

修改views目录下的 list.html 文件

<% articles.forEach(article => { %>
    <div class="col my-3">
      <div class="card h-100">
        <img src="holder.js/100px150" class="card-img-top" alt="..." />
        <div class="card-body">
          <h5 class="card-title"><%= article.title %>h5>
          <p class="card-text">
            <small class="text-muted"
              ><%= article.time.toLocaleString() %>small
            >
          p>
          <p class="card-text">
            <%= article.content.replace(/<[^>]+>/g,"").substring(0,100) %>...
          p>
          <a href="#" class="stretched-link">a>
        div>
      div>
    div>
<% }) %>

最后在myblog目录下的 index.js 入口函数中新增

app.use("/article", require("./router/article"));

启动服务，浏览器访问 http://127.0.0.1:3000/article/list/1 ，出现以下页面

Node项目实战开发-博客系统_第6张图片

虽然现在输入url网址能够访问到指定类目列表，但是点击类目列表却不能访问

这时候应该去 header.html 模板文件中修改 href 路由

<% categories.forEach(category => { %>
    <li class="nav-item">
        <a class="nav-link" href="/article/list/<%= category.id %> "
           ><%= category.name %>
        a>
    li>
<% }) %>

然后就是修改当前栏目后面显示的数据

通过id查找数据库中的name，然后进行数据显示

在model目录下的 category.js 文件中新增方法

/**
   * 获取指定编号的类目详情
   * @param {integer} id 类目编号
   */
  static getCategoryById(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT id,`name`,`index` FROM category WHERE id = ?";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`获取指定编号的类目详情失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下新增属性

/**
   * 获取指定的类目详情
   */
  getCategoryById: (req, res, next) => {
     
    let id = req.params.id;
    Category.getCategoryById(id)
      .then((results) => {
     
        req.category = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

修改router目录下的 article.js 文件

articleApp.get(
  "/list/:id",
  [article.getListByCategoryId, category.getList, category.getCategoryById],
  (req, res) => {
     
    let {
      articles, categories, category } = req;
    res.render("list", {
      articles, categories, category });
  }
);

修改views目录下的 list.html 模板文件

<h2 class="mb-4">当前栏目：<%= category.name %>h2>

启动服务，出现以下页面

Node项目实战开发-博客系统_第7张图片

博客前台 文章搜索

在model目录下的 article.js 文件下新增方法

/**
   * 获取指定关键词的文章列表
   * @param {integer} keyword 搜索内容
   */
  static getListByKeyword(keyword) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,content,`time` FROM article WHERE title LIKE ? ORDER BY time DESC";
      this.query(sql, `%${
       keyword}%`)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取指定关键词的文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下的 article.js 文件中新增属性

/**
   * 获取指定类目下的文章
   */
  getListByKeyword: (req, res, next) => {
     
    /**
     * 要获取表单的keyword
     */
    let keyword = req.query.keyword;
    Article.getListByKeyword(keyword)
      .then((results) => {
     
        req.articles = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在router目录下新建文件 search.js

/**
 * 搜索子应用
 */
const express = require("express");
const article = require("../middleware/article");
const category = require("../middleware/category");

// 文章子应用
const searchApp = express();

searchApp.get("/", [article.getListByKeyword, category.getList], (req, res) => {
     
  let {
      articles, categories } = req;
  res.render("search", {
      articles, categories, keyword: req.query.keyword });
});

module.exports = searchApp;

修改views目录下的 search.html 模板文件

<%- include("header.html") -%>

<div class="container mt-5">
  <h2 class="mb-4">搜索结果（搜索词：<%= keyword %> ）h2>
  <div class="row row-cols-4">
    <% articles.forEach(article => { %>
    <div class="col my-3">
      <div class="card h-100">
        <img src="holder.js/100px150" class="card-img-top" alt="..." />
        <div class="card-body">
          <h5 class="card-title"><%= article.title %>h5>
          <p class="card-text">
            <small class="text-muted"
              ><%= article.time.toLocaleString() %>small
            >
          p>
          <p class="card-text">
            <%= article.content.replace(/<[^>]+>/g,"").substring(0,100) %>...
          p>
          <a href="#" class="stretched-link">a>
        div>
      div>
    div>
    <% }) %>
  div>
div>

<%- include('footer.html') -%>

修改views目录下的 header.html 文件的form表单

启动服务，搜索css出现以下页面

Node项目实战开发-博客系统_第8张图片

博客前台 文章详情

在router目录下新建 article.js 文件

// 文章详情页
articleApp.get("/:id", (req, res) => {
     
  let {
      categories } = req;
  res.render("article", {
      categories });
});

启动服务，在浏览器输入url网址 http://127.0.0.1:3000/article/1 会出现以下页面

Node项目实战开发-博客系统_第9张图片

在model目录下的 article.js 文件中新增方法

/**
   * 获取指定文章的详情
   * @param {integer} id 文章编号
   */
  static getArticleById(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT a.id,a.title,a.content,a.`time`,a.hits,a.category_id,c.`name` FROM article a,category c WHERE a.id = ? AND a.category_id = c.id";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`获取指定文章的详情失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下的 article.js 文件中新增属性

/**
   * 获取指定文章的详情
   */
  getArticleById: (req, res, next) => {
     
    let id = req.params.id;
    Article.getArticleById(id)
      .then((results) => {
     
        req.article = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

修改router目录下的 article.js 文件

// 文章详情页
articleApp.get("/:id", [article.getArticleById], (req, res) => {
     
  let {
      categories, article } = req;
  res.render("article", {
      categories, article });
});

修改views目录下的 article.html 文件

<%- include("header.html") -%>
<div class="container mt-4">
  <nav>
    <ol class="breadcrumb bg-white">
      <li class="breadcrumb-item"><a href="/">首页a>li>
      <li class="breadcrumb-item">
        <a href="/article/list/<%= article.category_id %>"
          ><%= article.name %>a
        >
      li>
      <li class="breadcrumb-item active"><%= article.title %>li>
    ol>
  nav>
  <div class="card">
    <div class="card-header bg-white">
      <h3 class="card-title m-0"><%= article.title %>h3>
      <p class="text-muted small mt-2 m-0">
        <span class="mr-3">发表时间：<%= article.time.toLocaleString() %>span>
        <span class="mr-1">点击：<%= article.hits %>span>
      p>
    div>
    
    <div class="card-body"><%- article.content %>div>
    <div class="card-footer bg-white border-0">
      <span class="badge badge-pill">标签1span>
      <span class="badge badge-pill">标签2span>
      <span class="badge badge-pill">标签3span>
      <span class="badge badge-pill">标签4span>
      <span class="badge badge-pill">标签5span>
    div>
  div>
  <nav>
    <ul class="pagination mt-3">
      <li class="page-item">
        <a class="page-link" href="#">上一篇：文章标题a>
      li>
      <li class="page-item ml-auto">
        <a class="page-link" href="#">下一篇：文章标题a>
      li>
    ul>
  nav>
div>

<%- include('footer.html') -%>

注意：<%- article.content %> 用 ‘-’ 可以解析HTML代码

然后更改各文件路由

按需求来更改路由即可

参考路由

href="/article/<%= article.id %>"

启动服务，基本完成文章跳转功能

博客前台 文章标签显示

在model目录下新建 tab.js 文件

/**
 * 标签数据模型
 */
module.exports = class Tab extends require("./model") {
     
  /**
   * 获取指定文章的标签列表
   * @param {integer} id 文章编号
   */
  static getListByArticleId(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT id,`name` FROM tabs WHERE article_id = ?";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取指定文章的标签列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }
};

在middleware目录下的 article.js 文件下新增属性

/**
   * 获取指定文章的标签列表
   */
  getListByArticleId: (req, res, next) => {
     
    let id = req.params.id;
    Tab.getListByArticleId(id)
      .then((results) => {
     
        req.tabs = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

修改router目录下的 article.js 文件

// 文章详情页
articleApp.get(
  "/:id",
  [article.getArticleById, article.getListByArticleId],
  (req, res) => {
     
    let {
      categories, article, tabs } = req;
    res.render("article", {
      categories, article, tabs });
  }
);

修改views目录下的 article.js 文件

<div class="card-footer bg-white border-0">
    <% tabs.forEach(tab => {
      %>
    <span class="badge badge-pill"><%= tab.name %> </span>
    <% }) %>
</div>

开启服务，出现以下页面

Node项目实战开发-博客系统_第10张图片

博客前台 上一篇下一篇

在model目录下的 article.js 文件中新建两个方法

/**
   * 获取上一篇文章
   * @param {integer} id 当前文章编号
   */
  static getPrevArticle(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title FROM article WHERE id < ? ORDER BY id DESC LIMIT 1";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`获取上一篇文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }

  /**
   * 获取下一篇文章
   * @param {integer} id 当前文章编号
   */
  static getNextArticle(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title FROM article WHERE id > ? ORDER BY id ASC LIMIT 1";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`获取下一篇文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下的 article.js 文件中新增两个属性

/**
   * 获取上一篇文章
   */
  getPrevArticle: (req, res, next) => {
     
    let id = req.params.id;
    Article.getPrevArticle(id)
      .then((results) => {
     
        req.prev = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
  /**
   * 获取下一篇文章
   */
  getNextArticle: (req, res, next) => {
     
    let id = req.params.id;
    Article.getNextArticle(id)
      .then((results) => {
     
        req.next = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

修改router目录下的 article.js 文件

// 文章详情页
articleApp.get(
  "/:id",
  [
    article.getArticleById,
    article.getListByArticleId,
    article.getPrevArticle,
    article.getNextArticle,
  ],
  (req, res) => {
     
    let {
      categories, article, tabs, prev, next } = req;
    res.render("article", {
      categories, article, tabs, prev, next });
  }
);

修改views目录下的 article.html 文件

<nav>
    <ul class="pagination mt-3">
      <% if (prev) { %>
      
      <li class="page-item">
        <a class="page-link" href="/article/<%= prev.id %>"
          >上一篇：<%= prev.title %>a
        >
      li>
      <% } %>
      
      <% if (next) { %>
      <li class="page-item ml-auto">
        <a class="page-link" href="/article/<%= next.id %>"
          >下一篇：<%= next.title %>a
        >
      li>
      <% } %>
    ul>
  nav>

开启服务，页面完成以下效果

Node项目实战开发-博客系统_第11张图片

博客前台 用户登录

首先在router目录下新建 login.js 文件

/**
 * 登录子应用（首页路由）
 */

const express = require("express");

// 登录子应用
const loginApp = express();

// 加载登录页面
loginApp.get("/", (req, res) => {
     
  res.render("login");
});

// 把这个子应用导出去
module.exports = loginApp;

在myblog目录下的 index.js 文件中调用登录子应用

// 调用登录子应用
app.use("/login", require("./router/login"));

在model目录下新建 user.js 文件

/**
 * 用户数据模型
 */
module.exports = class User extends require("./model") {
     
  /**
   * 用户登录
   * @param {string} username 登录账号
   * @param {string} password 登录密码
   */
  static login(username, password) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,username FROM `user` WHERE username=? AND `password`=?";
      this.query(sql, [username, password])
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`登录失败：${
       err.message}`);
          reject(err);
        });
    });
  }
};

因为用户登录不用中间件，所以直接在router目录下的 login.js 文件中实现登录操作

// 实现登录操作
loginApp.post("/", (req, res, next) => {
     
  let {
      username, password } = req.body;
  User.login(username, password)
    .then((results) => {
     
      if (results) {
     
        res.redirect("/");
      } else {
     
        res.render("login", {
      msg: "登录失败！用户名或密码错误" });
      }
    })
    .catch((err) => {
     
      next(err);
    });
});

把登录失败的数据映射到页面上

修改在views目录下的 login.html 文件

<div class="text-danger col offset-2"><%= msg %>div>

在myblog下的 index.js 文件中进行post请求处理

// POST请求处理
app.use(express.urlencoded({
      extended: true }));

开启服务，出现以下效果

[Node项目实战开发-博客系统_第12张图片

博客前台 Session与退出

安装cookie-session模块

npm i cookie-session

在myblog下的 index.js 文件中引入cookie-session

const session = require("cookie-session");

配置session

// SESSION配置
app.use(
  session({
     
    keys: ["secret"],
    maxAge: 1000 * 60 * 30, // cookie的生命周期
  })
);

修改router目录下的 login.js 文件的登录操作功能

用户登录后会把从数据库查询到的结果results保存到session的user中

// 实现登录操作
loginApp.post("/", (req, res, next) => {
     
  let {
      username, password } = req.body;
  User.login(username, password)
    .then((results) => {
     
      if (results) {
     
        // session存储（key=value）
        req.session.user = results;
        res.redirect("/");
      } else {
     
        res.render("login", {
      msg: "登录失败！用户名或密码错误" });
      }
    })
    .catch((err) => {
     
      next(err);
    });
});

在middleware目录下新建 auth.js 文件

/**
 * 权限中间件
 */
module.exports = {
     
  /**
   * 从session中读取用户
   */
  getUser: (req, res, next) => {
     
    // 从session中读取数据
    req.user = req.session.user;
    next();
  },
};

在 article.js 、 index.js 、 search.js 文件中都加入user，目的是为了使未登录的用户不能访问这些页面。

const auth = require("../middleware/auth");

articleApp.use(category.getList, auth.getUser);

// 文章列表页
articleApp.get(
  "/list/:id",
  [article.getListByCategoryId, category.getCategoryById],
  (req, res) => {
     
    let {
      articles, categories, category, user } = req;
    res.render("list", {
      articles, categories, category, user });
  }
);

// 文章详情页
articleApp.get(
  "/:id",
  [
    article.getArticleById,
    article.getListByArticleId,
    article.getPrevArticle,
    article.getNextArticle,
  ],
  (req, res) => {
     
    let {
      categories, article, tabs, prev, next, user } = req;
    res.render("article", {
      categories, article, tabs, prev, next, user });
  }
);

const auth = require("../middleware/auth");

indexApp.use(auth.getUser);

// 加载首页页面
indexApp.get(
  "/",
  [article.getHot, article.getList, category.getList],
  (req, res) => {
     
    let {
      hots, articles, categories, user } = req;
    res.render("index", {
      hots, articles, categories, user });
  }
);

const auth = require("../middleware/auth");

searchApp.use(auth.getUser);

searchApp.get("/", [article.getListByKeyword, category.getList], (req, res) => {
     
  let {
      articles, categories, user } = req;
  res.render("search", {
     
    articles,
    categories,
    keyword: req.query.keyword,
    user,
  });
});

修改views目录下的 header.html 文件，加入判断

如果user存在，说明已登录，则显示用户数据

如果user不存在，说明未登录，则显示登录

<ul class="navbar-nav ml-auto">
    <% if (user) { %>
        <li class="nav-item dropdown">
            <a
               class="nav-link dropdown-toggle"
               href="#"
               id="navbarDropdown"
               data-toggle="dropdown"
               >
                <%= user.username %>
                    a>
                <div class="dropdown-menu">
                    <a class="dropdown-item" href="/user/logout">退出a>
                div>
                li>
            <% } else { %>
                <li class="nav-item">
                    <a href="/login" class="nav-link">登录a>
        li>
   <% } %>
ul>

启动服务，用户未登录显示以下效果

Node项目实战开发-博客系统_第13张图片

用户已登录显示以下效果

Node项目实战开发-博客系统_第14张图片

在myblog目录下的 index.js 文件中实现退出登录

// 退出登录
app.get("/user/logout", (req, res) => {
     
  req.session.user = null;
  res.render("login", {
      msg: "退出成功" });
});

启动服务，实现以下效果

Node项目实战开发-博客系统_第15张图片

博客后台 功能介绍与模板整合

在views目录下新建admin后台管理目录

把需要的资源复制进来

同样，在static目录下新建admin目录

把需要的资源复制进来

把 pv.json 文件复制到myblog目录下

博客后台 模板管理

为了方便，把代码重复的部分提取到 header.html 模板中

<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
  <a class="navbar-brand" href="#">
    <img src="./static/img/logo.png" width="30" height="30" alt="" />
    个人中心
  a>
  <div class="navbar-nav">
    <a href="../index.html" class="nav-link">博客首页a>
  div>

  <ul class="navbar-nav ml-auto">
    <li class="nav-item dropdown">
      <a
        class="nav-link dropdown-toggle"
        href="#"
        id="navbarDropdown"
        data-toggle="dropdown"
      >
        admin
      a>
      <div class="dropdown-menu dropdown-menu-right">
        <a class="dropdown-item" href="#">个人中心a>
        <a class="dropdown-item" href="/user/logout">退出a>
      div>
    li>
  ul>
nav>

然后用ejs模板引入即可

在router目录下新建admin目录，在router/admin目录下新建 index.js 文件

/**
 * 后台首页
 */
const express = require("express");
const indexApp = express();

indexApp.get("/", (req, res) => {
     
  res.render("admin/index");
});

module.exports = indexApp;

在myblog目录下的 index.js 文件中调用后台首页

// 调用后台首页
app.use(/\/admin\/(index)?/, require("./router/admin/index"));

Node项目实战开发-博客系统_第16张图片

在middleware目录下的 auth.js 文件中新增属性

/**
   * 是否允许用户进入后台管理页
   */
  allowToAdmin: (req, res, next) => {
     
    let user = req.session.user;
    if (user) {
     
      req.user = user;
      next();
    } else {
     
      res.redirect("/login");
    }
  },

在 myblog/index.js 中加上进入后台的权限验证

// 进入后台的权限验证
app.use("/admin/?*", require("./middleware/auth").allowToAdmin);

这样写就可以使所有的后台页面都需要登录之后才能访问

修改 views/admin/header.html 文件

<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
  <a class="navbar-brand" href="#">
    <img src="/admin/img/logo.png" width="30" height="30" alt="" />
    个人中心
  a>
  <div class="navbar-nav">
    <a href="/" class="nav-link">博客首页a>
  div>

  <ul class="navbar-nav ml-auto">
    <li class="nav-item dropdown">
      <a
        class="nav-link dropdown-toggle"
        href="#"
        id="navbarDropdown"
        data-toggle="dropdown"
      >
        <%= user.username %>
      a>
      <div class="dropdown-menu dropdown-menu-right">
        <a class="dropdown-item" href="/admin">个人中心a>
        <a class="dropdown-item" href="/user/logout">退出a>
      div>
    li>
  ul>
nav>

Node项目实战开发-博客系统_第17张图片

在 views/header.html 中新增个人中心

<div class="dropdown-menu">
    <a class="dropdown-item" href="/admin">个人中心a>
    <a class="dropdown-item" href="/user/logout">退出a>
div>

博客后台 获取最后登录时间

在 model/user.js 文件中新增方法

/**
   * 最后一次登陆的时间
   */
  static lastLoginTime() {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT time FROM log WHERE handle = '登录' ORDER BY time DESC LIMIT 1";
      this.query(sql)
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`登录失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下新建 user.js 文件

/**
 * 用户中间件
 */
const User = require("../model/user");

module.exports = {
     
  /**
   * 最后一次登录时间
   */
  lastLoginTime: (req, res, next) => {
     
    User.lastLoginTime()
      .then((results) => {
     
        req.lastLoginTime = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
};

修改 router/admin/index.js 文件

/**
 * 后台首页
 */
const express = require("express");
const user = require("../../middleware/user");

const indexApp = express();

indexApp.get("/", [user.lastLoginTime], (req, res) => {
     
  let {
      user, lastLoginTime } = req;
  res.render("admin/index", {
      user, lastLoginTime });
});

module.exports = indexApp;

修改 views/admin/index.html 文件

<span>上次登录时间：<%= lastLoginTime.time.toLocaleString() %>span>

Node项目实战开发-博客系统_第18张图片

博客后台 访问量、博文和类目的统计

在model目录下新建 pv.js 文件

/**
 * 访问量数据模型
 */
module.exports = class PV extends require("./model") {
     
  /**
   * 获取总访问量
   */
  static getTotal() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT SUM(hits) AS total FROM pv";
      this.query(sql)
        .then((results) => {
     
          resolve(results[0].total);
        })
        .catch((err) => {
     
          console.log(`获取总访问量失败：${
       err.message}`);
          reject(err);
        });
    });
  }
};

在 model/article.js 文件中新增方法

/**
   * 总博文数
   */
  static getCount() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT COUNT(1) AS count FROM article";
      this.query(sql)
        .then((results) => {
     
          resolve(results[0].count);
        })
        .catch((err) => {
     
          console.log(`获取总博文数失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 model/category.js 文件中新增方法

/**
   * 总类目数
   */
  static getCount() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT COUNT(1) AS count FROM category";
      this.query(sql)
        .then((results) => {
     
          resolve(results[0].count);
        })
        .catch((err) => {
     
          console.log(`获取总类目数失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在middleware目录下新建 pv.js 文件

/**
 * 访问量中间件
 */
const Pv = require("../model/pv");

module.exports = {
     
  /**
   * 获取总访问量
   */
  getTotal: (req, res, next) => {
     
    Pv.getTotal()
      .then((results) => {
     
        req.pvTotal = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
};

在 middleware/article.js 文件中新建属性

/**
   * 获取总博文数
   */
  getCount: (req, res, next) => {
     
    Article.getCount()
      .then((results) => {
     
        req.articleCount = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 middleware/category.js 文件中新建属性

/**
   * 获取总类目数
   */
  getCount: (req, res, next) => {
     
    Category.getCount()
      .then((results) => {
     
        req.categoryCount = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

修改 router/admin/index.js 文件

/**
 * 后台首页
 */
const express = require("express");
const user = require("../../middleware/user");
const pv = require("../../middleware/pv");
const category = require("../../middleware/category");
const article = require("../../middleware/article");

const indexApp = express();

indexApp.get(
  "/",
  [user.lastLoginTime, pv.getTotal, category.getCount, article.getCount],
  (req, res) => {
     
    let {
      user, lastLoginTime, pvTotal, categoryCount, articleCount } = req;
    res.render("admin/index", {
     
      user,
      lastLoginTime,
      pvTotal,
      categoryCount,
      articleCount,
    });
  }
);

module.exports = indexApp;

修改 views/admin/index.html 文件

<div class="card-deck">
    <div class="card text-center">
        <div class="card-header bg-success text-white">总访问量div>
        <div class="card-body"><%= pvTotal %>div>
        div>
        <div class="card text-center">
            <div class="card-header bg-info text-white">总博文数div>
            <div class="card-body"><%= articleCount %>div>
        div>
        <div class="card text-center">
        <div class="card-header bg-warning text-white">总类目数div>
        <div class="card-body"><%= categoryCount %>div>
    div>
div>

Node项目实战开发-博客系统_第19张图片

博客后台 获取访问量趋势图数据

在 model/pv.js 文件中新建获取全部记录的方法

/**
   * 获取全部记录
   */
  static getAll() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT time,hits FROM pv ORDER BY time ASC";
      this.query(sql)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取全部记录失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/pv.js 文件中新建获取全部记录的属性

/**
   * 获取全部记录
   */
  getAll: (req, res, next) => {
     
    Pv.getAll()
      .then((results) => {
     
        req.pvs = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/index.js 文件中新建访问量接口

/**
 * 访问量接口
 */
indexApp.get("/pvs", [pv.getAll], (req, res) => {
     
  let {
      pvs } = req;
  let data = {
     };
  data.data = pvs;
  data.start = pvs[0].time;
  data.end = pvs[pvs.length - 1].time;
  res.json(data);
});

把 static/admin/js/public.js 文件中的url改为 /admin/index/pvs

let url = "/admin/index/pvs";

Node项目实战开发-博客系统_第20张图片

博客后台 管理导航处理

在 views/admin 目录下新建 navs.html 文件，是重复代码通用模板

<div class="col-2 bg-white border-right nav-left p-0">
  <div class="row text-center mt-3 px-5">
    <a href="./article/add.html" class="btn btn-primary rounded-0 col"
      >发表博文a
    >
  div>
  <div
    class="list-group list-group-flush border-top border-bottom mt-3 text-center"
  >
    <li class="list-group-item list-group-item-action active">
      <a href="./index.html" class="text-decoration-none text-secondary">
        <i class="iconfont icon-home pr-1">i>个人中心
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a
        href="./article/index.html"
        class="text-decoration-none text-secondary"
      >
        <i class="iconfont icon-neirongguanli pr-1">i>文章管理
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a
        href="./category/index.html"
        class="text-decoration-none text-secondary"
      >
        <i class="iconfont icon-leimuguanli pr-1">i>类目管理
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a href="./log/index.html" class="text-decoration-none text-secondary">
        <i class="iconfont icon-log pr-1">i>查看日志
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a
        href="./account/index.html"
        class="text-decoration-none text-secondary"
      >
        <i class="iconfont icon-zhanghuguanli pr-1">i>账户管理
      a>
    li>
  div>
div>

然后按需替换即可

替换语法：

<%- include("navs.html") -%>

在 router/admin 目录下新建文件

category.js - 后台类目管理

/**
 * 后台类目管理
 */
const express = require("express");
const categoryApp = express();

categoryApp.get("/", (req, res) => {
     
  res.render("admin/category/index", {
      user: req.user });
});

module.exports = categoryApp;

article.js - 后台文章管理

/**
 * 后台文章管理
 */
const express = require("express");
const articleApp = express();

articleApp.get("/", (req, res) => {
     
  res.render("admin/article/index", {
      user: req.user });
});

module.exports = articleApp;

log.js - 后台日志管理

/**
 * 后台日志管理
 */
const express = require("express");
const logApp = express();

logApp.get("/", (req, res) => {
     
  res.render("admin/log/index", {
      user: req.user });
});

module.exports = logApp;

account.js - 后台账户管理

/**
 * 后台账户管理
 */
const express = require("express");
const accountApp = express();

accountApp.get("/", (req, res) => {
     
  res.render("admin/account/index", {
      user: req.user });
});

module.exports = accountApp;

在 myblog/index.js 中调用路由

// 调用后台文章管理
app.use("/admin/article", require("./router/admin/article"));
// 调用后台类目管理
app.use("/admin/category", require("./router/admin/category"));
// 调用后台日志管理
app.use("/admin/log", require("./router/admin/log"));
// 调用后台账户管理
app.use("/admin/account", require("./router/admin/account"));

修改 views/admin 目录下的 navs.html 文件中的路由

<div class="col-2 bg-white border-right nav-left p-0">
  <div class="row text-center mt-3 px-5">
    <a href="./article/add.html" class="btn btn-primary rounded-0 col"
      >发表博文a
    >
  div>
  <div
    class="list-group list-group-flush border-top border-bottom mt-3 text-center"
  >
    <li class="list-group-item list-group-item-action">
      <a href="/admin/" class="text-decoration-none text-secondary">
        <i class="iconfont icon-home pr-1">i>个人中心
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a href="/admin/article/" class="text-decoration-none text-secondary">
        <i class="iconfont icon-neirongguanli pr-1">i>文章管理
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a href="/admin/category/" class="text-decoration-none text-secondary">
        <i class="iconfont icon-leimuguanli pr-1">i>类目管理
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a href="/admin/log/" class="text-decoration-none text-secondary">
        <i class="iconfont icon-log pr-1">i>查看日志
      a>
    li>
    <li class="list-group-item list-group-item-action">
      <a href="/admin/account/" class="text-decoration-none text-secondary">
        <i class="iconfont icon-zhanghuguanli pr-1">i>账户管理
      a>
    li>
  div>
div>

最后在 static/js/public.js 中写个判断

if ($(".list-group-item").length) {
     
  let href = location.pathname;
  console.log(href);
  $(`.list-group-item a[href='${
       href}']`).parent().addClass("active");
}

开启服务，页面出现以下效果

Node项目实战开发-博客系统_第21张图片

博客后台 文章列表显示

在 model/article.js 文件中新建获取指定页文章列表的方法

/**
   * 获取指定页文章列表
   */
  static getPage() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT id,title,thumbnail,hot FROM article ORDER BY time DESC";
      this.query(sql)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取指定页文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/article.js 文件中新建获取指定页文章列表的属性

/**
   * 获取指定页的文章列表
   */
  getPage: (req, res, next) => {
     
    Article.getPage()
      .then((results) => {
     
        req.pageList = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
};

在 router/admin/article.js 文件对pageList进行封装处理，为后面的分页操作打基础

/**
 * 后台文章管理
 */
const express = require("express");
const article = require("../../middleware/article");
const articleApp = express();

articleApp.get("/", [article.getPage], (req, res) => {
     
  let {
      user, pageList } = req;
  let page = {
     };
  page.list = pageList;
  res.render("admin/article/index", {
      user, page });
});

module.exports = articleApp;

对 views/admin/article/index.html 中的文件进行修改，用取得的数据库的数据重新渲染页面

<tbody>
    <% page.list.forEach(article => { %>
        <tr>
            <th><%= article.id %>th>
            <td><%= article.title %>td>
            <td>
                <% if (article.thumbnail) { %>
                    <i
                       class="iconfont icon-photo"
                       data-toggle="popover"
                       data-content="'<%= article.thumbnail %>'>"
                       >i>
                    <% } %>
                        td>
                    <td>
                        <div class="custom-control custom-switch">
                             />
                            <label
                                   class="custom-control-label"
                                   for="hot1"
                                   >label>
                        div>
                    td>
                    <td>
                        <a
                           href="./edit.html"
                           class="text-primary"
                           title="编辑"
                           ><i class="iconfont icon-bianji">i>编辑a
                            >
                        <a
                           href="#"
                           onclick="return confirm('确定删除？')"
                           class="text-danger"
                           title="删除"
                           ><i class="iconfont icon-delete">i>删除a
                            >
              td>
          tr>
     <% }) %>
tbody>

启动服务，呈现以下效果

Node项目实战开发-博客系统_第22张图片

博客后台 文章列表分页

在 router/admin/article.js 文件中对articleCount等的封装

/**
 * 后台文章管理
 */
const express = require("express");
const article = require("../../middleware/article");
const articleApp = express();

articleApp.get("/", [article.getPage, article.getCount], (req, res) => {
     
  let {
      user, pageList, articleCount } = req;
  let size = 5; // 每页显示5条
  let page = {
     };
  page.count = articleCount; // 总页数
  page.total = Math.ceil(page.count / size); // 最大页数
  page.list = pageList;
  page.p = req.query.p ? req.query.p : 1; // 页数
  page.p = page.p > page.total ? page.total : page.p;
  page.p = page.p < 1 ? 1 : page.p;
  res.render("admin/article/index", {
      user, page });
});

module.exports = articleApp;

修改 views/admin/index.html 文件

<div class="align-self-center">
  共 <%= page.count %> 条 / 共 <%= page.total %> 页 / 第 <%=page.p %> 页
div>

开启服务，浏览器访问http://127.0.0.1:3000/admin/article?p=7，页面显示以下效果

Node项目实战开发-博客系统_第23张图片

在 model/article.js 文件中新建获取指定页文章列表的方法

/**
   * 获取指定页文章列表
   * @param {integer} start 起始索引
   * @param {integer} size 查询条目数
   */
  static getPage(start, size) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,thumbnail,hot FROM article ORDER BY time DESC LIMIT ?,?";
      this.query(sql, [start, size])
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取指定页文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

给 middleware/article.js 文件中的getPage属性传上刚加上的参数

/**
   * 获取指定页的文章列表
   */
  getPage: (req, res, next) => {
     
    Article.getPage(res.start, res.size)
      .then((results) => {
     
        req.pageList = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

对 router/admin/article.js 文件进行修改 - 异步操作

/**
 * 后台文章管理
 */
const express = require("express");
const article = require("../../middleware/article");
const articleApp = express();

articleApp.get(
  "/",
  [article.getCount],
  (req, res, next) => {
     
    let {
      articleCount } = req;
    let size = 5; // 每页显示5条
    req.page = {
     };
    req.page.count = articleCount; // 总页数
    req.page.total = Math.ceil(req.page.count / size); // 最大页数
    req.page.p = req.query.p ? req.query.p : 1; // 页数
    req.page.p = req.page.p > req.page.total ? req.page.total : req.page.p;
    req.page.p = req.page.p < 1 ? 1 : req.page.p;

    res.start = (req.page.p - 1) * size;
    res.size = size;

    next();
  },
  [article.getPage],
  (req, res) => {
     
    let {
      user, pageList, page } = req;
    page.list = pageList;
    res.render("admin/article/index", {
      user, page });
  }
);

module.exports = articleApp;

修改 views/admin/article/index.html 文件

<nav
     class="d-flex justify-content-between border-top pt-3 px-3"
     >
    <div class="align-self-center">
        共 <%= page.count %> 条 / 共 <%= page.total %> 页 / 第 <%=
                                                             page.p %> 页
        div>
        <ul class="pagination mb-0">
            <% if (page.p!=1) { %>
                <li class="page-item">
                    <a
                       class="page-link"
                       href="/admin/article?p=<%= page.p-1 %>"
                       >上一页a
                        >
                li>
                <% } %> <% for( let index = 1; index <= page.total;
                    index++ ) { %>
                    <li class="page-item">
                        <a
                           class="page-link"
                           href="/admin/article?p=<%= index %>"
                           ><%= index %>a
                            >
                            li>
                        <% } %> <% if (page.p!=page.total) { %>
                            <li class="page-item">
                                <a
                                   class="page-link"
                                   href="/admin/article?p=<%= page.p+1 %>"
                                   >下一页a>
     	li>
     <% } %>
     ul>
nav>

启动服务，如下效果

Node项目实战开发-博客系统_第24张图片

博客后台 文章列表分页查询

在 router/admin/article.js 文件中新增类目列表数据

/**
 * 后台文章管理
 */
const express = require("express");
const article = require("../../middleware/article");
const category = require("../../middleware/category");
const articleApp = express();

articleApp.get(
  "/",
  [article.getCount],
  (req, res, next) => {
     
    let {
      articleCount } = req;
    let size = 5; // 每页显示5条
    req.page = {
     };
    req.page.count = articleCount; // 总页数
    req.page.total = Math.ceil(req.page.count / size); // 最大页数
    req.page.p = req.query.p ? req.query.p : 1; // 页数
    req.page.p = req.page.p > req.page.total ? req.page.total : req.page.p;
    req.page.p = req.page.p < 1 ? 1 : req.page.p;

    res.start = (req.page.p - 1) * size;
    res.size = size;

    next();
  },
  [article.getPage, category.getList],
  (req, res) => {
     
    let {
      user, pageList, page, categories } = req;
    page.list = pageList;
    res.render("admin/article/index", {
      user, page, categories });
  }
);

module.exports = articleApp;

修改 views/admin/article/index.html 文件

<form
      action="/admin/article"
      class="form-inline mb-3"
      method="get"
      >
    <input type="hidden" name="p" value="<%= page.p %>" />
    <div class="form-group">
        <label for="category">类目：label>
        <select
                name="category"
                id="category"
                class="form-control-sm"
                >
            <option value="-1">全部option>
            <% categories.forEach(category => { %>
                <option value="<%= category.id %>"
                        ><%= category.name %>
                    option>
                    <% }) %>
                        select>
                div>
            <div class="form-group ml-3">
                <label for="hot">热门：label>
                <select name="hot" id="hot" class="form-control-sm">
                    <option value="-1">全部option>
                    <option value="1">热门option>
                    <option value="0">非热门option>
                select>
            div>
            <div class="from-group ml-3">
                <input
                       type="submit"
                       value="筛选"
                       class="btn btn-primary btn-sm"
                       />
            div>
            <div class="form-group ml-auto">
                <a href="./add.html" class="btn btn-danger btn-sm"
                   >发表博文a
                    >
            div>
form>

修改 model/article.js 文件，附带两个参数category_id, hot

/**
   * 总博文数
   */
  static getCount(category_id, hot) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT COUNT(1) AS count FROM article WHERE 1=1";
      sql +=
        category_id != -1 && category_id
          ? ` AND category_id=${
       category_id}`
          : "";
      sql += hot != -1 && hot ? ` AND hot=${
       hot}` : "";
      this.query(sql)
        .then((results) => {
     
          resolve(results[0].count);
        })
        .catch((err) => {
     
          console.log(`获取总博文数失败：${
       err.message}`);
          reject(err);
        });
    });
  }

  /**
   * 获取指定页文章列表
   * @param {integer} start 起始索引
   * @param {integer} size 查询条目数
   */
  static getPage(start, size, category_id, hot) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT id,title,thumbnail,hot FROM article WHERE 1=1";

      sql +=
        category_id != -1 && category_id
          ? ` AND category_id=${
       category_id}`
          : "";
      sql += hot != -1 && hot ? ` AND hot=${
       hot}` : "";

      sql += " ORDER BY time DESC LIMIT ?,?";
      this.query(sql, [start, size])
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取指定页文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

再修改 middleware/article.js 文件

/**
   * 获取总博文数
   */
  getCount: (req, res, next) => {
     
    Article.getCount(req.query.category_id, req.query.hot)
      .then((results) => {
     
        req.articleCount = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
  /**
   * 获取指定页的文章列表
   */
  getPage: (req, res, next) => {
     
    Article.getPage(res.start, res.size, req.query.category_id, req.query.hot)
      .then((results) => {
     
        req.pageList = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

再到路由中进行修改 router/admin/article.js

/**
 * 后台文章管理
 */
const express = require("express");
const article = require("../../middleware/article");
const category = require("../../middleware/category");
const articleApp = express();

articleApp.get(
  "/",
  [article.getCount],
  (req, res, next) => {
     
    let {
      articleCount } = req;
    let size = 3; // 每页显示5条
    req.page = {
     };
    req.page.count = articleCount; // 总页数
    req.page.total = Math.ceil(req.page.count / size); // 最大页数
    req.page.p = req.query.p ? req.query.p : 1; // 页数
    req.page.p = req.page.p > req.page.total ? req.page.total : req.page.p;
    req.page.p = req.page.p < 1 ? 1 : req.page.p;

    res.start = (req.page.p - 1) * size;
    res.size = size;

    next();
  },
  [article.getPage, category.getList],
  (req, res) => {
     
    let {
      user, pageList, page, categories } = req;
    let {
      category_id, hot } = req.query;

    page.list = pageList;
    res.render("admin/article/index", {
     
      user,
      page,
      categories,
      category_id,
      hot,
    });
  }
);

module.exports = articleApp;

修改 views/admin/article/index.html 文件

<ul class="pagination mb-0">
                      <% if (page.p!=1) { %>
                      <li class="page-item">
                        <a
                          class="page-link"
                          href="/admin/article?p=<%= page.p-1 %>&category_id=<%= category_id %>&hot=<%= hot %>"
                          >上一页a
                        >
                      li>
                      <% } %> <% for( let index = 1; index <= page.total;
                      index++ ) { %>
                      <li class="page-item">
                        <a
                          class="page-link"
                          href="/admin/article?p=<%= index %>&category_id=<%= category_id %>&hot=<%= hot %>"
                          ><%= index %>a
                        >
                      li>
                      <% } %> <% if (page.p!=page.total) { %>
                      <li class="page-item">
                        <a
                          class="page-link"
                          href="/admin/article?p=<%= page.p+1 %>&category_id=<%= category_id %>&hot=<%= hot %>"
                          >下一页a
                        >
                      li>
                      <% } %>
ul>

Node项目实战开发-博客系统_第25张图片

博客后台 文章列表-热门推荐

首先在 model/article.js 文件中设置热门方法

/**
   * 设置热门
   * @param {integer} id 文章编号
   * @param {integer} hot 热门状态
   */
  static setHot(id, hot) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "UPDATE article SET hot = ? WHERE id = ?";
      this.query(sql, [hot, id])
        .then((results) => {
     
          resolve(results.affectedRows);
        })
        .catch((err) => {
     
          console.log(`设置热门失败：${
       err.message}`);
          reject(err);
        });
    });
  }

然后再 middleware/article.js 文件中设置热门推荐属性

/**
   * 设置热门推荐
   */
  setHot: (req, res, next) => {
     
    let {
      id, hot } = req.query;
    Article.setHot(id, hot)
      .then((results) => {
     
        req.affectedRows = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/article.js 文件中设置热门推荐路由

articleApp.get("/sethot", article.setHot, (req, res) => {
     
  // 如果受影响的行数大于0，说明数据库更新成功，否则失败
  if (req.affectedRows > 0) {
     
    res.json({
      code: 1, msg: "设置成功" });
  } else {
     
    res.json({
      code: 0, msg: "设置失败" });
  }
});

在 views/admin/article/index.html 文件中进行修改

首先是页面部分

<div class="custom-control custom-switch">
  οnchange="sethot(this.value,this.checked)" />
                            
 <label
   class="custom-control-label"
   for="hot<%= article.id %>"
   >label>
div>

其次是JavaScript脚本部分

function sethot(id,hot){
     
    $.get("/admin/article/sethot",{
     id,hot:hot?1:0},function(res){
     
        if(res.code==1){
     
            showToasts("成功","设置热门成功")
        }else{
     
            showToasts("失败","设置热门失败")
        }
    })
}

启动服务，即可完成页面点击热门推荐按钮对数据库的hot进行修改

博客后台 添加博文-页面显示

在 router/admin/article.js 文件中新增显示添加博文的方法

// 显示添加博文页
articleApp.get("/add", [category.getList], (req, res) => {
     
  let {
      user, categories } = req;
  res.render("admin/article/add", {
      user, categories });
});

博客后台 图片上传

安装multer

npm i multer

在 myblog/index.js 文件中引入multer

const multer = require("multer");

上传配置

// 上传配置
const upload = multer({
     
  dest: "./static/upload", // 上传文件的存储目录
  limits: {
     
    fileSize: 1024 * 1024 * 2, // 单个文件大小限制在2M
  },
});

上传操作

const fs = require("fs");
const path = require("path");

// 上传操作
app.post("/admin/*", upload.single("upload"), (req, res, next) => {
     
  // 上传成功后的文件对象
  let {
      file } = req;
  if (file) {
     
    // file.originalname ==> 文件的原名称
    let extname = path.extname(file.originalname);
    // file.path ==> 上传后的文件路径
    fs.renameSync(file.path, file.path + extname);
    // file.filename ==> 上传后的文件名
    req.uploadUrl = "/upload/" + file.filename + extname;
  }
  next();
});

在 router/admin/article.js 文件中新增上传图片的路由

// ckeditor 上传
articleApp.post("/ckeditor", (req, res) => {
     
  if (req.uploadUrl) {
     
    res.json({
     
      uploaded: true,
      url: req.uploadUrl,
    });
  } else {
     
    res.json({
     
      uploaded: false,
      err: {
      message: "上传失败" },
    });
  }
});

完成如下效果

博客后台添加博文-数据库写入

在 model.article.js 中新增添加文章方法

/**
   * 添加文章
   * @param {Object} article 文章对象
   */
  static add(article) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "INSERT INTO article SET ?";
      this.query(sql, article)
        .then((results) => {
     
          resolve(results.insertId);
        })
        .catch((err) => {
     
          console.log(`添加文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/article.js 文件中新增添加文章的属性

/**
   * 添加文章
   */
  add: (req, res, next) => {
     
    let {
      title, content, hot, category_id } = req.body;
    let article = {
     
      title,
      content,
      hot: hot ? 1 : 0,
      category_id: category_id,
      thumbnail: req.uploadUrl ? req.uploadUrl : null,
    };
    Article.add(article)
      .then((results) => {
     
        req.insertId = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/article.js 文件中新增添加文章的路由

// 添加文章
articleApp.post("/add", [article.add, category.getList], (req, res) => {
     
  let {
      user, categories } = req;
  if (req.insertId) {
     
    res.render("admin/article/add", {
      user, categories, code: 1 });
  } else {
     
    res.render("admin/article/add", {
      user, categories, code: 2 });
  }
});

启动服务，上传文章到数据库

博客后台 删除博文

在 model/article.js 文件中新增删除文章的方法

  /**
   * 删除文章
   * @param {integer} id 文章编号
   */
  static del(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "DELETE FROM article WHERE id = ?";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results.affectedRows);
        })
        .catch((err) => {
     
          console.log(`删除文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/article.js 文件中新增删除文章的属性

  /**
   * 删除文章
   */
  del: (req, res, next) => {
     
    let {
      id } = req.query;
    Article.del(id)
      .then((results) => {
     
        req.affectedRows = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/article.js 文件中新增删除文章的路由

// 删除文章
articleApp.get("/del", article.del, (req, res) => {
     
  if (req.affectedRows > 0) {
     
    res.json({
      code: 1, msg: "删除成功" });
  } else {
     
    res.json({
      code: 2, msg: "删除失败" });
  }
});

修改 views/admin/article/index.html 文件

<button
        onclick="del(<%=article.id%>)"
        class="btn btn-link text-danger"
        title="删除"
        ><i class="iconfont icon-delete">i>删除button
    >

function del(id){
     
    $.getJSON("/admin/article/del",{
     id},function(res){
     
        if(res.code==1){
     
            showToasts("成功","删除成功")
            // 重新加载页面
            setTimeout(function(){
     
                location.reload()
            },2000)
        }else{
     
            showToasts("失败","删除失败")
        }
    })
}

启动服务，删除文章删除成功

Node项目实战开发-博客系统_第26张图片

博客后台 编辑博文-显示数据

在 model/article.js 文件中修改获取指定文章详情的方法

  /**
   * 获取指定文章的详情
   * @param {integer} id 当前文章编号
   */
  static getArticleById(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT a.id,a.title,a.content,a.`time`,a.hits,a.category_id,c.`name`,a.`thumbnail`,a.`hot` FROM article a,category c WHERE a.id = ? AND a.category_id = c.id";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results[0]);
        })
        .catch((err) => {
     
          console.log(`获取指定文章的详情失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 router/admin/article.js 文件中新增路由

// 文章编辑
articleApp.get(
  "/edit/:id",
  [category.getList, article.getArticleById],
  (req, res) => {
     
    let {
      user, categories, article } = req;
    res.render("admin/article/edit", {
      user, categories, article });
  }
);

修改 views/admin/article/edit.html 文件


<html>
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <title>首页title>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
    />
    <link
      rel="stylesheet"
      href="//at.alicdn.com/t/font_1658828_vud4w73neg.css"
    />
    <link rel="stylesheet" href="/admin/css/style.css" />
  head>

  <body class="bg-light">
    <%- include("../header.html") -%>
    <div class="container-fluid vh-100">
      <div class="row h-100">
        <%- include("../navs.html") -%>
        <div class="col-10">
          <div class="p-3 border mb-3 bg-white">
            <h4 class="mb-0">文章管理h4>
          div>
          <div class="row mt-3">
            <div class="col">
              <div class="card">
                <div
                  class="card-header bg-primary text-white d-flex justify-content-between"
                >
                  <h6 class="mb-0 align-self-center">编辑文章h6>
                div>
                <div class="card-body">
                  <form
                    action="/admin/article/edit"
                    method="POST"
                    enctype="multipart/form-data"
                  >
                    <input type="hidden" name="id" value="<%= article.id %>" />
                    <div class="form-row">
                      <label
                        for="title"
                        class="col-2 text-center col-form-label"
                        >标题：label
                      >
                      <input
                        type="text"
                        class="col-8 form-control"
                        name="title"
                        id="title"
                        value="<%= article.title %> "
                        required
                      />
                      <span class="col-2 col-form-label text-danger"
                        >* 必填项span
                      >
                    div>
                    <div class="form-row mt-3">
                      <label
                        for="category_id"
                        class="col-2 text-center col-form-label"
                        >类目：label
                      >
                      <select
                        name="category_id"
                        id="category_id"
                        class="col-8 form-control"
                      >
                        <option value="0">请选择option>
                        <% categories.forEach(category => { %>

启动服务，实现对应文章页面显示

Node项目实战开发-博客系统_第27张图片

博客后台 编辑博文-数据库修改

在 model/article.js 文件中新增编辑文章的方法

  /**
   * 编辑文章
   * @param {Object} article 文章对象
   */
  static edit(article) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "UPDATE article SET title = ?, content = ?, hot = ?, category_id = ?, thumbnail = ? WHERE id = ?";
      this.query(sql, [
        article.title,
        article.content,
        article.hot,
        article.category_id,
        article.thumbnail,
        article.id,
      ])
        .then((results) => {
     
          resolve(results.affectedRows);
        })
        .catch((err) => {
     
          console.log(`编辑文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/article.js 文件中新增编辑文章的属性

  /**
   * 编辑文章
   */
  edit: (req, res, next) => {
     
    let {
      title, content, hot, category_id, thumbnail, id } = req.body;
    let article = {
     
      title,
      content,
      hot: hot ? 1 : 0,
      category_id,
      thumbnail: req.uploadUrl ? req.uploadUrl : thumbnail,
      id,
    };
    Article.edit(article)
      .then((results) => {
     
        req.affectedRows = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/article.js 文件中新增路由

articleApp.post("/edit", [article.edit], (req, res) => {
     
  if (req.affectedRows > 0) {
     
    res.render("admin/alert", {
     
      code: true,
      title: "成功提示",
      message: "文章编辑成功",
      url: "/admin/article/",
    });
  } else {
     
    res.render("admin/alert", {
     
      code: false,
      title: "失败提示",
      message: "文章编辑失败",
      url: "/admin/article/" + req.body.id,
    });
  }

博客后台 前台文章列表与文章内容调整

在 model/article.js 文件中修改两个方法，数据库查询的时候都加上thumbnail字段

  /**
   * 获取热门推荐
   * @param {integer} num 条目数
   */
  static getHot(num) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,content,`time`,thumbnail FROM article WHERE hot = 1 LIMIT ?";
      this.query(sql, num)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取热门文章失败：${
       err.message}`);
          reject(err);
        });
    });
  }

  /**
   * 获取文章列表
   */
  static getList() {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT id,title,content,`time`,thumbnail FROM article ORDER BY time DESC";
      this.query(sql)
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取文章列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

修改 views/admin/index.html 文件

<img
     src="<%= article.thumbnail %> "
     data-src="holder.js/100px150"
     class="card-img-top"
     alt="..."
     />

使前台页面效果如下

Node项目实战开发-博客系统_第28张图片

博客管理 类目管理-显示与添加

在 model/category.js 文件中添加新增类目方法

  /**
   * 新增类目
   */
  static add(name, index) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "INSERT INTO category (`name`,`index`) VALUES (?,?)";
      this.query(sql, [name, index])
        .then((results) => {
     
          resolve(results.insertId);
        })
        .catch((err) => {
     
          console.log(`新增类目失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/category.js 文件中添加新增类目属性

  /**
   * 添加类目
   */
  add: (req, res, next) => {
     
    let {
      name, index } = req.body;
    Category.add(name, index)
      .then((results) => {
     
        req.insertId = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/category.js 文件中新增路由

categoryApp.post("/add", [category.add], (req, res) => {
     
  if (req.insertId) {
     
    res.json({
      code: 1, msg: "添加成功" });
  } else {
     
    res.json({
      code: 1, msg: "添加失败" });
  }
});

在 views/admin/category/index.html 文件中编写JS脚本

function save(t) {
     
    let name = $(t).parents("tr").find("[name='name']").val();
    let index = $(t).parents("tr").find("[name='index']").val();

    $.post("/admin/category/add", {
      name, index }, function (res) {
     
        if (res.code == 1) {
     
            showToasts("成功", "添加类目成功");
            setTimeout(function () {
     
                location.reload();
            }, 2000);
        } else {
     
            showToasts("失败", "添加类目失败");
        }
    });
}

效果如下

Node项目实战开发-博客系统_第29张图片

博客后台 类目管理-删除与修改

在 model/category.js 文件中新增删除类目的方法

  /**
   * 删除类目
   * @param {integer} id 类目编号
   */
  static del(id) {
     
    return new Promise((resolve, reject) => {
     
      let sql = "DELETE FROM category WHERE id = ?";
      this.query(sql, id)
        .then((results) => {
     
          resolve(results.affectedRows);
        })
        .catch((err) => {
     
          console.log(`删除类目失败：${
       err.message}`);
          reject(err);
        });
    });
  }

在 middleware/category.js 文件中新增删除类目的属性

  /**
   * 删除类目
   */
  del: (req, res, next) => {
     
    let {
      id } = req.query;
    Category.del(id)
      .then((results) => {
     
        req.affectedRows = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },

在 router/admin/category.js 文件中新增删除类目的路由

categoryApp.get("/del", category.del, (req, res) => {
     
  if (req.affectedRows > 0) {
     
    res.json({
      code: 1, msg: "删除成功" });
  } else {
     
    res.json({
      code: 1, msg: "删除失败" });
  }
});

在 views/admin/category/index.html 文件中编写JS脚本

function del(id) {
     
    if (confirm("确认删除?")) {
     
        $.getJSON("/admin/category/del", {
      id }, function (res) {
     
            if (res.code == 1) {
     
                showToasts("成功", "删除类目成功");
                setTimeout(function () {
     
                    location.reload();
                }, 2000);
            } else {
     
                showToasts("失败", "删除类目失败");
            }
        });
    }
}

开启服务，实现如下效果

Node项目实战开发-博客系统_第30张图片

博客后台 日志列表显示

在 model 目录下新建 log.js 文件

/**
 * 日志数据模型
 */
module.exports = class Tab extends require("./model") {
     
  /**
   * 获取日志列表
   */
  static getPage(start, size) {
     
    return new Promise((resolve, reject) => {
     
      let sql =
        "SELECT handle,`time`,ip FROM `log` ORDER BY `time` DESC LIMIT ?,?";
      this.query(sql, [start, size])
        .then((results) => {
     
          resolve(results);
        })
        .catch((err) => {
     
          console.log(`获取日志列表失败：${
       err.message}`);
          reject(err);
        });
    });
  }

  /**
   * 获取日志总条目数
   */
  static getCount() {
     
    return new Promise((resolve, reject) => {
     
      let sql = "SELECT COUNT(1) as count FROM `log`";
      this.query(sql)
        .then((results) => {
     
          resolve(results[0].count);
        })
        .catch((err) => {
     
          console.log(`获取日志总条目数失败：${
       err.message}`);
          reject(err);
        });
    });
  }
};

在 middleware 目录下新建 log.js 文件

/**
 * 访问量中间件
 */
const Log = require("../model/log");

module.exports = {
     
  /**
   * 获取日志列表
   */
  getPage: (req, res, next) => {
     
    let {
      p, size } = req.page;
    Log.getPage((p - 1) * size, size)
      .then((results) => {
     
        req.page.list = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
  /**
   * 获取总条目数
   */
  getCount: (req, res, next) => {
     
    Log.getCount()
      .then((results) => {
     
        req.count = results;
        next();
      })
      .catch((err) => {
     
        next(err);
      });
  },
};

在 router/admin 目录下新建 log.js 文件

/**
 * 后台日志管理
 */
const express = require("express");
const log = require("../../middleware/log");

const logApp = express();

logApp.get(
  "/",
  log.getCount,
  (req, res, next) => {
     
    let page = {
     
      p: req.query.p ? req.query.p : 1,
      count: req.count,
      size: 3,
    };
    page.total = Math.ceil(page.count / page.size);
    page.p = page.p > page.total ? page.total : page.p;
    page.p = page.p < 1 ? 1 : page.p;

    req.page = page;
    next();
  },
  log.getPage,
  (req, res) => {
     
    let {
      user, page } = req;
    res.render("admin/log/index", {
      user, page });
  }
);

module.exports = logApp;

修改 views/admin/log/index.html 文件


<html>
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <title>首页title>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
    />
    <link
      rel="stylesheet"
      href="//at.alicdn.com/t/font_1658828_vud4w73neg.css"
    />
    <link rel="stylesheet" href="/admin/css/style.css" />
  head>

  <body class="bg-light">
    <%- include("../header.html") -%>

    <div class="container-fluid vh-100">
      <div class="row h-100">
        <%- include("../navs.html") -%>
        <div class="col-10">
          <div class="p-3 border mb-3 bg-white">
            <h4 class="mb-0">查看日志h4>
          div>
          <div class="row mt-3">
            <div class="col">
              <div class="card">
                <div
                  class="card-header bg-primary text-white d-flex justify-content-between"
                >
                  <h6 class="mb-0 align-self-center">日志列表h6>
                div>
                <div class="card-body">
                  <table class="table text-center">
                    <thead>
                      <tr>
                        <th>时间th>
                        <th>操作th>
                        <th>IPth>
                      tr>
                    thead>
                    <tbody>
                      <% page.list.forEach(log => { %>
                      <tr>
                        <td><%= log.time.toLocaleString() %>td>
                        <td><%= log.handle %>td>
                        <td><%= log.ip %>td>
                      tr>
                      <% }) %>
                    tbody>
                  table>

                  <nav
                    class="d-flex justify-content-between border-top pt-3 px-3"
                  >
                    <div class="align-self-center">
                      共 <%= page.count %> 条 / 共 <%= page.total %> 页 / 第 <%=
                      page.p %> 页
                    div>
                    <ul class="pagination mb-0">
                      <% if (page.p > 1) { %>
                      <li class="page-item">
                        <a class="page-link" href="/admin/log?p=<%= parseInt(page.p)-1 %>">上一页a>
                      li>
                      <% } %>
                      <% for( let index = 1; index <= page.total; index++ ) { %>
                      <li class="page-item">
                        <a class="page-link" href="/admin/log?p=<%= index %>"><%= index %>a>
                      li>
                      <% } %>
                      
                      
                      li>
                      <% if (page.p < page.total) { %>
                      <li class="page-item">
                        <a class="page-link" href="/admin/log?p=<%= parseInt(page.p)+1 %>">下一页a>
                      li>
                      <% } %>
                    ul>
                  nav>
                div>
              div>
            div>
          div>
        div>
      div>
    div>

    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js">script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js">script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js">script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/holder/2.9.6/holder.min.js">script>
    <script src="https://gw.alipayobjects.com/os/lib/antv/g2/3.5.12/dist/g2.min.js">script>
    <script src="https://gw.alipayobjects.com/os/antv/pkg/_antv.data-set-0.10.2/dist/data-set.min.js">script>
    <script src="/admin/js/public.js">script>
  body>
html>

启动服务，实现以下效果

Node项目实战开发-博客系统_第31张图片

博客后台 日志列表显示

示例：做一个登录日志

在 router/admin/login.js 中修改实现登录操作的方法

const log = require("../middleware/log");

// 实现登录操作
loginApp.post("/", (req, res, next) => {
     
  let {
      username, password } = req.body;
  User.login(username, password)
    .then((results) => {
     
      if (results) {
     
        req.log = {
     
          time: new Date(),
          handle: "登录",
          ip: req.ip.split(":")[3],
        };
        log.add(req, res, next);
        // session存储（key=value）
        req.session.user = results;
        res.redirect("/");
      } else {
     
        res.render("login", {
      msg: "登录失败！用户名或密码错误" });
      }
    })
    .catch((err) => {
     
      next(err);
    });
});

主要代码：

req.log = {
     
    time: new Date(),
    handle: "登录",
    ip: req.ip.split(":")[3],
};
log.add(req, res, next);

自由发挥即可

Node项目实战开发-博客系统_第32张图片

博客后台 会话延期

cookie-session会话延期实现

在 myblog/index.js 文件中新建SESSION延期

// SESSION延期
app.use((req, res, next) => {
     
  req.session.nowInMinutes = Math.floor(Date.now() / 60e3);
});

你可能感兴趣的:(mysql,Nodejs,nodejs,JavaScript)

  • Long类型前后端数据不一致 igotyback 前端
    响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问
  • mysql禁用远程登录 igotyback mysql
    去mysql库中的user表里，将host都改成localhost之后刷新权限FLUSHPRIVILEGES;
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
    ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
  • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
    Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
  • MYSQL面试系列-04 king01299 面试mysql面试
    MYSQL面试系列-0417.关于redolog和binlog的刷盘机制、redolog、undolog作用、GTID是做什么的？innodb_flush_log_at_trx_commit及sync_binlog参数意义双117.1innodb_flush_log_at_trx_commit该变量定义了InnoDB在每次事务提交时，如何处理未刷入（flush）的重做日志信息（redolog）。它
  • node.js学习 小猿L node.jsnode.js学习vim
    node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行
  • 关于Mysql 中 Row size too large (＞ 8126) 错误的解决和理解 秋刀prince mysqlmysql数据库
    提示：啰嗦一嘴，数据库的任何操作和验证前，一定要记得先备份！！！不会有错；文章目录问题发现一、问题导致的可能原因1、页大小2、行格式2.1compact格式2.2Redundant格式2.3Dynamic格式2.4Compressed格式3、BLOB和TEXT列二、解决办法1、修改页大小（不推荐）2、修改行格式3、修改数据类型为BLOB和TEXT列4、其他优化方式（可以参考使用）4.1合理设置数据
  • MongoDB知识概括 GeorgeLin98 持久层mongodb
    MongoDB知识概括MongoDB相关概念单机部署基本常用命令索引-IndexSpirngDataMongoDB集成副本集分片集群安全认证MongoDB相关概念业务应用场景：传统的关系型数据库（如MySQL），在数据操作的“三高”需求以及应对Web2.0的网站需求面前，显得力不从心。解释：“三高”需求：①Highperformance-对数据库高并发读写的需求。②HugeStorage-对海量数
  • JavaScript 中，深拷贝（Deep Copy）和浅拷贝（Shallow Copy） 跳房子的前端 前端面试javascript开发语言ecmascript
    在JavaScript中，深拷贝（DeepCopy）和浅拷贝（ShallowCopy）是用于复制对象或数组的两种不同方法。了解它们的区别和应用场景对于避免潜在的bugs和高效地处理数据非常重要。以下是对深拷贝和浅拷贝的详细解释，包括它们的概念、用途、优缺点以及实现方式。1.浅拷贝（ShallowCopy）概念定义：浅拷贝是指创建一个新的对象或数组，其中包含了原对象或数组的基本数据类型的值和对引用数
  • Vue( ElementUI入门、vue-cli安装) m0_l5z elementuivue.js
    一.ElementUI入门目录：1.ElementUI入门1.1ElementUI简介1.2Vue+ElementUI安装1.3开发示例2.搭建nodejs环境2.1nodejs介绍2.2npm是什么2.3nodejs环境搭建2.3.1下载2.3.2解压2.3.3配置环境变量2.3.4配置npm全局模块路径和cache默认安装位置2.3.5修改npm镜像提高下载速度2.3.6验证安装结果3.运行n
  • 入门MySQL——查询语法练习 K_un
    前言：前面几篇文章为大家介绍了DML以及DDL语句的使用方法，本篇文章将主要讲述常用的查询语法。其实MySQL官网给出了多个示例数据库供大家实用查询，下面我们以最常用的员工示例数据库为准，详细介绍各自常用的查询语法。1.员工示例数据库导入官方文档员工示例数据库介绍及下载链接：https://dev.mysql.com/doc/employee/en/employees-installation.h
  • 博客网站制作教程 2401_85194651 javamaven
    首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
  • ubuntu安装wordpress lissettecarlr
    1安装nginx网上安装方式很多，这就就直接用apt-get了apt-getinstallnginx不用启动啥，然后直接在浏览器里面输入IP:80就能看到nginx的主页了。如果修改了一些配置可以使用下列命令重启一下systemctlrestartnginx.service2安装mysql输入安装前也可以更新一下软件源，在安装过程中将会让你输入数据库的密码。sudoapt-getinstallmy
  • vue 创建项目报错：command failed: npm install --loglevel error 那鱼、会飞 vue.jsvue-cli3
    这个问题其实很好解决，只是很多种情况，逐一排除即可。稳下心来~vuecli3创建项目我的node版本是node14.15.0，（永远不要尝试最新版本）node各种版本下载地址：以往的版本|Node.js(nodejs.org)vue/[email protected]@vue/[email protected]（注意vue/cli2和vue/cli3的下载命名有所改变，2是-形式，3是/形式）其实报错
  • JavaScript `Map` 和 `WeakMap`详细解释 跳房子的前端 JavaScript原生方法javascript前端开发语言
    在JavaScript中，Map和WeakMap都是用于存储键值对的数据结构，但它们有一些关键的不同之处。MapMap是一种可以存储任意类型的键值对的集合。它保持了键值对的插入顺序，并且可以通过键快速查找对应的值。Map提供了一些非常有用的方法和属性来操作这些数据对：set(key,value):将一个键值对添加到Map中。如果键已经存在，则更新其对应的值。get(key):获取指定键的值。如果键
  • 计算机毕业设计PHP仓储综合管理系统（源码+程序+VUE+lw+部署） java毕设程序源码王哥 php课程设计vue.js
    该项目含有源码、文档、程序、数据库、配套开发软件、软件安装教程。欢迎交流项目运行环境配置：phpStudy+Vscode+Mysql5.7+HBuilderX+Navicat11+Vue+Express。项目技术：原生PHP++Vue等等组成，B/S模式+Vscode管理+前后端分离等等。环境需要1.运行环境：最好是小皮phpstudy最新版，我们在这个版本上开发的。其他版本理论上也可以。2.开发
  • 切换淘宝最新npm镜像源是 hai40587 npm前端node.js
    切换淘宝最新npm镜像源是一个相对简单的过程，但首先需要明确当前淘宝npm镜像源的状态和最新的镜像地址。由于网络环境和服务更新，镜像源的具体地址可能会发生变化，因此，我将基于当前可获取的信息，提供一个通用的切换步骤，并附上最新的镜像地址（截至回答时）。一、了解npm镜像源npm（NodePackageManager）是JavaScript的包管理器，用于安装、更新和管理项目依赖。由于npm官方仓库
  • NPM私库搭建-verdaccio（Linux） Beam007 npmlinux前端
    1、安装nodelinux服务器安装nodea)、官网下载所需的node版本https://nodejs.org/dist/v14.21.0/b)、解压安装包若下载的是xxx.tar.xz文件，解压命令为tar-xvfxxx.tar.xzc)、修改环境变量修改：/etc/profile文件#SETPATHFORNODEJSexportNODE_HOME=NODEJS解压安装的路径exportPAT
  • You have an error in your SQL syntax； check the manual that corresponds to your MySQL server version 努力的菜鸟~ sql数据库
    YouhaveanerrorinyourSQLsyntax;checkthemanualthatcorrespondstoyourMySQLserverversionfortherightsyntaxtousenear‘IDENTIFIEDBY‘123456’WITHGRANTOPTION’atline1在mysql5.7之前GRANTALLPRIVILEGESON*.*TO'root'@'%'I
  • mysql学习教程，从入门到精通，TOP 和MySQL LIMIT 子句（15） 知识分享小能手 大数据数据库MySQLmysql学习oracle数据库开发语言adb大数据
    1、TOP和MySQLLIMIT子句内容在SQL中，不同的数据库系统对于限制查询结果的数量有不同的实现方式。TOP关键字主要用于SQLServer和Access数据库中，而LIMIT子句则主要用于MySQL、PostgreSQL（通过LIMIT/OFFSET语法）、SQLite等数据库中。下面将分别详细介绍这两个功能的语法、语句以及案例。1.1、TOP子句（SQLServer和Access）1.1
  • 高性能javascript--算法和流程控制 海淀萌狗
    -for,while和do-while性能相当-避免使用for-in循环，==除非遍历一个属性量未知的对象==es5:for-in遍历的对象便不局限于数组，还可以遍历对象。原因：for-in每次迭代操作会同时搜索实例或者原型属性，for-in循环的每次迭代都会产生更多开销，因此要比其他循环类型慢，一般速度为其他类型循环的1/7。因此，除非明确需要迭代一个属性数量未知的对象，否则应避免使用for-i
  • 鲲鹏 ARM 架构 麒麟 Lylin v10 安装 Nginx (离线) 焚木灵 arm开发架构nginx服务器
    最近做一个银行的项目，银行的服务器是鲲鹏ARM架构的服务器，并且是麒麟v10的系统，这里记录一下在无法访问外网安装Nginx的方法。其他文章：鲲鹏ARM架构麒麟Lylinv10安装Mysql8.3(离线)-CSDN博客鲲鹏ARM架构麒麟Lylinv10安装Node和NVM(离线)-CSDN博客鲲鹏ARM架构麒麟Lylinv10安装Pm2(离线)-CSDN博客鲲鹏ARM架构麒麟Lylinv10安装P
  • Vue 项目运行时，报错 Error: Cannot find module ‘node:path‘ 周bro vue.js前端javascriptnode.jsnpm
    node-v是否显示nodenpm-v报错Error:Cannotfindmodule‘node:path'是因为node版本和npm版本不匹配安装相对应的版本node版本10.16.0对应npm版本[email protected]执行该命令即可匹配版本官网https://nodejs.org/en/about/previous-releases
  • 360前端星计划-动画可以这么玩 马小蜗
    动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能
  • 探索Zebra4J：构建高效企业级Web应用的微服务框架 叶准鑫Natalie
    探索Zebra4J：构建高效企业级Web应用的微服务框架ZebraZebra4J/Zebra4Js基于SpringBoot的JavaWeb/Nodejs框架项目地址:https://gitcode.com/gh_mirrors/zebra/Zebra项目介绍在当今快速发展的技术环境中，构建高效、可扩展的企业级Web应用是每个开发团队的追求。Zebra4J作为一款基于SpringBoot的全新微服务
  • Kubernetes部署MySQL数据持久化 沫殇-MS KubernetesMySQL数据库kubernetesmysql容器
    一、安装配置NFS服务端1、安装nfs-kernel-server：sudoapt-yinstallnfs-kernel-server2、服务端创建共享目录#列出所有可用块设备的信息lsblk#格式化磁盘sudomkfs-text4/dev/sdb#创建一个目录：sudomkdir-p/data/nfs/mysql#更改目录权限：sudochown-Rnobody:nogroup/data/nfs
  • MySQL事务隔离级别和MVCC 简书徐小耳
    MySQL事务隔离级别和MVCC参考：https://mp.weixin.qq.com/s/Jeg8656gGtkPteYWrG5_Nw1.MVCC只对读已提交和可重复的读有效果，而未提交读和串行则无意义。2.每条记录都会有trx_id(事务修改记录的id）和roll_pointer是一个指针指向旧版本的undo日志链表（row_id不是必必要的，如果有主键存在就不需要了）3.版本链的头结点就是记
  • JavaScript中秋快乐！ Q_w7742 javascript开发语言ecmascript
    我们来实现一个简单的祝福网页~主要的难度在于使用canvas绘图当点击canvas时候，跳出“中秋节快乐”字样，需要注册鼠标单击事件和计时器。首先定义主要函数：初始化当点击canvas之后转到onCanvasClick函数，绘图生成灯笼。functiononCanvasClick(){//事件处理函数context.clearRect(0,0,canvas1.width,canvas1.heigh
  • Nginx从入门到实践(三) 听你讲故事啊
    动静分离动静分离是将网站静态资源（JavaScript，CSS，img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问。动静分离的一种做法是将静态资源部署在nginx上，后台项目部署到应用服务器上，根据一定规则静态资源的请求全部请求nginx服务器，达到动静分离的目标。rewrite规则Rewrite规则常见正则表达式Rewrite主要的功能就是实现URL的重写，Ngin
  • java观察者模式 3213213333332132 java设计模式游戏观察者模式
    观察者模式——顾名思义，就是一个对象观察另一个对象，当被观察的对象发生变化时，观察者也会跟着变化。 在日常中，我们配java环境变量时，设置一个JAVAHOME变量,这就是被观察者，使用了JAVAHOME变量的对象都是观察者，一旦JAVAHOME的路径改动，其他的也会跟着改动。 这样的例子很多，我想用小时候玩的老鹰捉小鸡游戏来简单的描绘观察者模式。 老鹰会变成观察者，母鸡和小鸡是
  • TFS RESTful API 模拟上传测试 ronin47
           TFS RESTful API 模拟上传测试。 　　 细节参看这里：https://github.com/alibaba/nginx-tfs/blob/master/TFS_RESTful_API.markdown 模拟POST上传一个图片： curl --data-binary @/opt/tfs.png http
  • PHP常用设计模式单例, 工厂, 观察者, 责任链, 装饰, 策略,适配,桥接模式 dcj3sjt126com 设计模式PHP
    // 多态, 在JAVA中是这样用的, 其实在PHP当中可以自然消除, 因为参数是动态的, 你传什么过来都可以, 不限制类型, 直接调用类的方法 abstract class Tiger { public abstract function climb(); } class XTiger extends Tiger { public function climb()
  • hibernate 171815164 Hibernate
    main,save Configuration conf =new Configuration().configure(); SessionFactory sf=conf.buildSessionFactory(); Session sess=sf.openSession(); Transaction tx=sess.beginTransaction(); News a=new
  • Ant实例分析 g21121 ant
            下面是一个Ant构建文件的实例，通过这个实例我们可以很清楚的理顺构建一个项目的顺序及依赖关系，从而编写出更加合理的构建文件。           下面是build.xml的代码： <?xml version="1
  • [简单]工作记录_接口返回405原因 53873039oycg 工作
             最近调接口时候一直报错，错误信息是:       responseCode:405 responseMsg:Method Not Allowed        接口请求方式Post.
  • 关于java.lang.ClassNotFoundException 和 java.lang.NoClassDefFoundError 的区别 程序员是怎么炼成的
       真正完成类的加载工作是通过调用 defineClass来实现的；  而启动类的加载过程是通过调用 loadClass来实现的；  就是类加载器分为加载和定义   protected Class<?> findClass(String name) throws ClassNotFoundExcept
  • JDBC学习笔记-JDBC详细的操作流程 aijuans jdbc
    所有的JDBC应用程序都具有下面的基本流程：　　1、加载数据库驱动并建立到数据库的连接。　　2、执行SQL语句。　　3、处理结果。　　4、从数据库断开连接释放资源。 下面我们就来仔细看一看每一个步骤： 其实按照上面所说每个阶段都可得单独拿出来写成一个独立的类方法文件。共别的应用来调用。 1、加载数据库驱动并建立到数据库的连接：   Html代码  St
  • rome创建rss antonyup_2006 tomcatcmsxmlstrutsOpera
    引用 1.RSS标准 RSS标准比较混乱，主要有以下3个系列 RSS 0.9x / 2.0 : RSS技术诞生于1999年的网景公司(Netscape)，其发布了一个0.9版本的规范。2001年，RSS技术标准的发展工作被Userland Software公司的戴夫 温那(Dave Winer)所接手。陆续发布了0.9x的系列版本。当W3C小组发布RSS 1.0后，Dave W
  • html表格和表单基础 百合不是茶 html表格表单meta锚点
    第一次用html来写东西,感觉压力山大,每次看见别人发的都是比较牛逼的 再看看自己什么都还不会,   html是一种标记语言,其实很简单都是固定的格式   _----------------------------------------表格和表单 表格是html的重要组成部分,表格用在body里面的 主要用法如下; <table> &
  • ibatis如何传入完整的sql语句 bijian1013 javasqlibatis
            ibatis如何传入完整的sql语句？进一步说，String str ="select * from test_table"，我想把str传入ibatis中执行，是传递整条sql语句。         解决办法： <
  • 精通Oracle10编程SQL(14)开发动态SQL bijian1013 oracle数据库plsql
    /* *开发动态SQL */ --使用EXECUTE IMMEDIATE处理DDL操作 CREATE OR REPLACE PROCEDURE drop_table(table_name varchar2) is sql_statement varchar2(100); begin sql_statement:='DROP TABLE '||table_name;
  • 【Linux命令】Linux工作中常用命令 bit1129 linux命令
    不断的总结工作中常用的Linux命令   1.查看端口被哪个进程占用   通过这个命令可以得到占用8085端口的进程号，然后通过ps -ef|grep 进程号得到进程的详细信息   netstat -anp | grep 8085   察看进程ID对应的进程占用的端口号   netstat -anp | grep 进程ID &
  • 优秀网站和文档收集 白糖_ 网站
    集成 Flex, Spring, Hibernate 构建应用程序   性能测试工具-JMeter   Hmtl5-IOCN网站   Oracle精简版教程网站   鸟哥的linux私房菜   Jetty中文文档   50个jquery必备代码片段   swfobject.js检测flash版本号工具
  • angular.extend boyitech AngularJSangular.extendAngularJS API
    angular.extend 复制src对象中的属性去dst对象中. 支持多个src对象. 如果你不想改变一个对象，你可以把dst设为空对象{}: var object = angular.extend({}, object1, object2). 注意: angular.extend不支持递归复制. 使用方法: angular.extend(dst, src); 参数:
  • java-谷歌面试题-设计方便提取中数的数据结构 bylijinnan java
    网上找了一下这道题的解答，但都是提供思路，没有提供具体实现。其中使用大小堆这个思路看似简单，但实现起来要考虑很多。 以下分别用排序数组和大小堆来实现。 使用大小堆： import java.util.Arrays; public class MedianInHeap { /** * 题目：设计方便提取中数的数据结构 * 设计一个数据结构，其中包含两个函数，1.插
  • ajaxFileUpload 针对 ie jquery 1.7+不能使用问题修复版本 Chen.H ajaxFileUploadie6ie7ie8ie9
    jQuery.extend({ handleError: function( s, xhr, status, e ) { // If a local callback was specified, fire it if ( s.error ) { s.error.call( s.context || s, xhr, status, e ); }
  • [机器人制造原则]机器人的电池和存储器必须可以替换 comsci 制造
           机器人的身体随时随地可能被外来力量所破坏,但是如果机器人的存储器和电池可以更换,那么这个机器人的思维和记忆力就可以保存下来,即使身体受到伤害,在把存储器取下来安装到一个新的身体上之后,原有的性格和能力都可以继续维持.....        另外,如果一
  • Oracle Multitable INSERT 的用法 daizj oracle
    转载Oracle笔记-Multitable INSERT 的用法 http://blog.chinaunix.net/uid-8504518-id-3310531.html 一、Insert基础用法 语法：     Insert Into 表名 (字段1,字段2,字段3...）     Values (值1,
  • 专访黑客历史学家George Dyson datamachine on
    20世纪最具威力的两项发明——核弹和计算机出自同一时代、同一群年青人。可是，与大名鼎鼎的曼哈顿计划（第二次世界大战中美国原子弹研究计划）相 比，计算机的起源显得默默无闻。出身计算机世家的历史学家George Dyson在其新书《图灵大教堂》（Turing’s Cathedral）中讲述了阿兰·图灵、约翰·冯·诺依曼等一帮子天才小子创造计算机及预见计算机未来
  • 小学6年级英语单词背诵第一课 dcj3sjt126com englishword
    always 总是 rice 水稻，米饭 before 在...之前 live 生活，居住   usual 通常的 early 早的 begin 开始 month 月份   year 年 last 最后的 east 东方的 high 高的   far 远的 window 窗户 world 世界 than 比...更  
  • 在线IT教育和在线IT高端教育 dcj3sjt126com 教育
    codecademy  http://www.codecademy.com codeschool  https://www.codeschool.com teamtreehouse  http://teamtreehouse.com lynda http://www.lynda.com/ Coursera https://www.coursera.
  • Struts2 xml校验框架所定义的校验文件 蕃薯耀 Struts2 xml校验Struts2 xml校验框架Struts2校验
      >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年7月11日 15:54:59 星期六 http://fa
  • mac下安装rar和unrar命令 hanqunfeng mac
    1.下载：http://www.rarlab.com/download.htm 选择 RAR 5.21 for Mac OS X 2.解压下载后的文件 tar -zxvf rarosx-5.2.1.tar 3.cd rar sudo install -c -o $USER unrar /bin #输入当前用户登录密码 sudo install -c -o $USER rar
  • 三种将list转换为map的方法 jackyrong list
      在本文中，介绍三种将list转换为map的方法： 1） 传统方法 假设有某个类如下    class Movie { private Integer rank; private String description; public Movie(Integer rank, String des
  • 年轻程序员需要学习的5大经验 lampcy 工作PHP程序员
    在过去的7年半时间里，我带过的软件实习生超过一打，也看到过数以百计的学生和毕业生的档案。我发现很多事情他们都需要学习。或许你会说，我说的不就是某种特定的技术、算法、数学，或者其他特定形式的知识吗？没错，这的确是需要学习的，但却并不是最重要的事情。他们需要学习的最重要的东西是“自我规范”。这些规范就是：尽可能地写出最简洁的代码；如果代码后期会因为改动而变得凌乱不堪就得重构；尽量删除没用的代码，并添加
  • 评“女孩遭野蛮引产致终身不育 60万赔偿款1分未得”医腐深入骨髓 nannan408
    先来看南方网的一则报道： 再正常不过的结婚、生子，对于29岁的郑畅来说，却是一个永远也无法实现的梦想。从2010年到2015年，从24岁到29岁，一张张新旧不一的诊断书记录了她病情的同时，也清晰地记下了她人生的悲哀。 　　粗暴手术让人发寒 　　2010年7月，在酒店做服务员的郑畅发现自己怀孕了，可男朋友却联系不上。在没有和家人商量的情况下，她决定堕胎。 　　12月5日，
  • 使用jQuery为input输入框绑定回车键事件 VS 为a标签绑定click事件 Everyday都不同 jspinput回车键绑定clickenter
    假设如题所示的事件为同一个，必须先把该js函数抽离出来，该函数定义了监听的处理：   function search() { //监听函数略...... }   为input框绑定回车事件，当用户在文本框中输入搜索关键字时，按回车键，即可触发search():   //回车绑定 $(".search").keydown(fun
  • EXT学习记录 tntxia ext
      1. 准备   （1） 官网：http://www.sencha.com/   里面有源代码和API文档下载。   EXT的域名已经从www.extjs.com改成了www.sencha.com ，但extjs这个域名会自动转到sencha上。   （2）帮助文档：   想要查看EXT的官方文档的话，可以去这里h
  • mybatis3的mapper文件报Referenced file contains errors xingguangsixian mybatis
    最近使用mybatis.3.1.0时无意中碰到一个问题： The errors below were detected when validating the file "mybatis-3-mapper.dtd" via the file "account-mapper.xml". In most cases these errors can be d
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他