OktaテンプレートアプリとOktaプラグインテンプレートアプリを構成する

テンプレートアプリを使用すると、稼働中のシステムでリアルタイムにアプリケーション統合を作成できます。

カスタムアプリを作成するには、次の一般的なSecure Web Authentication(SWA)テンプレートアプリから必要なものを選択します。

  • テンプレートアプリ(Template App):アプリがフォームPOSTを介した認証をサポートする場合
  • テンプレートプラグインアプリ(Template Plugin App):アプリサイトのページにユーザー名、パスワード、または送信ボタンのフィールドがある場合
  • テンプレートアプリ3フィールド(Template App 3 Fields)テンプレートプラグインアプリ(:[Template Plugin App)]に類似します。アプリページに会社ID(Company ID)などの別フィールドがある場合
  • テンプレート2ページプラグインアプリ(Template 2 Page Plugin App):これも[Template Plugin App(テンプレートプラグインアプリ)]に類似します。サインインフローが2ページにまたがる場合。このテンプレートは、ブラウザープラグインの自動送信をサポートしていません
  • テンプレートBasic認証アプリ(Template Basic Auth App):アプリがBasic認証をサポートする場合
  • テンプレートフレームプラグインアプリ(Template Frame Plugin App):アプリがiframeをサポートする場合

手順

  1. Admin Consoleで、アプリケーション(Applications) > アプリケーション(Applications)に移動します。

  2. アプリカタログを参照(Browse App Catalog)をクリックします。
  3. Templateを検索します。
  4. 検索結果から、目的のタイプのテンプレートアプリを追加します。

テンプレートアプリ

テンプレートアプリが特定のURLにフォームでPOSTする認証をサポートしている場合に使用します。このテンプレートでは、お客様が指定する名前付きパラメーターと静的フィールドに加え、ユーザーが入力するユーザー名とパスワードの情報も指定します。

一般設定(General Settings)ページで情報を入力します。

  • URL:POSTするログインフォームの送信先URLを入力します(フォームが表示されるURLではありません)。
  • ユーザー名パラメーター(Username parameter)パスワードパラメーター(Password parameter)のフィールド:パラメーター名を、ユーザー名とパスワードのデータを含めて入力します。
  • オプションパラメーター(Optional parameter)フィールド:名前と値のペアに追加の静的フィールドデータを入力します。
    • Chromeブラウザーから、統合するアプリにログインします。
    • Chromeデベロッパーツールを使用して、そのページに送信されているトラフィックを表示します。
    • 対象のログインフォームがあるページを開き、ネットワーク(Network)タブに切り替えます。
    • ログの保存(Preserve log)チェックボックスを選択します。
    • 既存のトラフィックを消去してログインを実行します。
    • ヘッダー(Headers)タブで、対象ページへのPOSTをクリックすると、POSTされたすべてのデータと、送信先URLを確認できます。
  • アプリケーションの可視性(Application Visibility):ユーザーにアプリケーションのアイコンを表示するかどうかを指定します。
  • ブラウザープラグインの自動送信(Browser plugin auto-submit):ユーザーがログインページにアクセスしたときに自動的にログインさせるかどうかを指定します。

Template Plugin App/Template App 3のフィールド/2ページ用テンプレートプラグインアプリ/Template Frame Plugin App

テンプレートプラグインまたは3フィールド用テンプレートプラグインアプリの用途(Knowing when to use the Template Plugin or Template Plugin 3 Fields app)

アプリに、クロスサイトリクエストフォージェリ(XSRF)保護機能がある場合、テンプレートプラグインアプリまたは3フィールド用テンプレートプラグインアプリを使用する必要があります。これの有無を確認するには、サーバーがXSRFトークンを生成しているかどうかを対象ページで調べてください。また、ASPページで生成されるEVENTVALIDATIONFORMVALIDATIONなどのフィールドも探します。こうした場合に、テンプレートプラグインアプリが必要です。

テンプレートプラグインアプリ(Template Plugin App)またはテンプレートフレームプラグインアプリ(Template Frame Plugin App)を構成する場合、関連するフィールドにCSSセレクターを指定します。これにより、これらのプラグインを使ってこれらのフィールドに値が取り込まれます。

