Nodejs+mysql+Express: 一個簡單的博客

推薦網址：

https://github.com/nswbmw/N-blog/blob/backup/book/%E7%AC%AC1%E7%AB%A0%20%E4%B8%80%E4%B8%AA%E7%AE%80%E5%8D%95%E7%9A%84%E5%8D%9A%E5%AE%A2.md

https://www.cnblogs.com/Darren_code/p/node_express.html

https://www.cnblogs.com/chyingp/p/express-multer-file-upload.html（文件上傳multer）

項目github地址

1、工程結構

 

 

2、路由控制 ：Express封裝了http的很多方法

路由句柄（路由中間件）：

　　next('route') 

響應方法：

　　res.render：渲染視圖模板

　　res.redirect：重定向請求

 

3、模板引擎（ejs）

　　app.engine()方法

　　之前先看看express應用的安裝命令:“express -e nodejs-product”，其中的 -e 和 -J 我們一開始已經提到，表示ejs和jade模板。

　　如果想把模板后綴改成“.html”時就會用到app.engine方法，來重新設置模板文件的擴展名，比如想用ejs模板引擎來處理“.html”后綴的文件：app.engine('.html', require('ejs').__express);

　　app.engine(ext, callback) 注冊模板引擎的 callback 用來處理ext擴展名的文件。

　　PS：__express不用去care，其實就是ejs模塊的一個公共屬性，表示要渲染的文件擴展名。

 

4、 文件上傳multer 

const multer = require('multer');

var storage = multer.diskStorage({
  destination: function (req, file, cb){
      cb(null, './public/images')
  },
  filename: function (req, file, cb){
      cb(null, file.originalname)
  }
});
var upload = multer({ storage: storage })

  app.post('/upload', upload.array('field1', 5), function(req, res) {
    req.flash('success', '文件上傳成功!');
    res.redirect('/upload');
  });

 

5、Markdown的使用

　　post頁面，寫博客有時引用上傳的圖片

　　Markdown圖片使用：

　　　　　　   ===> 例如： 

 6、文章的編輯與修改

　　conn.query時，SQL語句是拼接的，會報錯：  Error: ER_BAD_FIELD_ERROR: Unknown column 'xxx' in 'where clause'

　　解決辦法：

　　（1）每個string字段需要加""

　　　　

 　　（2）SQL語句格式如下，不需要每個字段都加""

　　connection.query('UPDATE users SET foo = ?, bar = ?, baz = ? WHERE id = ?', ['a', 'b', 'c', userId], function (error, results, fields) {

  　　if (error) throw error;

  　　// ...

　　});

　

7、留言功能實現

　conng更新Post的comments時，會報錯：Error: ER_DATA_TOO_LONG: Data too long for column 'comments' at row 1

　解決辦法： 

　（1）將comments字段類型varchart改為longtext      https://segmentfault.com/q/1010000009129135

8、ejs 渲染moment.js庫（將時間戳日期格式化）

　　(1)項目里安裝moment:npm install moment --save

　　(2)app.js加入如下代碼：

　　var moment = require('moment')

　　在var app = express();后面加入 app.locals.moment = moment;

 

　　

　　（3）頁面渲染調用格式為：<%= moment(new Date(parseInt("要解析的值"))).format('YYYY-MM-DD HH:MM:SS') %>

　　

9、博客詳情頁面手動刷新，文章閱讀量一直加，使用session記錄

　　

10、文章標題搜索--模糊查詢（POSITION）

 　　SELECT * FROM t_blog_post WHERE POSITION("' + keyWord + '" IN title)

11、使用KindEditor

　　（1）http://www.kindsoft.net/ 下載最新的 KindEditor 壓縮包，解壓后將文件夾重命名為 kindEditor 並放到 public 文件夾下。

　　（2）修改header.ejs

　　　　

　　(3)i定義圖片上傳接口

　　　　https://blog.csdn.net/dexing07/article/details/53870580

　　　　https://blog.csdn.net/charlene0824/article/details/51234394

12、項目存在問題：
　　（1）數據庫操作save、update方法應該封裝通用的
　　（2）數據庫用戶數據清空，瀏覽器本地session存有user，還可以繼續保存（已解決）

　　（3）server端到數據庫的CRUD等等操作,，改進使用ORM框架 sequelize
　　（4）評論時，評論的用戶信息應該不可編輯（已解決）

　　（5）自己的評論不可操作

　　（6）頁面布局樣式亟待設計哦

13、項目啟動
　　（1）網上教程本地安裝mysql
　　（2）setting.js配置mysql數據庫連接
　　（3）建表sql為t_blog_post.sql、t_blog_user.sql
　　（4）npm install 安裝項目依賴
　　（5）npm run start 啟動項目---localhost:3001,端口號可在package.json配置

 14、幾個頁面

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

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

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

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

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