【Nodejs】Expressの基本的な使い方

ここに画像の説明を挿入

エクスプレス中国語ウェブサイト

Node.js プラットフォームをベースとした、高速かつオープンで最小限の Web 開発フレームワークです。

1.Expressのインストール方法

Express のインストールでは、npm パッケージマネージャー上のプロジェクトを直接使用できます。npm をインストールする前に、まず Taobao イメージをインストールできます。
npm install -g cnpm --registry=https://registry.npmmirror.com/

この方法では、npm の代わりに cnpm を使用するため、ダウンロード速度が大幅に速くなります。次に、プロジェクトディレクトリで次のコマンドを実行して npm を初期化し、すべてのプロンプトで Enter キーを押す必要があります。これにより、package.json が生成されます。プロジェクトファイルを記述するために使用されます。

cnpm init

再入力

cnpm install

これで、プロジェクトディレクトリに別の node_modules フォルダーが作成され、node.js によって提供されるモジュールが含まれますが、もちろん、現在そのようなフォルダーはありません。次のステップでは、実際に Express をインストールし、以下を実行します。

cnpm install express --save

この時点で、node_modules フォルダー内にさまざまなバージョンのアプリケーションフォルダーがあることがわかり、次のコマンドを実行します。

express --version

Express が正常にインストールされているか確認し、バージョン番号が表示されていれば正常にインストールされています。

4.16.1

2. 動作原理

最下層: http モジュール

Express フレームワークは、node.js の組み込み http モジュールの上に構築されます。httpモジュールでサーバーを生成する元のコードは以下のとおりです。

var http = require("http");

var app = http.createServer(function(request, response) {
    
    
  response.writeHead(200, {
    
    "Content-Type": "text/plain"});
  response.end("Hello world!");
});

app.listen(3000, "localhost");

Express フレームワークの中核は、http モジュールの再パッケージ化です。上記のコードは Express で次のように書き換えることができます。

var express = require('express');
var app = express();

app.get('/', function (req, res) {
    
    
  res.send('Hello world!');
});

app.listen(3000);

Express フレームワークは、http モジュールの上に中間層を追加することに相当します。

ミドルウェアとは何ですか

ミドルウェアとは簡単に言うと、HTTPリクエストを処理する機能です。最大の特徴は、あるミドルウェアが処理された後、次のミドルウェアに引き継がれることです。アプリインスタンスが実行されると、一連のミドルウェアが呼び出されます。
各ミドルウェアは、リクエストオブジェクト (HTTP リクエストを表す)、レスポンスオブジェクト (HTTP レスポンスを表す)、次のコールバック関数 (次のミドルウェア)。各ミドルウェアは、HTTP リクエスト (リクエストオブジェクト) を処理し、次のメソッドを呼び出すかどうかを決定し、リクエストオブジェクトを次のミドルウェアに渡すことができます。
何もせずリクエストオブジェクトを渡すだけのミドルウェアは以下のとおりです。

function uselessMiddleware(req, res, next) {
    
    
  next();
}

上記のコードの次は次のミドルウェアです。パラメータがある場合はエラーをスローすることを意味し、パラメータはエラーテキストです
エラーがスローされた後、エラー処理関数が見つかるまで次のミドルウェアは実行されません。

function uselessMiddleware(req, res, next) {
    
    
  next('出错了！');
}

3. エクスプレス方式

エクスプレスルーティングの概要

ルートは、アプリケーションエンドポイント (URI) の定義とクライアント要求への応答方法を表します。リクエスタ（メソッド）、パス（パス）、およびルートが一致する場合の関数（コールバック）が含まれます。

app.methods(path, callback);

エクスプレスルーティング方式

Express メソッドは、Express クラスのインスタンスに付加された HTTP メソッドの 1 つから派生します。リクエストできるメソッドには次のものがあります
get、post、put、head、delete、options、trace、copy、lock、mkcol、move、purge、propfind、proppatch、unlock、report、mkactivity、checkout、merge、m-search、notify、subscribe、unsubscribe、patch、search 和 connect。

ルーティングとは、アプリケーションエンドポイント (URI) を定義する方法と、クライアントの要求に応答する方法を指します。
ルーティングは、URI、HTTP リクエスト (GET、POST など)、およびいくつかのハンドルで構成され、その構造は次のとおりです: app.METHOD(path, [callback…], callback)、app は Express オブジェクト、METHOD のインスタンスです。は HTTP リクエストメソッド、path はサーバー上のパス、callback はルートが一致したときに実行する関数です。

基本的なルーティングの例を次に示します。

