node.jsに基づく開発フレームワーク-Koa

1.はじめに

Koaは、NodeJsプラットフォームに基づく次世代のWeb開発フレームワークであり、Expressの背後にある元のチームによって構築され、より小さく、より表現力があり、より堅牢なWebフレームワークになることを約束しています。koaを使用してWebアプリケーションを作成し、さまざまなジェネレーターを組み合わせることで、コールバック関数の繰り返しの面倒なネストを回避し、エラー処理の効率を大幅に向上させることができます。Koaは、カーネルメソッドでミドルウェアをバインドせず、軽量でエレガントな関数ライブラリのみを提供するため、Webアプリケーションの作成が便利になります。現在、2つのメジャーバージョン1.xと2.xがあります。2.xバージョンは、Node.js v7.6.0以降でサポートされている非同期待機構文シュガーを使用して、より洗練された非同期プログラミングモデルを提供します。

2.コアのコアコンセプト

コアは正確に何をしますか？Koaで最も重要で重要なことは、httpプロトコルの処理を実現することです。これには、3つの主要なコアコンセプトがあります。

コアアプリケーション：メインプログラム
コンテキスト：コンテキスト
要求、応答：要求と応答

3つの基本的な使用法

【1】準備


// 1.Koa必须使用7.6以上的node版本，检查node版本，低于要求的话就升级node
$ node -v 

// 2.创建一个 my_koa 文件夹，生成package.json文件
$ npm init -y

// 3.安装koa依赖
$ npm install --save koa

[2]コードを書く

my_koaフォルダーにindex.jsエントリファイルを作成し、koaを使用してhttpサービスを設定します

// index.js文件
const Koa = require('Koa');  // 引入Koa
const app = new Koa();  // 创建Koa实例，定义Application

// 使用use方法来处理上下文
app.use(async ctx => {  
  // ctx是包含整个应用的上下文，可以对用户的请求做一些处理
  ctx.body = 'hello, World!'
});

app.listen(3000);  // 设置端口号，让Koa应用运行在3000端口上

上記のコードをindex.jsファイルに書き込んだ後、ファイルディレクトリでターミナルを開き、ノードindex.jsと入力してファイルを実行します。

次に、ブラウザを開いて次のように入力します。localhost：3000、出力した結果を確認できます

四、アプリケーション（アプリケーション）

Koaアプリケーションは、スタックのような方法で編成および実行されるミドルウェア関数のセットを含むオブジェクトです。Koaは、遭遇した可能性のある他の多くのミドルウェアシステムに似ています。

[1] app.listen（）：ポートサーバーをプログラムエントリとしてバインドします。複数をバインドできます。以下は、3000 ポートにバインドされている役に立たないKoaアプリケーションです

const Koa = require('koa');
const app = new Koa();
app.listen(3000); 

// app.listen(3000)是以下方法的语法糖

const http = require('http');
const Koa = require('koa');
const app = new Koa();
http.createServer(app.callback()).listen(3000);

[2] app.use（function）：指定されたミドルウェアメソッドをこのアプリケーションに追加します。app.use（）はこれを返すため、チェーンで表現できます。

app.use(someMiddleware)
app.use(someOtherMiddleware)
app.listen(3000)

// 等同于

app.use(someMiddleware).use(someOtherMiddleware).listen(3000)

[3] app.keys =：署名されたCookieキーを設定します

app.keys = ['im a newer secret', 'i like turtle'];
app.keys = new KeyGrip(['im a newer secret', 'i like turtle'], 'sha256');

[4] app.context： ctxの作成元のプロトタイプ。app.contextを編集することにより、ctxの他の属性を追加できます。

app.context.db = db();

app.use(async ctx => {
  console.log(ctx.db);
});

[5]エラー処理：「エラー」イベントリスナーを追加します

app.on('error', (err, ctx) => {
  log.error(err, ctx)
});

[6] next（）：関数は一時停止し、定義された次のミドルウェアに制御を渡します

const Koa = require('Koa');  // 引入Koa
const app = new Koa();  // 创建Koa实例，定义Application

const one = (ctx, next) => {
    console.log('进 one');
    next();
    console.log('出 one');
}
const two = (ctx, next) => {
    console.log('进 two');
    next();
    console.log('出 two');
}
const three = (ctx, next) => {
    console.log('进 three');
    next();
    console.log('出 three');
}

app.use(one);
app.use(two);
app.use(three)
app.listen(3000)

5、コンテキスト（コンテキスト）

Koaは、会話のコンテキストを表すContextオブジェクトを提供します。Contextオブジェクトは、ノードのHTTPリクエスト（リクエスト）オブジェクトとHTTPレスポンス（レスポンス）オブジェクトを1つのオブジェクトにカプセル化します。このオブジェクトを処理することで、ユーザーに返されるコンテンツを制御できます。

[1]コンテキスト固有のメソッド

