day11--express學(xué)習(xí)筆記

安裝express框架

備注:這個需要root權(quán)限
npm  install -g express-generator 全局安裝express框架
express -V可查詢express是否安裝成功
express -h 選項可列出所有可用的命令行選項

express建項目

在你想要生成項目的文件夾中執(zhí)行命令:
express myapp
創(chuàng)建項目時生成的文件及文件夾

然后cd進(jìn)入新建項目的目錄,安裝所有依賴包(主要是根據(jù)package.json這個文件里面的包進(jìn)行搜索安裝)

cd myapp
npm install
安裝的過程可能會比較緩慢,這個主要看網(wǎng)速了...不過我一下子就好了
然后cd進(jìn)入項目中bin目錄,啟動項目
./www
如果在項目外可執(zhí)行./bin/www
最后在瀏覽器中輸入你當(dāng)前服務(wù)器ip地址以及端口號3000,便可以訪問...

express生成的應(yīng)用目錄結(jié)構(gòu)

|--  app.js
|--  bin
|     I__  www
|--  package.json
|--  public
|     I__  images
|     I__  javascripts
|     I__  stylesheets
|             I__style.css
I__  views
        |--  index.jade
        I--  error.jade
        I--  layout.jade

目錄詳細(xì)介紹

目錄結(jié)構(gòu)

bin 存放啟動項目的腳本文件
node_modules 項目所有依賴的庫,以及存放
package.json中安裝的模塊,添加依賴的模塊并安
裝后,存放在這個文件夾下
public 靜態(tài)文件(css,js,img)
routes 路由文件(mvc中cotroller)
views 頁面文件(jade模板) 可以更換模板ejs
package.json 存儲著工程的信息及模塊依賴
app.js 應(yīng)用核心配置文件(入口文件)
package.json文件
package.json用于項目依賴配置及開發(fā)者信
息,scripts屬性時用于定義操作命令,可以非常方便
的添加啟動命令,比如默認(rèn)的start,用npm start代表
執(zhí)行node ./bin/www命令.擋在dependencies中添
加依賴的模塊時,運行npm install,npm會檢查當(dāng)前
目錄下的package.json,并自動安裝所有指定的模塊

app.js 核心文件,也是項目入口文件

var express = require('express');
//用于處理目錄的對象,提高開發(fā)效率
var path = require('path');
//用于加載圖標(biāo)
var favicon = require('serve-favicon');
/在控制臺中,顯示req請求的信息
var logger = require('morgan');
//加載cooike模塊,用于獲取web瀏覽器發(fā)送的cookie中的內(nèi)容
var cookieParser = require('cookie-parser');
//解析客戶端請求的body中的內(nèi)容,內(nèi)部使用json編碼處理,url編碼處理以及對于文件的上傳處理
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var users = require('./routes/users');

//生成一個express實例app
var app = express();

// view engine setup
//設(shè)置views文件夾,__dirname是node.js里面的全局變量,取得執(zhí)行js所在的路徑
app.set('views', path.join(__dirname, 'views'));
//視圖引擎設(shè)置
app.set('view engine', 'jade');

// uncomment after placing your favicon in /public
//定義icon圖標(biāo),參數(shù)為圖標(biāo)的路勁,如果不指明,則用默認(rèn)的express圖標(biāo)
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
//加載日志中間件,定義日志和輸出級別
app.use(logger('dev'));
//加載解析json的中間件,接收json請求
app.use(bodyParser.json());
//加載解析urlencodeed請求體的中間件
app.use(bodyParser.urlencoded({ extended: false }));
//加載cookie的中間件
app.use(cookieParser());
//靜態(tài)文件目錄設(shè)置,設(shè)置public文件夾為存放靜態(tài)文件的目錄
app.use(express.static(path.join(__dirname, 'public')));

//路由控制器
app.use('/', routes);
app.use('/users', users);

