ホームページ >ウェブフロントエンド >jsチュートリアル >Node.js は Koa を使用して基本的なプロジェクトを構築するサンプル チュートリアル
多くの人が、NodeJ や Express フレームワークや Koa フレームワークなどの新しいテクノロジーに注目しています。 Koa は Express のオリジナルチームによって作成された超軽量のサーバーサイド フレームワークであり、Express と比較して自由度が高く、さらに重要なのは、ES6 + async を使用しているため、コールバック地獄を回避できます。ただし、コードのアップグレードのため、Koa2 には v7.60 以降の Node.js 環境が必要です。
プロジェクト ディレクトリを手動で作成し、すぐに package.json ファイルを生成します
npm init -y
koa をインストールします //現在のバージョンは 2.4.1 です
npm install koa -S
次に、app.js を作成します
// app.js const Koa = require('koa'); const app = new Koa(); app.use(async ctx => { ctx.body = 'Wise Wrong'; }); app.listen(3000);
最後にパッケージにスタートアップコマンドを追加します
このように最も基本的なkoaアプリケーションが完成します
npm startを実行し、ブラウザでhttp://localhost:3000/にアクセスして確認できます。その効果
手動で作成したい場合は、プロジェクトが面倒なので、スキャフォールディング koa-generato を使用してプロジェクトを生成できます
npm install koa-generator -g
koa2 project_name
次に、npm install でプロジェクトの下に依存関係をインストールし、npm start でプロジェクトを開始します
koa を初めて使用する場合は、最初にこのブログを読んでから、スキャフォールディング ツールを使用することをお勧めします。これにより、各依存パッケージの役割をよりよく理解できます
app.js には ctx がありますこれは Koa が提供する Context オブジェクトで、リクエストとレスポンスをカプセル化します
すべての HTTP リクエストで Context オブジェクトが作成されます
Context.request.path を通じてユーザーがリクエストしたパスを取得し、コンテンツを送信できますContext.response.body を通じてユーザーに送信します
Koa のデフォルトの戻り値の型は text/plain です。HTML ファイル (またはモジュール ファイル) を返したい場合は、Context.response.type を変更する必要があります
さらに、 Context.response は省略できます。たとえば、Context.response.type は Context.type と省略され、Context.response.body は Context.type と省略されます
プロジェクトの下に HTML ファイルを保存するディレクトリ ビューを作成し、このディレクトリにindex.htmlを追加し、app.js
// app.js// 原生路由 const Koa = require('koa'); const fs = require('fs'); const app = new Koa(); app.use(async (ctx, next) => { if (ctx.request.path === '/index') { ctx.type = 'text/html'; ctx.body = fs.createReadStream('./views/index.html'); } else { await next(); } }); app.listen(3000);
を変更してから、ブラウザでhttp://localhost:3000/indexにアクセスしてindex.htmlページを表示しますが、他のアドレスにアクセスすると、ページが見つかりません。
この方法で URL を扱うのは非常に不器用なので、ルーティング ミドルウェア koa-router を導入する必要があります
npm install koa-router -S
koa-router をインポートするときは、最後に括弧を追加する必要があることに注意してください:
const router = require('koa-router')();
以下と同等:
const koaRouter = require('koa-router'); const router = koaRouter();
ルーティング ファイルを保存するルート ディレクトリを作成し、そのディレクトリにindex.js を作成します
// routes/index.js const fs = require('fs'); const router = require('koa-router')() router.get('/index', async (ctx, next) => { ctx.type = 'text/html'; ctx.body = fs.createReadStream('./views/index.html'); }); module.exports = router
ここでプレフィックス メソッドを使用してファイルを追加することもできます。 BaseUrl を追加します
// app.js
// app.js const Koa = require('koa'); const app = new Koa(); const index = require('./routes/index') app.use(index.routes(), index.allowedMethods()) app.listen(3000);
のすべてのインターフェイスにrouter.prefix('/about')
を追加します。app.js
router.get('/about/:name', async (ctx, next) => { ctx.body = `I am ${ctx.params.name}!`; });
の上記のallowedMethodsを変更して、リクエストメソッドを確認します。postリクエストを使用してgetインターフェイスにアクセスする場合は、直接失敗を返します
さらに、必要に応じて、URL に変数を追加して、Context.params.name
npm install koa-static -S
3. 静的リソース
を介してアクセスすることもできます。 cssなどの静的リソースを導入するには、koa-static
const static = require('koa-static'); // 将 public 目录设置为静态资源目录 const main = static(__dirname + '/public'); app.use(main);
を使用する必要があります
静的リソースを保存するためにpublicディレクトリを作成します
次に、app.jsに次のコードを追加します
app.use(require('koa-static')(__dirname + '/public'));
npm install koa-views -S
その後、index.htmlに対応するファイルを導入することができます
4. テンプレートエンジン上記のルートは、fsモジュールを使用してHTMLファイルを直接読み込む 開発時には、ページのレンダリングにkoa-viewsミドルウェアを使用するにはconst views = require('koa-views') app.use(views(__dirname + '/views'));
// routes/index.js const router = require('koa-router')() router.get('/index', async (ctx, next) => { await ctx.render('index'); }); module.exports = routerそして、ルーティングファイル内で、renderメソッドを使用できます
app.use(views(__dirname + '/views', { extension: 'pug' // 以 pug 模版为例 }))上記は直接レンダリングする方法ですテンプレートエンジンを導入したい場合は、拡張子フィールドを追加してテンプレートタイプを設定できます 5. 結論Expressがウェブストームとみなされる場合、Koaは崇高ですExpressが普及したとき、その複雑な依存関係は多くの開発者によって批判されましたそこで、Express チームは Express を最も基本的なスケルトンまで分解し、開発者が自分で組み立てられるようにしました 記事で述べたように、最初から始めるのは非常に面倒です。迅速に開発するには、スキャフォールディング koa-generato を使用してください
しかし、私は、Koa に慣れた後、自分のプロジェクトに適したスキャフォールディングを構築することをお勧めします
それ以外の場合は、Express を直接使用してみてはいかがでしょうか 🎜Koaサービス電流制限方法の例🎜🎜🎜🎜ノードにおけるkoaミドルウェア機構の解析 質問🎜🎜WeChatパブリックアカウントを開発するためのNode.js+Koaサンプルチュートリアル
以上がNode.js は Koa を使用して基本的なプロジェクトを構築するサンプル チュートリアルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。