<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    TWaver - 專注UI技術

    http://twaver.servasoft.com/
    posts - 171, comments - 191, trackbacks - 0, articles - 2
      BlogJava :: 首頁 :: 新隨筆 :: 聯系 :: 聚合  :: 管理
    @import url(http://www.tkk7.com/CuteSoft_Client/CuteEditor/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/css/cuteeditor.css);
    接上一篇TWaver HTML5 + Node.js + express + socket.io + redis(五), 這一篇將講解如何用模版生成html頁面, 如何驗證用戶登錄, 您將了解到:
    1. 模版引擎jade
    2. 使用express的session功能
    一. 用jade生成登陸界面
    用express就不得不了解一下模版引擎, 比較流行的是jadeejs, 這里以jade為例:
    1. 安裝jade:
    npm install jade

    2. 配置express使用jade
    1 //設置express使用jade作為模版引擎
    2 server.set('view engine', 'jade');
    3 //設置jade模版的目錄
    4 server.set('views', __dirname + '/views');

    3. 配置jade模版
    在主程序目錄創建views目錄, 在views目錄添加layout.jade文件(layout文件用于指定所有頁面的模版), 內容如下:
    1 !!! 5
    2 html
    3   include header
    4   body!= body
    再添加header.jade文件, 內容如下:
    1 head
    2   title TWaver HTML5 Demo
    3   script(type='text/javascript', src='/socket.io/socket.io.js')
    4   script(type='text/javascript', src='/twaver.js')
    5   script(type='text/javascript', src='/demo.js')

    4. 生成登陸界面和主界面
    添加login.jade文件, 內容如下:
    1 form(action='/login', method='post')
    2   label Name:
    3   input(name='name', type='text')
    4   input(name='password', type='password')
    5   input(type='submit', value='Login')
    再添加index.jade文件, 內容如下:
    1 body(onload="init()")

    5. 添加登錄和主頁路由:
    1 //添加登錄路由
    2 server.get('/login', function (req, res) {
    3     res.render('login');
    4 });
    5 //添加主頁路由
    6 server.get('/', function (req, res) {
    7     res.render('index');
    8 });
    9 
    啟動node, 用瀏覽器打開http://localhost:8080/login, 看看效果:
    再打開http://localhost:8080/, 內容和上一章看到的一樣, demo目錄的demo.html可以刪掉了:

    二. 配置express, 驗證用戶
    1. 啟用session, 表單和cookie解析功能
    1 //設置表單和cookie解析器
    2 server.use(express.bodyParser());
    3 server.use(express.cookieParser());
    4 //啟用session
    5 server.use(express.session({secret: 'anything', key: 'express.sid'}));
    6 

    2. 添加登陸post路由, 將用戶名信息存入session中
    1 //登陸post路由
    2 server.post('/login', function (req, res) {
    3     var name = req.body.name;
    4     var password = req.body.password;
    5     req.session.user = name;
    6     res.redirect('/');
    7 });
    8 

    3. 修改主頁路由, 判斷如果沒有登陸就重定向到登陸界面:
    1 server.get('/', function (req, res) {
    2     if (req.session.user) {
    3         res.render('index');
    4     } else {
    5         res.redirect('/login');
    6     }
    7 });
    再用瀏覽器打開http://localhost:8080/, 會出現登陸界面, 輸入任意非空用戶名后, 即可登陸

    本文完整demo見附件, 下一講將介紹加密密碼, 漢化i18n等內容
    另外, 一個小技巧:客戶端ji里生成socket時, 需要指定ip和端口, 如果是本機, 可以直接:socket = io.connect('http://' + location.hostname + '/', { port: location.port });


    評論

    # re: TWaver HTML5 + Node.js + express + socket.io + redis(六)  回復  更多評論   

    2012-04-03 12:51 by 分紅商城
    我想學習nodejs。不過不知道使用什么nosql數據庫比較好。能推薦一個嗎?

    # re: TWaver HTML5 + Node.js + express + socket.io + redis(六)  回復  更多評論   

    2012-04-03 13:24 by TWaver
    MongoDB(http://www.mongodb.org)和Reids(http://redis.io)都可以考慮下

    # re: TWaver HTML5 + Node.js + express + socket.io + redis(六)  回復  更多評論   

    2012-05-23 15:42 by 學習nodejs
    學習,能繼續講講加密密碼嗎

    只有注冊用戶登錄后才能發表評論。


    網站導航:
     
    主站蜘蛛池模板: jlzzjlzz亚洲乱熟在线播放| 免费观看激色视频网站bd| 成年丰满熟妇午夜免费视频| 亚洲免费在线视频| 国产精品白浆在线观看免费| MM131亚洲国产美女久久| 国产精品综合专区中文字幕免费播放 | 中文字幕av免费专区| 久久夜色精品国产亚洲av| eeuss在线兵区免费观看| 亚洲一区二区三区在线观看精品中文| 一级成人生活片免费看| 亚洲精品乱码久久久久久按摩| 国产精品一区二区三区免费| 亚洲国产精品一区二区久久hs| 99免费在线视频| 亚洲一区二区成人| 亚洲AV永久无码精品水牛影视| 在线观看免费黄网站| 亚洲一二成人精品区| 国产啪精品视频网免费| 国产在线a不卡免费视频| 黄网站色视频免费看无下截| 亚洲色欲久久久久综合网| 免费91麻豆精品国产自产在线观看| 亚洲人成在线影院| 成人一a毛片免费视频| 成年免费大片黄在线观看com| 亚洲av午夜福利精品一区| 免费99精品国产自在现线| 午夜亚洲乱码伦小说区69堂| 日韩亚洲欧洲在线com91tv| 国产成人yy免费视频| 黄色网址在线免费观看| 亚洲国产第一页www| 夫妻免费无码V看片| jizz免费一区二区三区| 亚洲福利一区二区| 丁香亚洲综合五月天婷婷| 99久久99久久精品免费观看| 亚洲AV无码专区在线电影成人|