ctx.req：ノードのリクエストオブジェクト
ctx.res：ノードの応答オブジェクト
ctx.request：koaのリクエストオブジェクト
ctx.response：koaの応答オブジェクト
ctx.state：推奨される名前空間。ミドルウェアを介して情報とフロントエンドビューを渡すために使用されます
ctx.app：アプリケーションインスタンスリファレンス
ctx.cookies.get（name、[options]）：获取クッキー
ctx.cookies.set（name、value、[options]）：設定Cookie
ctx.throw（[status]、[msg]、[properties]）：例外をスローします
ctx.assert（value、[status]、[msg]、[properties]）：エラーをスローします

6、リクエスト（リクエスト）

Koa Requestオブジェクトは、ノードのネイティブ要求オブジェクトを抽象化したものであり、HTTPサーバーの開発に役立つ多くの機能を提供します。

request.header：設定および割り当て可能なリクエストヘッダーオブジェクト（request.header = xxx）
request.headers：リクエストヘッダーオブジェクト、エイリアスはrequest.headerで、設定と割り当てが可能です（request.headers = xxx）
request.method：リクエストメソッド、割り当てを設定できます（request.method = xxx）
request.length：要求されたContent-Lengthを数値、または未定義として返します
request.url：リクエストURLを取得します。リクエストURLを設定できます。これはURLの書き換えに役立ちます（request.url = xxx）
request.originalUrl：リクエストの元のURLを取得します
request.origin：プロトコルとホストを含むURLのソースを取得します
request.href：プロトコル、ホスト、URLを含む完全なリクエストURLを取得します
request.path：リクエストパス名を取得します。値を設定し、クエリ文字列が存在する場合はそれを保持できます（request.path = xxx）
request.querystring ：？に従って、元のクエリ文字列を取得するには、元のクエリ文字列を設定できます（request.querystring = xxx）
request.search ：？を使用して元のクエリ文字列を取得します。元のクエリ文字列を設定できます（request.search = xxx）
request.host：ホストが存在する場合はそれを取得します
request.hostname：ホスト名が存在する場合はそれを取得します
request.URL：WHATWGによって解析されたURLオブジェクトを取得します
request.type：「charset」やその他のパラメータを除くリクエストのContent-Typeを取得します
request.charset：要求された文字セットが存在する場合、または未定義の場合に取得します
request.query：解析されたクエリ文字列を取得します。クエリ文字列がない場合は、空のオブジェクトを返します。割り当てを設定できます（request.query = xxx）
request.fresh：リクエストキャッシュが「フレッシュ」であるかどうか、つまりコンテンツが変更されていないかどうかを確認します。このメソッドは、If-None-Match / ETagと、If-Modified-SinceおよびLast-Modifiedの間のキャッシングネゴシエーションに使用されます。これらの応答ヘッダーを1つ以上設定した後、引用符で囲む必要があります
request.stale：request.freshの反対
request.protocol：リクエストプロトコル「https」または「http」を返します
request.secure：ctx.protocol == "https"を使用して、リクエストがTLS経由で送信されているかどうかを確認します
request.ip：リモートアドレスをリクエストする

セブン、レスポンス（レスポンス）

Koa Responseオブジェクトは、ノードのネイティブ応答オブジェクトを抽象化したものであり、HTTPサーバーの開発に役立つ多くの機能を提供します。

response.header：応答ヘッダーオブジェクト
response.headers：応答ヘッダーオブジェクト、エイリアスはresponse.headerです
response.socket：応答ソケット
response.status：応答ステータスを取得します。デフォルトでは、response.statusはノードのres.statusCodeとして200ではなく404に設定され、応答ステータスは数値コード（response.status = xxx）によって設定されます。
response.message：応答ステータスメッセージを取得します。デフォルトでは、response.messageはresponse.statusに関連付けられており、応答ステータスメッセージを特定の値に設定できます（response.message = xxx）
response.length：応答のContent-Lengthを数値として返すか、ctx.bodyから推定されるか、未定義です。応答のContent-Lengthを指定された値に設定できます（response.length = xxx）
response.body：応答本文を取得します。応答本文を文字列書き込み、バッファ書き込み、ストリームパイプライン、オブジェクト||配列JSON文字列化、コンテンツなしのnull応答に設定できます
response.type：「charset」およびその他のパラメーターを除く応答Content-Typeを取得します。mime文字列またはファイル拡張子（response.type = xxx）を使用して応答Content-Typeを設定できます。

[1] HTTP応答の種類

Koaのデフォルトの戻り値の型はtext / plain（プレーンテキスト）です。他の種類のコンテンツを返す場合は、ctx.request.acceptsを使用して、クライアントが受け入れるデータを決定できます（HTTPリクエストのAcceptフィールドに従って））次に、ctx.response.typeを使用して戻り値の型を指定します。

const Koa = require('koa')
const app = new Koa()

