Lab 3 - ADC によるより詳細なトラフィック制御機能(Programmability)

このラボのゴールは、現在NGINX Controllerで利用可能な “advanced ADC” 機能を確認します。 以前、これらの機能はNGINX Controllerで対応できず、NGINX Insntanceを個別に設定した場合の設定のみで利用が可能だった内容です

Important

想定時間: 10分

Note

このラボの手順はラボを実施する方がWindows jumphost – jumphost-1 から操作する手順を示しています。 接続方法についてはこちらを参照ください。 F5 Labs - Index

App Componentを開く

  1. Chromeを開く

  2. ブックマークよりNGINX Controller のGUIにアクセス

    ../../_images/ControllerBookmark1.png

  3. NGINX Controller のadmin accountである、Peter Parker でログインしてください

    Username Password
    peter@acmefinancial.net Peter123!@#
    ../../_images/ControllerLogin-Peter1.png

  4. Services を開いてください

    ../../_images/Tile-Services.png

  5. “Apps” を選択してください

    ../../_images/Services-Apps.png

  6. “Echo Environment”から Module 2 Lab 1 で作成した echoapp を選択してください

    ../../_images/M2L3echoapp.png

URI Rewriteを設定する

  1. Components を開いてください。 以前作成した “echoappcomponent” を Edit を開いてください

    ../../_images/M2L3echoappEdit.png

  2. “Advanced” セクション内の、 Programmability を選択してください

    ../../_images/M2L3program.png

  3. Chrome内で、Componentによる構成変更前に、”echo” アプリケーションからどのような応答があるか確認してください このモジュールの前の項目で実施したように Chrome Developer tools を開き、http://echoapp.net/example へアクセスし、結果を確認してください

    ../../_images/M2L3URLbar.png ../../_images/M2L3beforeURLRW.png

Note

アプリケーションの JSON の応答の内容で、リクエストが path: "/example" 宛となっていることを確認してください

  1. NGINX Controllerで、”URI Rewrite”をコンポーネントに追加してください。これはシームレスにすべての “/example*” 宛のリクエストを “/modified*” へ変更します “Programmability” ダイアログの Add URI Rewrites をクリックしてください

    ../../_images/M2L3AddRW.png

  2. 表の内容に従ってパラメータを入力し、変更内容を反映するため、Done をクリックしてください。 NGINXの rewrite モジュールによるPCRE正規表現の記述を用いて、NGINX Controllerの設定変更を行います

    Field Value
    Incoming Pattern ~*^/example(.*)$
    Rewrite Pattern /modified$1
    ../../_images/M2L3AddRWdialogue.png ../../_images/M2L3RWready.png

    Important

    より詳細な順序を指定したURIを操作するルールセットが必要となる場合、 “After Execute” 機能を利用し実装を検討ください

  3. Submit をクリックし、変更したComponentの内容を “Gateway” にプッシュしてください。コンポーネントのステータスが、”Configuring” から “Configured” に変わったことを確認してください

    ../../_images/Submit.png ../../_images/M2L3RWconfigured.png

  4. Chromeで、echoapp に対し “/example” というリクエストを送信し、Rewrite動作のテストをしてください。応答データの内容を確認してください

    ../../_images/M2L3afterURLRW.png

    Note

    “Echo” appのJSONレスポンスは、ブラウザのURIで入力した情報(“/example”)ではなく、”/modified(変更後)”のリクエストが表示されていることを確認ください

Request Header 変更機能を設定する

  1. NGINX Controllerの “echoapp” App の画面を再度開き、Components を開いてください。先程作成した “echoappcomponent” で Edit をクリックしてください

    ../../_images/M2L3echoappEdit.png

  2. “Advanced” セクション配下にある Programmability を選択してください

    ../../_images/M2L3program.png

  3. Chromeで、前回 “echo” app にアクセスした際のレスポンスヘッダーの情報を確認してください

    ../../_images/M2L3beforeHeaders.png

  4. NGINX Controllerで、コンポーネントの”Request Header Modification”を追加してください。この機能はupstream/pool memberに通信を転送する際に、ADCとして動作するNGINX PlusでHTTP Headerを追加する機能です “Programmability” の Add Request Header Modification をクリックしてください

    ../../_images/M2L3AddHM.png

  5. 以下の内容を入力し、内容を保存するため Done クリックしてください

    Field Value
    Action Add
    Header Name X-Controller-Instance
    Header Value Development NGINX West 03 (CAS)
    ../../_images/M2L3HeaderDialogue.png ../../_images/M2L3Headerready.png

  6. Submit をクリックし、変更したComponentの内容を “Gateway” にプッシュしてください。コンポーネントのステータスが、”Configuring” から “Configured” に変わったことを確認してください

    ../../_images/Submit.png ../../_images/M2L3RWconfigured.png

  7. Chromeで、echoapp に対し再度リクエストを送信し(更新ボタンをクリックするなど)HTTP Headerの挿入について動作を確認してください。応答データの内容を確認してください

    ../../_images/M2L3afterHM.png

    Note

    “echo” Appが応答するJSONデータは、HTTPリクエストに追加されたヘッダーの情報が表示されます。 このヘッダー追加機能により、どのNGINX Plusインスタンスが通信の操作を行ったか示すHTTP Headerの追加をすることが可能です リクエストやレスポンスのHTTP Headerを追加・削除するなど、アプリケーションに求められる内容を実施することが可能です

追加情報

“Programmability” セクションでは、URIリダイレクト、URI Rewrite、リクエストヘッダー操作、レスポンスヘッダー操作を行うことができます これらの機能は、NGINXの`rewrite`_モジュールによって実現しています。より詳細な情報についてはmoduleのドキュメントを参照してください

NGINX REGEX validator は作成した正規表現を確認するのに便利です。こちらの記事を参照ください(regex blog)。また、NGINXが使うPerlの正規表現(PCRE)も理解に役立ちます。合わせてご確認ください