//捕捉404錯誤,并轉(zhuǎn)發(fā)到錯誤處理器
// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers
//開發(fā)環(huán)境下的500錯誤處理器,將錯誤信息渲染error模板并顯示到瀏覽器中
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

//生產(chǎn)環(huán)境下的錯誤處理器,將錯誤信息渲染error模板并顯示到瀏覽器中
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});

//導(dǎo)出app實例供其他模塊調(diào)用
module.exports = app;

bin/www文件
www文件內(nèi)容:這里擁有著http服務(wù)器基本配置,www文件也是一個node腳本,用于分離配置和啟動程序時用,代碼如下:

edwin@edwinxdf:~/express_demo/myapp/bin$ vim  www
//表明是node可執(zhí)行文件
#!/usr/bin/env node

/**
 * Module dependencies.
 */
//引入上面導(dǎo)出的app實例
var app = require('../app');
//引入debug模塊,打印調(diào)試日志
var debug = require('debug')('myapp:server');
var http = require('http');

/**
 * Get port from environment and store in Express.
 */
//定義啟動端口
var port = normalizePort(process.env.PORT || '3000');
app.set('port', port);

/**
 * Create HTTP server.
 */

var server = http.createServer(app);

/**
 * Listen on provided port, on all network interfaces.
 */

server.listen(port);
server.on('error', onError);
server.on('listening', onListening);

/**
 * Normalize a port into a number, string, or false.
 */
//端口標(biāo)準(zhǔn)化函數(shù)
function normalizePort(val) {
  var port = parseInt(val, 10);

  if (isNaN(port)) {
    // named pipe
    return val;
  }

  if (port >= 0) {
    // port number
    return port;
  }

  return false;
}

/**
 * Event listener for HTTP server "error" event.
 */
//HTTP異常事件處理函數(shù)
function onError(error) {
  if (error.syscall !== 'listen') {
    throw error;
  }

  var bind = typeof port === 'string'
    ? 'Pipe ' + port
    : 'Port ' + port;

  // handle specific listen errors with friendly messages
  switch (error.code) {
    case 'EACCES':
      console.error(bind + ' requires elevated privileges');
      process.exit(1);
      break;
    case 'EADDRINUSE':
      console.error(bind + ' is already in use');
      process.exit(1);
      break;
    default:
      throw error;
  }
}

/**
 * Event listener for HTTP server "listening" event.
 */
//事件綁定函數(shù)
function onListening() {
  var addr = server.address();
  var bind = typeof addr === 'string'
    ? 'pipe ' + addr
    : 'port ' + addr.port;
  debug('Listening on ' + bind);
}

routes
生成一個路由實例用來捕獲訪問主頁的get請求,導(dǎo)出這個路由并在app.js中通過app.use("/",routes);加載,這樣當(dāng)訪問主頁時,就會調(diào)用res.render("index",{'title':'Express'});渲染views/index.jade模板并顯示到瀏覽器中

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;
關(guān)于路由,路由中有兩個常用功能:
app.route()函數(shù),創(chuàng)建可連接的途徑處理程序的路由路徑
express.Router類,創(chuàng)建模塊化安裝路徑的處理程序
app.Route方法會返回一個Route實例,它可以繼續(xù)使用所有的HTTP方法,包括get,post,all,put,delete,head等
app.route('/users')
    .get(function(req,res,next){})
    .post(function(req,res,next){})

express.Router類,則可以幫助我們更好的組織代碼結(jié)構(gòu),在app.js文件中,定義了app.use('/',routes);routes是指向了routes目錄下的index.js文件,./routes/index.js文件中,express.Router被定義使用,路徑/*處理都會由routes/index.js文件里的Router來處理,如果我們要管理不同的路口經(jīng),那么可以直接配置為多個不同的Router
1 app.use('/user', require('./routes/user').user);
2 app.use('/admin',require('./routes/admin').admin);
3 app.use('/', require('./routes'));
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容