const main = (ctx, next) => {
  if (ctx.request.accepts('json')) {
    ctx.response.type = 'json';
    ctx.response.body = { data: 'Hello World' };
  } else if (ctx.request.accepts('html')) {
    ctx.response.type = 'html';
    ctx.response.body = '<p>Hello World</p>';
  } else if (ctx.request.accepts('xml')) {
    ctx.response.type = 'xml';
    ctx.response.body = '<data>Hello World</data>';
  } else {
    ctx.response.type = 'text';
    ctx.response.body = 'Hello World';
  };
}; //直接运行页面中会显示json格式，因为我们没有设置请求头，所以每一种格式都是ok的。   

app.use(main) //app.use(function)用来加载中间件。
app.listen(3000)

8.ミドルウェア

【1はじめに

koaの最大の特徴は、有名な「オニオンモデル」である独自のミドルウェアプロセス制御です。リクエストがミドルウェアを層ごとに外側から内側へ、内側から応答へと通過することがはっきりとわかります。応答します。ミドルウェアをレイヤーごとに調べます。つまようじをタマネギに入れるときと同じように、つまようじはタマネギの皮の層を外側から内側に通り抜けて「タマネギの心臓」に到達します。それを引き出すと、つまようじはタマネギの皮の層を通ります。内側から外側へ。

【2】ケース

基本的に、コアのすべての機能はミドルウェアを介して実装されます。各ミドルウェアはデフォルトで2つのパラメーターを受け入れます。最初のパラメーターはContextオブジェクトで、2番目のパラメーターは次の関数です。次の関数が呼び出されている限り、実行権を次のミドルウェアに移すことができます。ミドルウェア内で次の関数が呼び出されない場合、実行権は渡されません。次のコードのmiddleware1、middleware2、およびmiddleware3関数は、HTTP要求とHTTP応答の中間にあり、いくつかの中間関数を実装するために使用されるため、「ミドルウェア」（ミドルウェア）と呼ばれます。app.use（）はミドルウェアをロードするために使用されます

const Koa = require('Koa');
const app = new Koa();

// 定义三个中间件的方法：middleware1、middleware2、middleware3，next()方法代表执行完当前中间件方法后，继续执行后面的方法
const middleware1 = function async(ctx, next) {
  console.log('这是第一条middleware');
  next();
  console.log('这是第一条next之后的打印')
}
const middleware2 = function async(ctx, next) {
  console.log('这是第二条middleware');
  next();
  console.log('这是第二条next之后的打印')
}
const middleware3 = function async(ctx, next) {
  console.log('这是第三条middleware');
  next();
  console.log('这是第三条next之后的打印')
}

// 使用中间件方法
app.use(middleware1)
app.use(middleware2)
app.use(middleware3)

app.listen(5000)

[3]ミドルウェアスタック

複数のミドルウェアがミドルスタックを形成し、「first-in-last-out」の順序で実行されます。

app.use（）は順番に実行され、どのミドルウェアが最初に参照され、どのミドルウェアが最初に実行されるか

next（）に遭遇すると、Koaは現在のミドルウェアを次のミドルウェアに渡して処理します

next（）がメソッドで定義されていない場合、Koaはデフォルトでリクエストを終了し、データを返します

next（）の後にコードがある場合、Koaはアプリケーション全体がapp.use（）の順序で呼び出されるのを待ってから、next（）の後にコードを逆に実行するために戻ってきます。 -最後に述べた。

ナイン、コア-ルーター（ルーティング）

通常、ウェブサイトには複数のページがあります。異なるAPIまたは異なるパスをリクエストする場合、異なるメソッドを実行して異なる結果を返す必要があります。現時点では、KoaのミドルウェアKoa-routerを使用して処理する必要があります。

【1】安装Koa-router

 npm install -S koa-router

【2】ケース

const Koa = require('Koa');
const Router = require('koa-router');  // 引用koa-router
const app = new Koa();
const router = new Router();

// 定义get请求
// home是我们定义的访问路径：localhost:8000/home
router.get('/home', ctx => {
  // 这个区域是中间件要去处理的上下文方法
  ctx.body = '这是主页'
})

router.get('/detail', ctx => {
    ctx.body = '这是详情页'
})

// app.use(router.routes()) 是把上面定义的路由里面的方法添加到Koa应用中
// allowedMethods方法可以把它看做一个拦截器，可以拦截一些我们应用没有定义的请求，然后返回相应的错误信息

app.use(router.routes()).use(router.allowedMethods())

app.listen(4000);  // 设置端口号，让Koa应用运行4000端口上；

// 在浏览器访问 localhost:8000/home 输出了"这是主页"
// 在浏览器访问 localhost:8000/detail 输出了"这是详情页"

10.参照リンク

https://koa.bootcss.com/

http://www.ruanyifeng.com/blog/2017/08/koa.html

記事は毎週継続的に更新されます。WeChatで「フロントエンドコレクション 」を検索して初めて読むと、[ビデオ] [ブック]に返信して、200Gのビデオ資料と30のPDFブック資料を受け取ることができます。