首頁 > web前端 > js教程 > Nodejs的express使用教學(附程式碼)

Nodejs的express使用教學(附程式碼)

PHPz
發布: 2018-10-13 16:12:55
原創
1312 人瀏覽過

Express 是一個簡潔、靈活的 node.js Web 應用開發框架, 它提供一系列強大的特性,幫助你創建各種 Web 和行動裝置應用。

1.express組織結構

app demo

    |---node_modules------用於安裝本地模組。
    |---public------------用來存放使用者可以下載到的文件,例如圖片、腳本、樣式表等。
    |---routes------------用來存放路由文件。
    |---views-------------用來存放網頁的範本。
    |---app.js------------應用程式的啟動腳本。
    |---package.json------專案的設定檔。

2..建立express伺服器

//app.js文件
var express = require('express');
var app = express();
//指定更目录显示的内容
app.get('/', function(req, res){
 res.send('Hello World');
});
//指定监听端口
var server = app.listen(3000, function() {
  console.log('Listening on port %d', server.address().port);
});
登入後複製

執行nodejs>

執行nodejs>

/>node app.js

3.中間件


中間件(middleware)就是處理HTTPiddleware. >當一個HTTP請求進入伺服器,伺服器實例會呼叫第一個中間件,完成後根據設置,決定是否再呼叫下一個中間件.

中間件的參數為:

.四個的時候---第一個為錯誤處理,第二個為客戶請求request,第三個為伺服器回應respond,第四個為next中間件. 如function(error, request, response , next){}

.三個的時候---第一個客戶請求request,第二個為伺服器回應respond,第三個為next中間件. 如function(request, response, next){} .兩個的時候---第一個客戶請求request,第二個為伺服器回應respondfunction. 如function(request, response){}

4.使用中間件use

app.use(function(request, response) {
 response.writeHead(200, { "Content-Type": "text/plain" });
 response.end("Hello world!\n");
});
登入後複製
use是express呼叫中間件的方法,它傳回一個函數.

5.錯誤內容顯示
app.use(express.bodyParser());//使用body参数
app.use(express.methodOverride());//使用函数覆盖
app.use(app.router);//使用路由
app.use(function(err, req, res, next){
 console.error(err.stack);
 res.send(500, 'Something broke!');
});//错误内容显示
登入後複製

6.路由

6.路由





app.get("*", function(request, response) {
 response.end("404!");
});//所有路径都返回404
登入後複製

app.get("/hello/:who", function(req, res) {
 res.end("Hello, " + req.params.who + ".");
});//如"/hello/alice”网址,网址中的alice将被捕获,作为req.params.who属性的值
登入後複製


express路由的方式有很多種,這裡舉例常用的幾種:.app.use('/', middleware);//get/post時,對於路徑/的處理.app.get("/", middleware);//http中get時,路徑/的處理

.app.post("/", middleware);//http中post時,路徑/的處理

.app.put("/", middleware);//http中put時,路徑/的處理
.app.delete("/", middleware);//http中delete時,對於路徑/的處理

7.路徑通配符*

.*表示所有路徑


.:捕獲路徑內容

8.設定環境變數set

用於指定變數的值.app.set("view engine", "ejs");//使用ejs作為模版

9.response物件方法
{
  "name": "demo",
  "description": "My First Express App",
  "version": "0.0.1",
  "dependencies": {
   "express": "3.x"
  }
}
登入後複製

.重定向redirect    response.redirect("/hello/anime");//重定向到/hello/anime

.傳送檔案sendFile

   response.sendFile("/path/to/anime.mp4");.渲染網頁範本render,也就是將變換的內容載入到網頁.    response.render("index", { message: "Hello World" });//將message變數傳入index模板,值為"Hello World"渲染成HTML網頁

10.requst物件方法
//app.js
app.get('/', function(req, res) {
  res.render('index',{title:"最近文章"});
});
//index.js
this is !
登入後複製
.取得客戶ip位址:request.ip.取得上傳的檔案:request.files11.啟動腳本package.jsonpackage.json用於指定app信息,nodejs版本號和其他組件的依賴關係12.app入口app.jsapp.js主要包含http的創建,基本路由,監聽埠號 13.動態網頁範本viewsviews資料夾,用來存放所有的放網頁範本.

14.指定靜態網頁目錄

//app.js
app.use(express.static('public'));/ /指定靜態網頁目錄,當瀏覽器發出非HTML檔案請求時,伺服器端就到public目錄尋找這個檔案

如:, 伺服器端就到public/bootstrap/css/目錄尋找bootstrap.css文件

好了,本教學先給大家介紹到這裡,後續還會持續給大家更新,謝謝大家一直以來對PHP中文網的支持。

【相關教學推薦】

1. JavaScript影片教學
2. JavaScript線上手冊
3. bootstrap教學

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板