var express = require('express');
var app = express();

// respond with "hello world" when a GET request is made to the homepage
app.get('/', function(req, res) {
    
    
  //写完一个send，后面所有跟路由有关的都不会执行
  //会自动响应对应的数据类型
  //   res.send([1, 2, 3]);
  //   res.send({ ok: 1 });
  //   res.json({ ok: 1 });
   // 使用混合使用函数数组处理时如果前面有res.send();那么后面和路由处理相关代码都不生效
  res.send('hello world');
  res.send(`
        <html>
            <h1>hello world</h2>
        </html>
    `);
});

ルートパスとリクエストメソッドは、文字列、文字列パターン、または正規表現のいずれかであるリクエストのエンドポイントを定義します。

all メソッドと HTTP 動詞メソッド

さまざまなリクエストに対して、Express は use メソッドにいくつかのエイリアスを提供します。たとえば、上記のコードはエイリアスの形式で記述することもできます。

var express = require("express");
var http = require("http");
var app = express();

app.all("*", function(request, response, next) {
    
    
  response.writeHead(200, {
    
     "Content-Type": "text/plain" });
  next();
});

app.get("/", function(request, response) {
    
    
  response.end("Welcome to the homepage!");
});

app.get("/about", function(request, response) {
    
    
  response.end("Welcome to the about page!");
});

app.get("*", function(request, response) {
    
    
  response.end("404!");
});

http.createServer(app).listen(1337);

上記のコードの all メソッドは、すべてのリクエストがミドルウェアを通過する必要があることを意味し、パラメーター内の「*」は、それがすべてのパスに対して有効であることを意味します。get メソッドは、GET 動詞の HTTP リクエストのみがミドルウェアを通過し、その最初のパラメーターはリクエストのパスです。getメソッドのコールバック関数は次のメソッドを呼び出さないため、1つのミドルウェアが呼び出される限り、後続のミドルウェアが再度呼び出される事はありません。
get メソッドに加えて、Express は post、put、delete メソッドも提供します。つまり、HTTP 動詞は Express メソッドです。
get メソッドに加えて、Express は post、put、delete メソッドも提供します。つまり、HTTP 動詞は Express メソッドです。
これらのメソッドの最初のパラメータはリクエストのパスです。Express では、絶対一致に加えてパターンマッチングも可能です

app.get("/hello/:who", function(req, res) {
    
    
  res.end("Hello, " + req.params.who + ".");
});

4. パスマッチング

4.1 文字列パス

// 匹配根路径的请求
app.get('/', function (req, res) {
    
    
  res.send('root');
});

// 匹配 /about 路径的请求
app.get('/about', function (req, res) {
    
    
  res.send('about');
});

// 匹配 /random.text 路径的请求
app.get('/random.text', function (req, res) {
    
    
  res.send('random.text');
});

4.2 文字列パターンのパス

文字列パターンを使用したルートパスの例:

// 匹配 acd 和 abcd
app.get('/ab?cd', function(req, res) {
    
    
  res.send('ab?cd');
});

// 匹配 abcd、abbcd、abbbcd等
app.get('/ab+cd', function(req, res) {
    
    
  res.send('ab+cd');
});

// 匹配 abcd、abxcd、abRABDOMcd、ab123cd等
app.get('/ab*cd', function(req, res) {
    
    
  res.send('ab*cd');
});

// 匹配 /abe 和 /abcde
app.get('/ab(cd)?e', function(req, res) {
    
    
 res.send('ab(cd)?e');
});

4.3 正規表現パス

正規表現を使用したルーティングパスの例:

// 匹配任何路径中含有 a 的路径：
app.get(/a/, function(req, res) {
    
    
  res.send('/a/');
});

// 匹配 butterfly、dragonfly，不匹配 butterflyman、dragonfly man等
app.get(/.*fly$/, function(req, res) {
    
    
  res.send('/.*fly$/');
});

リクエスト処理には、ミドルウェアのように動作する複数のコールバック関数を提供できます。唯一の違いは、これらのコールバックが他のルートコールバックをバイパスしながら next('route') メソッドを呼び出す可能性があることです。このメカニズムはルートの前提条件を定義するために使用でき、既存のパスを続行することが意味がない場合は、制御を残りのパスに渡すことができます。

app.get('/example/a', function (req, res) {
    
    
  res.send('Hello from A!');
});

複数のコールバック関数を使用してルーティングを処理します (次のオブジェクトを指定することを忘れないでください)。

app.get('/example/b', function (req, res, next) {
    
    
  console.log('response will be sent by the next function ...');
  next();
}, function (req, res) {
    
    
  res.send('Hello from B!');
});

