- 簡(jiǎn)體
- 簡(jiǎn)體中文 English
[北京網(wǎng)站制作]基于Node.js、Express和Jscex開發(fā)的ToDo網(wǎng)站示例
基于Node.js、Express和Jscex開發(fā)的ToDo網(wǎng)站示例
Jscex的主要使用場(chǎng)景是“JavaScript異步編程”,不過并沒有限制是跑在瀏覽器還是服務(wù)器端。最近Node.js很火熱,也剛發(fā)布了原生的Windows版,不少同學(xué)會(huì)用它來做一些網(wǎng)站這樣的小程序。目前用Node.js開發(fā)網(wǎng)站最著名的框架是Express,使用起來也是比較容易的。前段時(shí)間看到CNodeJS社區(qū)的一篇文章,有同學(xué)將一個(gè)Python寫的ToDo列表網(wǎng)站移植到了Node.js上,我為了推廣Jscex,就fork了這個(gè)項(xiàng)目,將其修改為基于Jscex的版本,大伙兒可以來比較一下。當(dāng)然這個(gè)網(wǎng)站過于簡(jiǎn)單,我也正在尋找更合適的項(xiàng)目。(網(wǎng)站制作)
51CTO推薦專題:Node.js專區(qū)
JavaScript是一個(gè)沒有阻塞特性的語言,因此各類API都會(huì)設(shè)計(jì)為異步,這對(duì)于服務(wù)器的伸縮性和客戶端網(wǎng)頁的響應(yīng)能力都有好處,不過在程序編寫上就會(huì)遇到各種問題了。例如在ToDo示例中的一個(gè)簡(jiǎn)單的處理函數(shù),因?yàn)樾枰樵償?shù)據(jù)庫,就要寫成帶回調(diào)的樣子:
- exports.index = function (req, res, next) {
- db.query('select * from todo order by finished asc, id asc limit 50', function (err, rows) {
- if (err) return next(err);
- res.render('index', { todos: rows });
- });
- };
db變量用來操作MySQL數(shù)據(jù)庫,它的query方法傳入sql(可能還會(huì)有參數(shù))并提供一個(gè)回調(diào)函數(shù),用來提示錯(cuò)誤或是返回查詢結(jié)果。在回調(diào)中我們必須判斷err是否存在,如果存在便調(diào)用next報(bào)告框架“出錯(cuò)了”。每個(gè)異步操作都必須如此,試想如果在這個(gè)查詢后還有另一個(gè)查詢,則還需要進(jìn)行一次嵌套和err判斷。每個(gè)處理函數(shù)都是如此,這也是異步編程的煩惱之一:難以進(jìn)行統(tǒng)一的異常處理,處理代碼總是需要分散在各處,一不小心就變成“野異常”,還很難排查出來。
我將ToDo網(wǎng)站簡(jiǎn)單地Jscex化了一下。首先讓MySQL的查詢能夠接入Jscex(libjscex.mysql.js):
- exports.jscexify = function (db) {
- db.queryAsync = function () {
- var _this = this;
- var args = [];
- for (var i = 0; i < arguments.length; i++) {
- args.push(arguments[i]);
- }
- var delegate = {
- onStart: function (callback) {
- args.push(function (err, result) {
- if (err) {
- callback("failure", err);
- } else {
- callback("success", result);
- }
- });
- _this.query.apply(_this, args);
- }
- };
- return new Jscex.Async.Task(delegate);
- }
- }
一般來說,將一個(gè)異步接口給Jscex化并不需要那么多代碼(最關(guān)鍵的其實(shí)只是onStart函數(shù))。這里近30行代碼,其中大部分是為了支持“變長(zhǎng)”參數(shù),因此queryAsync函數(shù)會(huì)保留調(diào)用時(shí)的所有參數(shù),補(bǔ)上一個(gè)callback,再去調(diào)用query函數(shù)本身。此時(shí),便可以去改寫之前的index等處理函數(shù)了(controllerstodo.js),例如:
- exports.index = toHandler(eval(Jscex.compile("async", function (req, res) {
- var todos = $await(db.queryAsync('select * from todo order by finished asc, id asc limit 50'));
- res.render("index", { todos: todos });
- })));
toHandler函數(shù)的作用,是將一個(gè)“接受req和res,返回Task”的函數(shù),封裝成標(biāo)準(zhǔn)的“接受req、res和next三個(gè)參數(shù)”的處理函數(shù),并提供統(tǒng)一的錯(cuò)誤處理:
- var toHandler = function (asyncFunc) {
- return function (req, res, next) {
- var task = asyncFunc(req, res);
- task.addListener(function () {
- if (task.status == "failed") {
- next(task.error);
- }
- });
- task.start();
- }
- }
我在todo.js里保留了原有各個(gè)處理函數(shù)的實(shí)現(xiàn),感興趣的朋友可以對(duì)比一下它們之前的差別??上У氖牵捎赥oDo實(shí)在過于簡(jiǎn)單,Jscex的優(yōu)勢(shì)并沒有表現(xiàn)出來太多。例如,每個(gè)處理程序中只有一個(gè)MySQL查詢,沒有判斷和循環(huán),更別說為了充分利用IO并發(fā)能力,從而組合多個(gè)異步函數(shù)了。因此,我最近也一直在尋找更復(fù)雜一些的示例,不過似乎用Express的開源網(wǎng)站并不多見,我?guī)缀醵枷胱约簩懸粋€(gè)了。目前感覺Nodepad似乎還算不錯(cuò),接下來可能會(huì)對(duì)它下手。
ToDo網(wǎng)站依賴Express,ejs和MySQL驅(qū)動(dòng),同時(shí)我把Jscex作為添加為它的子模塊。如果您要克隆一份ToDo的代碼把玩一番,可以:
- > git clone git://github.com/JeffreyZhao/todo.git
- > cd todo
- > git submodule init
- > git submodule update
- > npm install express ejs mysql
- > node server.js
從現(xiàn)在開始,我會(huì)在InfoQ中文站上發(fā)表一系列關(guān)于Jscex的文章,既有關(guān)于瀏覽器端的JavaScript開發(fā),也有在服務(wù)器端利用Node.js開發(fā)的內(nèi)容。可能您目前還可能會(huì)有所疑惑,例如為什么要使用危險(xiǎn)的eval函數(shù),eval和Jscex.compile函數(shù)不能封裝起來嗎?其實(shí)在看了我的文章并對(duì)Jscex有了基本了解之后,就會(huì)發(fā)現(xiàn)這些都是以“傳統(tǒng)眼光”來看待Jscex時(shí)所形成的誤解。Jscex的做法的確“另辟蹊徑”,否則在JavaScript異步類庫已經(jīng)多如牛毛的情況下,我不知如何讓它脫穎而出。(高端網(wǎng)站建設(shè))
建站流程
-
網(wǎng)站需求
-
網(wǎng)站策劃方案
-
頁面設(shè)計(jì)風(fēng)格
-
確認(rèn)交付使用
-
資料錄入優(yōu)化
-
程序設(shè)計(jì)開發(fā)
-
后續(xù)跟蹤服務(wù)
-
聯(lián)系電話
010-60259772
熱門標(biāo)簽
- 網(wǎng)站建設(shè)
- 食品網(wǎng)站建設(shè)
- 微信小程序開發(fā)
- 小程序開發(fā)
- 無錫網(wǎng)站建設(shè)
- 研究所網(wǎng)站建設(shè)
- 沈陽網(wǎng)站建設(shè)
- 廊坊網(wǎng)站建設(shè)
- 鄭州網(wǎng)站建設(shè)
- 婚紗攝影網(wǎng)站建設(shè)
- 手機(jī)端網(wǎng)站建設(shè)
- 高校網(wǎng)站制作
- 天津網(wǎng)站建設(shè)
- 教育網(wǎng)站建設(shè)
- 品牌網(wǎng)站建設(shè)
- 政府網(wǎng)站建設(shè)
- 北京網(wǎng)站建設(shè)
- 網(wǎng)站設(shè)計(jì)
- 網(wǎng)站制作
最新文章
推薦新聞
更多行業(yè)-
中小企業(yè)應(yīng)重視網(wǎng)站規(guī)劃
網(wǎng)站策劃逐漸被各個(gè)企業(yè)重視。這項(xiàng)工作在企業(yè)網(wǎng)站建設(shè)中起著核心作用,是網(wǎng)...
2021-03-04 -
網(wǎng)站制作后期怎樣優(yōu)化關(guān)鍵詞
很多Seoer寫的方案,只有涉及到一些對(duì)于網(wǎng)站制作的分析診斷、網(wǎng)站的改...
2012-07-23 -
好的網(wǎng)站建設(shè)應(yīng)該有這些考慮
發(fā)展品牌網(wǎng)站的服務(wù)性能是問題的關(guān)鍵,更多的表現(xiàn)在三個(gè)方面:安全穩(wěn)定、輕...
2020-12-25 -
北京外貿(mào)營(yíng)銷網(wǎng)站建設(shè)費(fèi)用多少?
網(wǎng)站規(guī)模是決定費(fèi)用的主要因素之一。一個(gè)小型的外貿(mào)營(yíng)銷網(wǎng)站只包含少量的頁...
2023-04-14 -
企業(yè)建站如何布局上線才能吸引更多用戶量
一個(gè)網(wǎng)站有著一定的用戶量,才能夠在流量轉(zhuǎn)化方面的效率上明顯的提高。近年...
2020-07-15 -
南京網(wǎng)站建設(shè)如何設(shè)計(jì)橫幅圖?
橫幅設(shè)計(jì)其實(shí)是我們?cè)诰W(wǎng)站建設(shè)中最常見的工作。那么橫幅到底是什么?Ban...
2022-07-14
預(yù)約專業(yè)咨詢顧問溝通!
免責(zé)聲明
非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前,請(qǐng)您仔細(xì)閱讀本聲明的所有條款。
1、本站部分內(nèi)容來源自網(wǎng)絡(luò),涉及到的部分文章和圖片版權(quán)屬于原作者,本站轉(zhuǎn)載僅供大家學(xué)習(xí)和交流,切勿用于任何商業(yè)活動(dòng)。
2、本站不承擔(dān)用戶因使用這些資源對(duì)自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國(guó)家有關(guān)法律法規(guī),當(dāng)本聲明與國(guó)家法律法規(guī)沖突時(shí),以國(guó)家法律法規(guī)為準(zhǔn)。
4、如果侵害了您的合法權(quán)益,請(qǐng)您及時(shí)與我們,我們會(huì)在第一時(shí)間刪除相關(guān)內(nèi)容!
聯(lián)系方式:010-60259772
電子郵件:394588593@qq.com