一般設定(General Settings)ページで情報を入力します。

  • アプリケーションラベル(Application label):エンドユーザーのホームページで、アプリの下に表示するラベルを入力します。
  • ログインURL(Login URL):ログインフォームのURL(フォームを実際に表示するURL)を入力します。
  • フレームURL(Frame URL):フレームURL(フレームが含まれるURL)を入力します。
  • リダイレクトURL(Redirect URL):ログインページのURLにアクセスしたときに他のページにリダイレクトされる場合の、リダイレクト先となるページのURLを入力します。
  • 正規式(Regular Expression)任意(:)許可リストとして機能する正規表現を作成できます。これにより、定義したパターンに一致するURLへのアクセスを制限して、アプリのセキュリティを向上させることができます。たとえば、ログインURLがhttps://example.com/login、パスワード変更用のURLがhttps://example.com/change_passwordとします。この場合、https://example.com/(login|change_password)という正規表現を作成して一致させることができます。
  • ユーザー名フィールド(Username field):ユーザー名フィールドのCSSセレクターを入力します。
  • パスワードフィールド(Password field):パスワードフィールドのCSSセレクターを入力します。
  • ログインボタン(Login Button):ログインボタンのCSSセレクターを入力します。
  • チェックボックス(Checkbox):チェックボックスのCSSセレクターを入力します(たとえば、[Remember me(ログイン状態を維持)同意する(]、[Agree terms)]などのチェックボックスを指定できます)。
  • 「次へ」ボタン(Next Button):次のページにリダイレクトする[Next(次へ)]ボタンのCSSセレクターを入力します。
  • 追加フィールドセレクター(Extra Field Selector):追加フィールドのCSSセレクターを入力します。
  • 追加フィールド値(Extra Field Value):追加フィールドの値を入力します。

CSSセレクターフィールドを特定する

テンプレートプラグインアプリ(Template Plugin App)を構成する場合、関連するフィールドにCSSセレクターを指定します。これにより、これらのプラグインを使ってこれらのフィールドに値が取り込まれます。

CSSセレクターを特定するには、ページ上の個々の要素を調べます。Chromeデベロッパーツールの使用

  1. 対象のログインフォームがあるページを開きます。
  2. 入力フィールドまたはボタンを右クリックして検証(inspect)(Inspect)オプションを選択すると、実際のDocument Object Model(DOM)要素が表示されます。要素(Elements)タブで、要素のidclassを表示し、この情報を使用してCSSセレクターを構成します。

idまたはclassで要素を一意に識別できない場合は、完全な階層構造が必要になることがあります。たとえば、Oktaのサインインページであれば、セレクターは次のようになります。

  • ユーザー名(Username)#okta-signin-username
  • パスワード(Password)#okta-signin-password
  • ボタン(Button)#okta-signin-submit

アプリで、ユーザー名、パスワード、送信ボタンに、idではなく、name属性を使用する場合、input[type="text"]を使用してみてください。たとえば、パスワードにはinput[type="password"]を、また、送信ボタンにはinput[type="submit"]を使用できます。その他の属性も照会できます。たとえば、input[class="btn"]を使用して、送信ボタンを指定することも可能です。

テンプレートプラグインアプリが動作しない場合

テンプレートプラグインアプリは次のようなサイトでは有効ではありません。

  • 非常に動的なHTML作成が含まれる。プラグインに必要な要素が、プラグインの起動時に存在しないため、こうしたサイトでこのアプローチを取ると失敗する可能性があります。
  • ユーザー名とパスワードだけでなく、パラメーターが必要。パラメーターが静的で変化しないのであれば、テンプレートプラグインアプリ3フィールドを使用します。
  • ログインプロセスで複数のステップを実行する、または、初期URLへのアクセスからフォーム用URLへのアクセスの間に複数のページをロードするサイト。

こうした場合、プラグイン統合であれば対処できますが、プラグインテンプレートアプリ関連の機能では不可能です。このような状況が発生した場合は、アプリ統合を手動で記述する必要があります。アプリの価格については、Oktaのプロフェッショナルサービスチームにお問い合わせください。

テンプレートBasic認証アプリ

アプリがBasic認証に対応している場合は、このテンプレートを使用します。

  • アプリケーションラベル(Application label):エンドユーザーのホームページで、アプリの下に表示するラベルを入力します。
  • URL:ログインフォームのURL(フォームが実際に表示されるURL)を入力します。
  • 認証URL(Auth URL):アプリの認証サイトのURLを入力します。
  • アプリケーションの可視性(Application Visibility):ユーザーにアプリケーションのアイコンを表示するかどうかを指定します。
  • ブラウザープラグインの自動送信(Browser plugin auto-submit):ユーザーがログインページにアクセスしたときに自動的にログインさせるかどうかを指定します。

既知の問題

ログインページがユーザーを元のURLにリダイレクトする場合、テンプレートプラグインアプリは、無限ループを引き起こすため動作しません。SWAアプリケーションはユーザーをログインページに戻さずに、Webサイトのホームページにリダイレクトしなければなりません。つまり、ログインページはユーザーの資格情報を受け入れ、ユーザーをOktaのホームページにリダイレクトする必要があります。

関連項目

OktaテンプレートWS-Federationアプリケーションを構成する