Express フレームワークの概要

Feathers : プロトタイプを数分で構築し、本番環境に対応したライブアプリケーションを数日で構築します。
ItemsAPI : Express および Elasticsearch に基づいて構築された Web およびモバイルアプリケーションの検索バックエンド。
KeystoneJS : 自動生成された React.js 管理 UI を備えた Web サイトおよび API アプリケーションフレームワーク/CMS。
Poet : インスタントページネーション、タグ、カテゴリビューを備えた軽量の Markdown ブログエンジン。
Kraken : 構造と規約を提供することで Express を拡張する、安全で拡張可能なレイヤー。
LoopBack : 動的なエンドツーエンド REST API を迅速に作成するための、拡張性の高いオープンソース Node.js フレームワーク。
Sails : 実用的な運用準備が整ったアプリケーションを構築するための Node.js 用の MVC フレームワーク。
Hydra-Express : Hydra-Express は、ExpressJS を使用した Node.js マイクロサービスの構築を容易にする軽量ライブラリです。
ブループリント: API とバックエンドサービスを構築するための SOLID フレームワーク
Locomotive : Passport.js 開発者による Node.js 用の強力な MVC Web フレームワーク
graphql-yoga : フル機能を備えながらもシンプルで軽量な GraphQL サーバー
Express Gateway : Express に基づくフル機能で拡張可能な API ゲートウェイ
Dinoloop : Typescript と依存関係注入に基づく REST API アプリケーションフレームワーク
Kites : テンプレートベースの Web アプリケーションフレームワーク
FoalTS : TypeScript に基づくエレガントで包括的な Node.Js Web フレームワーク。
NestJs : TypeScript JavaScript (ES6、ES7、ES8) 上に効率的でスケーラブルなエンタープライズグレードのサーバー側アプリケーションを構築するための進歩的な Node.js フレームワーク
Expressive Tea : すぐに使用できる、モジュール式でクリーン、高速、宣言型のサーバー側アプリケーションを構築するための小さなフレームワーク。

2. Express プログラミングの開始方法

3 前提条件として、Node.js がローカル環境にインストールされている必要があります。インストールされていない場合は、この記事を参照してください: Node.js のインストール

作業ディレクトリとしてローカルにディレクトリを作成します。

$ mkdir myapp
$ cd myapp

npm init で初期化すると、ディレクトリに package.json ファイルが生成されます。

npm init

プロンプトに従い、対応する情報を入力し、Enter キーを押して次のエントリを入力します。デフォルトの場合は、Enter キーを直接押すことができます。以下に示すように:

対応するフィールド情報には次のものが含まれます。

パッケージ名: パッケージ名

バージョン: パッケージバージョン

description: パッケージの説明情報。パッケージが何を行うのかを他の人に知らせます。

エントリポイント: エントリファイル

テストコマンド: テストコマンド

git リポジトリ: git ウェアハウスのアドレス

キーワード: キーワード

author: パッケージの作成者

ライセンス: (ISC) ライセンスのデフォルトは ISC です。ISCライセンスは、BSDライセンスオープンソースライセンスです。

次に、プロジェクトの依存関係に Express をインストールしましょう。

$ npm install express

インストールが完了したら、以下の対応するディレクトリを確認してください。

package.json ファイルが作成され、Express 依存関係がインストールされました。対応するバージョンは 4.18.2 です。package.json では、エントリファイルが Index.js として指定されているため、ここで Index.js ファイルを作成します。

3. テストケース

次のように、index.js にサンプルコードを記述します。

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

まずエクスプレスパッケージを導入し、ポートを 3000 に設定します。app.get ルートは 2 つのパラメータを受け入れます。最初のパラメータはアドレス、「/」はルートディレクトリ、req はリクエストオブジェクト、res は応答オブジェクト、res です。 .send はページコンテンツへの入力を送信し、最後に app.listen はリスニングポートであり、関数はリスニング後に出力されるパラメーターです。

次のように次のコードを実行します。

node .\index.js

ブラウザに http://localhost:3000/ と入力すると、ページの入力結果が表示されます。

対応するルートが見つかったことがわかり、その中の内容が出力されます。未定義のルートアドレスを入力した場合は、結果を確認します。たとえば、 http://localhost:3000/test と入力します。

対応するルートが見つからないことがわかり、ページには 404 Not Found が表示されました。

4. その他の問題

4.1 モデルを定義するにはどうすればよいですか?

Express にはデータベースの概念がありません。この概念は、ほぼすべてのデータベースと対話できるようにするサードパーティのノードモジュールに委ねられています。

モデル中心の Express ベースのフレームワークについては、「LoopBack」を参照してください。

4.2 Express はどのテンプレートエンジンをサポートしていますか?

Express は、 (path, locals, callback) 署名に準拠する任意のテンプレートエンジンをサポートします。テンプレートエンジンのインターフェイスとキャッシュを標準化するには、 consolidate.js プロジェクトのサポートを参照してください。リストされていないテンプレートエンジンでも高速署名がサポートされている可能性があります。

4.3 404 応答をどのように処理するか?

Express では、404 応答はエラーの結果ではないため、エラーハンドラーミドルウェアはそれらを捕捉しません。この動作は、404 応答が単にこれ以上行う作業がないことを意味するためです。つまり、Express はすべてのミドルウェア機能とルートを実行しましたが、応答が見つかりませんでした。必要なのは、スタックの最下部 (他のすべての関数の下) に、404 応答を処理するミドルウェア関数を追加することだけです。

app.use((req, res, next) => {
    res.status(404).send("不好意思，没有找到对应路径，请重新输入!")
})

express.Router() ルートがミドルウェア機能によって置き換えられないように、実行時にインスタンスにルートを動的に追加します。

4.4 エラーハンドラを設定するにはどうすればよいですか?

エラー処理ミドルウェアは、3 つではなく 4 つのパラメータ、具体的には署名を使用する点を除いて、他のミドルウェアと同じ方法で定義できます (err, req, res, next)。

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => {
//   res.send('Hello World!')
throw Error('this is error !')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

app.use((req, res, next) => {
    res.status(404).send("不好意思，没有找到对应路径，请重新输入!")
})

app.use((err, req, res, next) => {
    console.error(err.stack)
    res.status(500).send('报错了......')
  })

ルートにエラーを出力し、ミドルウェアがそれをインターセプトして、対応するプロンプトを表示します。テストは次のとおりです。ブラウザに「http://localhost:3000/」と入力します。

4.5 プレーン HTML をレンダリングするにはどうすればよいですか?

いらないよ！res.render() HTML の「レンダリング」機能を使用する必要はありません。特定のファイルがある場合は、 res.sendFile() 関数を使用します。ディレクトリから多くのリソースを提供する場合は、 express.static() ミドルウェア機能を使用します。

const express = require('express')
const path = require("path")
const app = express()
const port = 3000

app.use(express.static(path.join(__dirname, 'static')))
app.get('/', (req, res) => {
    // res.sendFile("D:\\2023\\code_test\\myapp\\static\\index.html")
    res.sendFile("index.html")
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

app.use((req, res, next) => {
    res.status(404).send("不好意思，没有找到对应路径，请重新输入!")
})

app.use((err, req, res, next) => {
    console.error(err.stack)
    res.status(500).send('报错了......')
  })

res.sendFile() は指定されたファイルを返すことができ、デフォルトでは絶対パスが渡されます。

express.static() ミドルウェア機能を使用して、静的ファイルのディレクトリを指定できます。