nodejs開發(fā)微博實(shí)例
之前一直執(zhí)著于前端開發(fā),最近幾天,開始學(xué)起了nodejs。作為一名前端開發(fā)者,見到這樣一門用javascript寫的后臺自然是很激動的。但是,后臺畢竟不同于前端,在學(xué)習(xí)的過程中,還是會遇到不少問題。
為了開始學(xué)習(xí)nodejs,一開始選擇了《深入淺出nodejs》這本書,看了幾章之后,得出一個(gè)結(jié)論是:真是一本好書,但是還是不會寫nodejs!然后選擇了另外一本教材《nodejs開發(fā)指南》,由于看過了《深入淺出nodejs》,直接跳過了這本書的前幾章,寫起了該書第五章的微博實(shí)例。作為一個(gè)新手,在寫的過程中,才逐漸發(fā)現(xiàn)因?yàn)閑xpress版本升級的原因,書中的代碼很多已經(jīng)不能用了,這對于新手來講,真是痛苦的經(jīng)歷??!本著分享和學(xué)習(xí)的精神,特此奉上《nodejs開發(fā)指南》微博實(shí)例express4.x版本源碼和編寫過程中需要注意的問題。
首先我們看看當(dāng)前express的版本:
這和書本所用的express2.x版本已經(jīng)有了很大的變化。對于express4版本的新特性,可以看看這個(gè):http://scotch.io/bar-talk/expressjs-4-0-new-features-and-upgrading-from-3-0
話不多說,我們開始我們創(chuàng)建項(xiàng)目之旅。
首先我們新建一個(gè)文件夾,用cmd進(jìn)入文件夾,準(zhǔn)備創(chuàng)建項(xiàng)目。按照書中提到的,創(chuàng)建項(xiàng)目的命令應(yīng)該是:
express -t ejs microblog
問題是express -t參數(shù)已經(jīng)失效,最新的express版本的默認(rèn)模板引擎是jade,所以為了使用ejs,我們需要像下面這樣創(chuàng)建項(xiàng)目:
express -e ejs microblog
按照書中所說的,我們直接運(yùn)行代碼:
supervisor app.js
并且在瀏覽器中輸入http://localhost:3000/,并不能看到書中需要的效果,而是需要在app.js中app.use('/', routes);后面添加:
app.listen(3000);
Console.log(something happening);
按照書中的步驟往下走,我們會發(fā)現(xiàn)一個(gè)問題,因?yàn)樵趘iews文件夾里面不是layout.ejs和index.ejs,這是因?yàn)椋钚掳姹镜膃xpress不支持ejs模塊的partials方法,所以需要自己額外安裝模塊:
npm install express-partials
然后在app.js中添加:
var partials = require('express-partials');
app.use(partials());
需要注意的是,這一行要添加到app.set('view engine', 'ejs');后面,如果添加到app.use('/', routes);后面,會出現(xiàn)css引用失敗的現(xiàn)象,博主還不明白原因。
這時(shí)候就可以在views中新建文件layout.ejs,然后復(fù)制書中112頁的layout.ejs代碼到我們新建的文件上面。然后運(yùn)行代碼,就能看到下面的效果了:
以上的步驟都不算什么問題,問題就出在連接數(shù)據(jù)庫的一系列問題!如下所述:
為了執(zhí)行下面的操作,我們首先需要安裝MongoDB數(shù)據(jù)庫,博主推薦這篇博客:http://be-evil.org/install-mongodb-on-windows7.html
看了不少安裝MongoDB的博客,這個(gè)是博主見過最有效的。
對于新版本的express,按照書本上那樣連接數(shù)據(jù)庫會報(bào)錯,連接數(shù)據(jù)庫需要的文件時(shí)settings.js,這個(gè)按照書上的來沒有問題,但是models中的db.js需要做一些改動。如果按照書中的代碼:
var settings = require('../settings');
var Db = require('mongodb').Db;
var Connection = require('mongodb').Connection;
var Server = require('mongodb').Server;
module.exports = new Db(settings.db, new Server(settings.host, Connection.DEFAULT_ PORT, {}));
可能會出現(xiàn)下面的問題:
博主google之后,才發(fā)現(xiàn)需要按照下面的格式書寫:
var settings = require('../settings'),
Db = require('mongodb').Db,
Connection = require('mongodb').Connection,
Server = require('mongodb').Server;
module.exports = new Db(settings.db, new Server(settings.host, Connection.DEFAULT_PORT, {}), {safe: true});
在引用settings模塊的時(shí)候,如果按照書中的:
var settings = require('../settings');
會出現(xiàn):
這是因?yàn)樽钚碌膃xpress版本中需要這樣引用這個(gè)模塊:
var settings = require('./settings');
但是解決了這個(gè)問題之后,相繼出現(xiàn)了下面這個(gè)令人蛋疼的情況:
一開始我也是琢磨不透,但是google的時(shí)候,有一個(gè)哥們做了很好的解答:
http://www.cnblogs.com/yumianhu/p/3709558.html
也就是說,在express4中我們需要自己安裝express-session包,然后添加引用:
var session = require('express-session');
原來的數(shù)據(jù)庫引用也需要改成:
var MongoStore = require('connect-mongo')(session);
而這些代碼:
app.use(express.session({
secret: settings.cookie_secret,
store:new MongoStore({
db: settings.db
})}));
就需要改寫成:
app.use(session({
secret: settings.cookie_secret,
store: newMongoStore({
db : settings.db,
})
}));
對于書中提到的視圖交互,原本的代碼是:
app.dynamicHelpers({
user: function(req, res) {
return req.session.user;
},
error: function(req, res) {
var err = req.flash('error');
if (err.length)
return err;
else
return null;
},
success: function(req, res) {
var succ = req.flash('success');
if (succ.length)
return succ;
else
return null;
},
});
在最新版本的express中需要改成:
app.use(function(req, res, next){
console.log("app.usr local");
res.locals.user = req.session.user;
res.locals.post = req.session.post;
var error = req.flash('error');
res.locals.error = error.length ? error : null;
var success = req.flash('success');
res.locals.success = success.length ? success : null;
next();
});
注冊頁面中用到了flash,但是最新版本的express已經(jīng)不支持flash了,你需要先使用npm install connect-flash。然后在app.js中添加如下代碼:
app.use(flash());
接下來按照書上的步驟走,基本不會出問題了,最后我們就能得到我們想要的效果啦~:
需要說明一下的是,跟著書本寫這個(gè)小應(yīng)用的時(shí)候,出現(xiàn)了很多問題,也就是上面遇到的很多問題,但是博主都是本著自主研究的精神不斷google,終于跳出神坑,得到了最后的效果,希望看到這篇博客的朋友好好研讀,也好好看看下面的鏈接,里面很可能也是你遇到的問題,如果你在跟著書本編寫代碼的過程中遇到了問題,歡迎一起交流~
以上就是本文的全部內(nèi)容了,請您花一點(diǎn)時(shí)間將文章分享給您的朋友或者留下評論。我們將會由衷感謝您的支持!
- Js仿新浪微博首頁內(nèi)容滾動
- Jquery與JS兩種方法仿twitter/新浪微博 高度自適應(yīng)無縫滾動實(shí)現(xiàn)代碼
- 基于js實(shí)現(xiàn)微信發(fā)送好友如何分享到朋友圈、微博
- JS 仿騰訊發(fā)表微博的效果代碼
- JS實(shí)現(xiàn)模仿微博發(fā)布效果實(shí)例代碼
- JS模擬的騰訊微博app撕紙效果的實(shí)例代碼
- js實(shí)現(xiàn)的仿新浪微博完美的時(shí)間組件升級版
- 仿新浪微博登陸郵箱提示效果的js代碼
- JS+CSS實(shí)現(xiàn)仿新浪微博搜索框的方法
- js控住DOM實(shí)現(xiàn)發(fā)布微博效果
相關(guān)文章
nodejs簡單實(shí)現(xiàn)操作arduino
本文給大家分享的是使用nodejs來驅(qū)動arduino,主要是基于cylonjs 和 gort,有需要的小伙伴可以參考下2016-09-09nodejs socket服務(wù)端和客戶端簡單通信功能
這篇文章主要為大家詳細(xì)介紹了nodejs socket服務(wù)端和客戶端簡單通信功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-09-09nodejs利用ajax實(shí)現(xiàn)網(wǎng)頁無刷新上傳圖片實(shí)例代碼
本篇文章主要介紹了nodejs利用ajax實(shí)現(xiàn)網(wǎng)頁無刷新上傳圖片實(shí)例代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06nodejs(officegen)+vue(axios)在客戶端導(dǎo)出word文檔的方法
這篇文章主要介紹了nodejs(officegen)+vue(axios)在客戶端導(dǎo)出word文檔的方法,需要的朋友可以參考下2018-07-07