コールバック関数の配列を使用してルーティングを処理します。

var cb0 = function (req, res, next) {
    
    
  console.log('CB0')
  next()
}

var cb1 = function (req, res, next) {
    
    
  console.log('CB1')
  next()
}

var cb2 = function (req, res) {
    
    
  res.send('Hello from C!')
}

app.get('/example/c', [cb0, cb1, cb2])

5. 応答オブジェクト

方法	説明
res.download()	ファイルをダウンロードするように求めるプロンプトが表示されます。
レス終了（）	応答プロセスを終了します。
res.json（）	JSON 応答を送信します。
res.jsonp（）	JSONP サポートを使用して JSON 応答を送信します。
res.リダイレクト（）	リダイレクトリクエスト。
解像度レンダリング（）	ビューテンプレートをレンダリングします。
再送信（）	さまざまな種類の応答を送信します。
res.sendFile（）	ファイルをオクテットストリームとして送信します。
res.sendStatus()	応答ステータスコードを設定し、その文字列表現を応答本文として送信します。

例：
（1）response.redirect方法

response.redirect メソッドにより URL リダイレクトが可能になります

response.redirect("/hello/anime");
response.redirect("http://www.example.com");
response.redirect(301, "http://www.example.com");

(2)response.sendFileメソッド

ファイルの送信には、response.sendFile メソッドが使用されます。

response.sendFile("/path/to/anime.mp4");

（3）response.render方法

response.render メソッドは、Web ページテンプレートをレンダリングするために使用されます。

//  使用render方法，将message变量传入index模板，渲染成HTML网页
app.get("/", function(request, response) {
    
    
  response.render("index", {
    
     message: "Hello World" });
});

6. ルートハンドラー

リクエストを処理するミドルウェアのように動作する複数のコールバック関数を提供できます。唯一の例外は、これらのコールバックが next('route') を呼び出して残りのルーティングコールバックをバイパスする場合があることです。このメカニズムを使用すると、ルートに前提条件を課し、現在のルートを使用し続ける理由がない場合に後続のルートに制御を渡すことができます。

複数のコールバック関数で 1 つのルートを処理できます (必ず次のオブジェクトを指定してください)。例えば：

app.get('/example/b', function (req, res, next) {
    
    
  console.log('the response will be sent by the next function ...')
  next()
}, function (req, res) {
    
    
  res.send('Hello from B!')
})

ルーティング用の関数と関数の配列の混合:

const fun1 = (req, res, next) => {
    
    
  // 验证用户token过期, cookie过期
  console.log('token验证');
  let isValid = true;
  if (isValid) {
    
    
    next();
  } else {
    
    
    //将第一个中间件的数据传输到第二个中间件
    res.name = "dselegent";
    res.send('error');
  }
};
const fun2 = (req, res) => {
    
    
   console.log(res.name)
  res.send('home');
};
app.get('/home', [fun1, fun2]);

app.get('/list', fun1, (req, res) => {
    
    
  res.send('list');
});

7. ミドルウェア

Express は最小限の機能を備えた Web 開発フレームワークであり、ルーティングとミドルウェアで完全に構成されており、基本的に Express アプリケーションはさまざまなミドルウェアを呼び出しています。

ミドルウェア(Middleware)とは、Webアプリケーションにおけるリクエスト・レスポンスのループ処理において、リクエストオブジェクト(リクエストオブジェクト(req))、レスポンスオブジェクト(レスポンスオブジェクト(res))、およびミドルウェアにアクセスできる機能であり、一般にAと呼ばれます。次の変数。

ミドルウェア機能には次のものが含まれます。

任意のコードを実行します。
リクエストとレスポンスのオブジェクトを変更します。
リクエストとレスポンスのループを終了します。
コールスタック内の次のミドルウェア。

現在のミドルウェアが要求と応答のループを終了しない場合は、 next() メソッドを呼び出して制御を次のミドルウェアに渡す必要があります。そうしないと、要求がハングします。

Express アプリケーションは次のミドルウェアを使用できます。

アプリケーションレベルのミドルウェア
ルーターレベルのミドルウェア
エラー処理ミドルウェア
組み込みミドルウェア
サードパーティのミドルウェア

ミドルウェアは、オプションのマウントパスを使用して、アプリケーションレベルまたはルートレベルでマウントできます。さらに、一連のミドルウェア機能を同時にマウントして、マウントポイントにサブミドルウェアスタックを作成することもできます。

7.1 アプリケーションレベルのミドルウェア

アプリケーションレベルのミドルウェアは、app.use() および app.METHOD() を使用してアプリオブジェクトにバインドされます。METHOD は、GET、PUT、POST など、処理する必要がある HTTP リクエストのメソッドです。小文字。例えば：

var app = express()
const indexRouter = require('./route/indexRouter');
const LoginRouter = require('./route/LoginRouter');

//应用级别(后面的路由都会执行此中间件)
app.use((req, res, next) => {
    
    
  // 验证用户token过期, cookie过期
  console.log('token验证');
  let isValid = true;
  if (isValid) {
    
    
    next();
  } else {
    
    
    res.send('error');
  }
});

//应用级别(这里不写路径默认/)
//这些use方法是每次访问都是从上往下执行
//如果是/login/a,会先找到/login开头的这个应用级中间件
//然后再进入这个中间件找/a
app.use(indexRouter);
app.use('/login', LoginRouter);

7.2 ルーターレベルのミドルウェア

(1) app.route()
app.route() を使用して、ルートパスのチェーン可能なルートハンドラーを作成できます。パスは 1 か所で指定されるため、モジュール形式のルートを作成すると、冗長性やタイプミスが減り、非常に役立ちます。ルーティングの詳細については、Router() のドキュメントを参照してください。

以下は、定義された連鎖ルートハンドラーを使用した app.route() の例です。

app.route('/book')
  .get(function (req, res) {
    
    
    res.send(' Get a random book')
  })
  .post(function (req, res) {
    
    
    res.send('Add a book')
  })
  .put(function (req, res) {
    
    
    res.send('Update the book')
  })

(2) Express Router
ルーティングレベルのミドルウェアは、バインドされるオブジェクトがであることを除いて、アプリケーションレベルのミドルウェアと同じですexpress.Router()。

Express.Router クラスを使用して、モジュール式のインストール可能なルートハンドラーを作成します。Router インスタンスは完全なミドルウェアおよびルーティングシステムであるため、「ミニアプリケーション」と呼ばれることがよくあります。

次の例では、ルーターをモジュールとして作成し、その中にミドルウェア機能をロードし、いくつかのルートを定義して、メインアプリケーションのパスにルーターモジュールをインストールします。

home.js は、app ディレクトリに次の名前のルーターファイルを作成します。var router = express.Router()

var app = express()
var router = express.Router()

// 没有挂载路径的中间件，通过该路由的每个请求都会执行该中间件
router.use(function (req, res, next) {
    
    
  console.log('Time:', Date.now())
  next()
})

// 一个中间件栈，显示任何指向 /user/:id 的 HTTP 请求的信息
router.use('/user/:id', function(req, res, next) {
    
    
  console.log('Request URL:', req.originalUrl)
  next()
}, function (req, res, next) {
    
    
  console.log('Request Type:', req.method)
  next()
})

// 一个中间件栈，处理指向 /user/:id 的 GET 请求
router.get('/user/:id', function (req, res, next) {
    
    
  // 如果 user id 为 0, 跳到下一个路由
  if (req.params.id == 0) next('route')
  // 负责将控制权交给栈中下一个中间件
  else next() //
}, function (req, res, next) {
    
    
  // 渲染常规页面
  res.render('regular')
})

// 处理 /user/:id， 渲染一个特殊页面
router.get('/user/:id', function (req, res, next) {
    
    
  console.log(req.params.id)
  res.render('special')
})

module.exports=  router

次に、ルーターモジュールをアプリケーションにロードします。

var indexRouter = require('./home')
// ...
app.use('/home', index)

/homeアプリは、およびへのリクエストを処理できるようになります。/home/user/123456

(3) router.route メソッドルーター
インスタンスオブジェクトのrouteメソッドは、アクセスパスをパラメータとして受け取ることができます。

var router = express.Router();

router.route('/api')
	.post(function(req, res) {
    
    
		// ...
	})
	.get(function(req, res) {
    
    
		Bear.find(function(err, bears) {
    
    
			if (err) res.send(err);
			res.json(bears);
		});
	});

module.exports=  router

7.3 エラー処理ミドルウェア

エラー処理ミドルウェアは他のミドルウェアと同様に定義されますが、パラメータが 3 つではなく 4 つになり、その署名が (err、req、res、next) になる点が異なります。

//上面的中间件都没有匹配就会走这里
app.use(function(err, req, res, next) {
    
    
  console.error(err.stack)
     //send的状态码默认是200
  res.status(500).send('error')
})

7.4 組み込みミドルウェア

Express.static は、Express 用の唯一の組み込みミドルウェアです。これは、serve-static に基づいており、Express アプリケーションで静的リソースを提供する役割を果たします。各アプリケーションは複数の静的ディレクトリを持つことができます。

app.use(express.static('public'))
app.use(express.static('uploads'))
app.use(express.static('files'))

7.5 サードパーティのミドルウェア

必要な機能のノードモジュールをインストールし、アプリケーションレベルまたはルーティングレベルでアプリケーションにロードします。

次の例では、Cookie を解析するミドルウェアをインストールしてロードします。cookie-parser

$ npm install cookie-parser

var express = require('express')
var app = express()
var cookieParser = require('cookie-parser')

// 加载用于解析 cookie 的中间件
app.use(cookieParser())

8.パラメータの取得

8.1 リクエストクエリ

req.query() は、インターフェースリクエストのリンク「?」の後に接続されたパラメータを取得するために使用でき、主に get リクエストに使用されますが、post リクエストにも適用されます。req.query() は Express でネイティブにサポートされており、パラメータを自動的にオブジェクトに変換して返します。
聞く：

http://localhost:5050/server?p=user&q=password

エクスプレスインターフェイス:

let express = require('express')
let server = express()
server.get('/server',(req,resp)=>{
    
    
    console.log(req.query);
    resp.send('')
})
server.listen(5050,()=>{
    
    
    console.log('服务器已就绪')
})

リクエスト後の結果:
ここに画像の説明を挿入

8.2 必須パラメータ

req.params()いくつか特別な点があり、URL リンクでデータパラメーターを渡すのに適しており、==:变量名==リクエストを開始するためにバックグラウンドインターフェイスで使用される書き込みメソッドが必要です。

聞く：

http://localhost:5050/nums/1000

エクスプレスインターフェイス:

let express = require('express')
let server = express();
server.get('/nums/:num', (req, resp) => {
    
    
  console.log(req.params);
  resp.send('')
})
server.listen(5050, () =>{
    
    
	 console.log('服务器已就绪')
})

リクエスト後の結果:
ここに画像の説明を挿入

8.3 必須本文

req.body() はネイティブ Express でサポートされており、req.body() を直接使用してポストリクエストのフォームデータを取得できます。

聞く：

fecth('http://localhost:5050/people',{
    
    
    method: 'post',
    headers: {
    
    
        'Content-Type': 'application/json'
    },
    body:{
    
    name: 'zhangsan', age: 15}
})

エクスプレスインターフェイス:

const express = require('express');
const server = express();
//配置解析post参数的-不用下载第三方 ,内置
//解析post参数-(url-ky格式) username=kerwin&password=1234
// app.use(express.urlencoded({ extended: false }));
//解析post参数-(json字符串) {name:"",age:100}
app.use(express.json());
server.post('/people', (req, resp) => {
    
    
  console.log(req.body);
  resp.send('')
})
server.listen(5050, () => console.log('服务器已就绪'))

ここに画像の説明を挿入

9. Express を使用して静的ファイルをホストする

Express の組み込みの Express.static は、画像、CSS、JavaScript ファイルなどの静的ファイルを簡単にホストできます。

静的リソースファイルが配置されているディレクトリをパラメータとして Express.static ミドルウェアに渡し、静的リソースファイルへのアクセスを提供します。たとえば、画像、CSS、および JavaScript ファイルをパブリックディレクトリに配置すると、次のことが可能になります。

//直接将public里的index.html当成/的网页
app.use(express.static('public'))

これで、public ディレクトリ下のファイルにアクセスできるようになります。

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html

すべてのファイルパスはストレージディレクトリに対する相対パスであるため、静的ファイルのディレクトリ名は URL に表示されません。

静的リソースが複数のディレクトリに保存されている場合は、express.static ミドルウェアを複数回呼び出すことができます。

app.use(express.static('public'))
app.use(express.static('files'))

静的リソースファイルにアクセスする場合、express.static ミドルウェアはディレクトリが追加された順序に従って必要なファイルを検索します。

Express.static を通じてアクセスされるすべてのファイルを「仮想」ディレクトリ (つまり、ディレクトリがまったく存在しない) に保存したい場合は、以下に示すように、静的リソースディレクトリのマウントパスを指定することでこれを実現できます。 :

app.use('/static', express.static('public'))

これで、「/static」というプレフィックスが付いたアドレスを介して、パブリックディレクトリ内のファイルにアクセスできるようになります。

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html

要約する

app.use(express.static('public'))
<link rel="stylesheet" href="/css/index.css" />
    
app.use('/static', express.static('public'))
<link rel="stylesheet" href="/static/css/index.css" />