Web アプリ
Web アプリケーションを開発する際に、IBM Cloud® App ID Web フローを使用して、ユーザーを安全に認証できます。 これによりユーザーは、Web アプリ内にあるサーバー・サイドの保護コンテンツにアクセスできるようになります。
フローについて
Web アプリでは、保護コンテンツにアクセスするために、しばしばユーザーの認証を要求します。App ID は、OIDC 許可コード・フローを使用して、ユーザーを安全に認証します。 このフローでは、ユーザーが認証されると、アプリは許可コードを受け取ります。 次いでそのコードは、アクセス・トークン、識別トークン、およびリフレッシュ・トークンに交換されます。 コードでは、トークンの交換ステップは常にアプリとOIDCサーバー間の安全なバックチャネルを使用して送信されます。 このプロセスは、攻撃者がトークンを傍受することができないため、セキュリティの別のレイヤーを提供する。 これらのトークンは、ユーザー認証のために、アプリケーションをホストしている Web サーバーに直接送信できます。
-
ユーザーは、App ID SDK または API を介して
/authorization
エンドポイントに要求を送信することにより、許可フローを開始します。 -
ユーザーが許可されていない場合、App ID へのリダイレクトによって認証フローが開始します。
-
ユーザーの
/authorization
要求パラメーターまたは ID プロバイダー構成に応じて、ユーザーのブラウザー内でログイン・ウィジェットを開始します。 -
ユーザーは、認証を行う ID プロバイダーを選択し、サインイン・プロセスを実行します。
-
ID プロバイダーは、許可コードと共にクライアント・アプリにリダイレクトします。
-
App ID SDK は、許可コードを、App ID サービスからのアクセス・トークン、識別トークン、およびオプションのリフレッシュ・トークンに交換します。
-
それらのトークンが App ID SDK によって保存され、クライアント・アプリケーションへのリダイレクトが行われます。
-
ユーザーはアプリへのアクセス権限を付与されます。
Node.js SDK の構成
App ID で、Node.js Web アプリケーションを操作するための構成を行います。
開始前に
以下の前提条件を満たしている必要があります。
- App ID サービスのインスタンス
- サービス資格情報のセット
- NPM バージョン 4 以上
- Node バージョン 6 以上
- App ID サービス・ダッシュボードで設定されたリダイレクト URI
App ID を使用した Node アプリケーションの保護については、以下のビデオをご覧ください。 そして、 簡単な Node サンプルアプリを使って、自分で試してみてください。
Node.js SDK のインストール
-
コマンド・ラインを使用して、Node.js アプリが含まれているディレクトリーに移動します。
-
App ID サービスをインストールします。
npm install --save ibmcloud-appid
Node.js SDK の初期化
-
require
ファイルに以下のserver.js
定義を追加します。const express = require('express'); const session = require('express-session') const passport = require('passport'); const WebAppStrategy = require("ibmcloud-appid").WebAppStrategy; const CALLBACK_URL = "/ibm/cloud/appid/callback";
-
express-session ミドルウェアを使用するように express アプリをセットアップします。
const app = express(); app.use(session({ secret: "123456", resave: true, saveUninitialized: true })); app.use(passport.initialize()); app.use(passport.session());
ミドルウェアには、実稼働環境用の適切なセッション・ストレージを構成する必要があります。 詳しくは、 express.jsを参照してください。
-
次のいずれかの方法で資格情報を入手します。
-
App ID ダッシュボードの**「アプリケーション」タブに移動します。 リスト内にアプリケーションがない場合は、「アプリケーションの追加 (Add application)」**をクリックしてアプリケーションを作成できます。
-
/management/v4/<tenantId>/applications
エンドポイントに対して POST 要求を行う。要求の形式:
curl -X POST \ https://us-south.appid.cloud.ibm.com/management/v4/39a37f57-a227-4bfe-a044-93b6e6060b61/applications/ \ -H 'Content-Type: application/json' \ -H 'Authorization: Bearer <IAMToken>' \ -d '{"name": "ApplicationName"}'
応答の例:
{ "clientId": "111c22c3-38ea-4de8-b5d4-338744d83b0f", "tenantId": "39a37f57-a227-4bfe-a044-93b6e6060b61", "secret": "ZmE5ZDQ5ODctMmA1ZS00OGRiLWExZDMtZTA1MjkyZTc4MDB4", "name": "ApplicationName", "oAuthServerUrl": "https://us-south.appid.cloud.ibm.com/oauth/v4/39a37f57-a227-4bfe-a044-93b6e6060b61" }
-
-
オプション: リダイレクト URI のフォーマット方法を決めます。 リダイレクトは、2 つの異なる方法でフォーマットできます。 以下のオプションのどちらも提供されていない場合、 App ID SDKは、 IBM Cloud 上で実行されているアプリの
application_uri
を取得し、デフォルトの接尾辞/ibm/cloud/appid/callback
を付加しようとします。- 新しい
WebAppStrategy({redirectUri: "...."})
内に手動で redirectUri
という名前の環境変数として
- 新しい
-
前述のステップで入手した情報を使用して、SDK を初期化します。
passport.use(new WebAppStrategy({ tenantId: "<tenantID>", clientId: "<clientID>", secret: "<secret>", oauthServerUrl: "<oauthServerURL>", redirectUri: "<appURL>" + CALLBACK_URL }));
-
Passport にシリアライゼーションとデシリアライゼーションを構成します。 この構成手順は、複数の HTTP 要求にわたって認証済みセッション・パーシスタンスを維持するために必要です。 詳しくは パスポートのドキュメントをご覧ください。
passport.serializeUser(function(user, cb) { cb(null, user); }); passport.deserializeUser(function(obj, cb) { cb(null, obj); });
-
server.js
ファイルに以下のコードを追加して、サービス・リダイレクトを発行します。app.get(CALLBACK_URL, passport.authenticate(WebAppStrategy.STRATEGY_NAME));
-
以下のコード・スニペットを
app.js
ファイルに追加して、保護エンドポイントを登録します。app.get(‘/protected_resource’, passport.authenticate(WebAppStrategy.STRATEGY_NAME), function(req, res) {res.json(req.user); });
詳しくは、 App ID Node.js GitHub リポジトリーを参照してください。
Liberty for Java SDK の構成
App ID で、Liberty for Java Web アプリケーションを操作するための構成を行います。
開始前に
以下の前提条件を満たしている必要があります。
- App ID サービスのインスタンス
- サービス資格情報のセット
- Apache Maven 3.5 以上
- Java 1.8
- Liberty for Java Web アプリケーション
App ID を使用した Liberty for Java アプリケーションの保護については、以下のビデオをご覧ください。 そして、 簡単な Liberty for Java サンプルアプリを使って、自分で試してみてください。
Liberty for Java SDK のインストール
-
OpenID Connect 機能を
server.xml
に追加します。<featureManager> <feature>ssl-1.0</feature> <feature>appSecurity-2.0</feature> <feature>openidConnectClient-1.0</feature> </featureManager>
-
次の 2 つの方法のいずれかで資格情報を入手します。
-
App ID ダッシュボードの**「アプリケーション」タブに移動します。 アプリケーションがまだない場合は、「アプリケーションの追加 (Add application)」**をクリックして新しいアプリケーションを作成できます。
-
/management/v4/<tenantID>/applications
エンドポイントに対して POST 要求を行う。要求の形式:
curl -X POST \ https://us-south.appid.cloud.ibm.com/management/v4/39a37f57-a227-4bfe-a044-93b6e6060b61/applications/ \ -H 'Content-Type: application/json' \ -H 'Authorization: Bearer <IAMToken>' \ -d '{"name": "ApplicationName"}'
応答の例:
{ "clientId": "111c22c3-38ea-4de8-b5d4-338744d83b0f", "tenantId": "39a37f57-a227-4bfe-a044-93b6e6060b61", "secret": "ZmE5ZDQ5ODctMmA1ZS00OGRiLWExZDMtZTA1MjkyZTc4MDB4", "name": "ApplicationName", "oAuthServerUrl": "https://us-south.appid.cloud.ibm.com/oauth/v4/39a37f57-a227-4bfe-a044-93b6e6060b61" }
-
-
Open ID Connect Client フィーチャーを作成し、以下のプレースホルダーを定義します。 サービス資格情報を使用してプレースホルダーに入力します。
<openidConnectClient clientId='App ID client_ID' clientSecret='App ID Secret' authorizationEndpointUrl='oauthServerUrl/authorization' tokenEndpointUrl='oauthServerUrl/token' jwkEndpointUrl='oauthServerUrl/publickeys' issuerIdentifier='Changed according to the region' tokenEndpointAuthMethod="basic" signatureAlgorithm="RS256" authFilterid="myAuthFilter" trustAliasName="ibm.com" />
Liberty for Java アプリケーションの OIDC 要素変数 コンポーネント 説明 clientID
secret
oauth-server-url
ステップ 2 を完了してサービス資格情報を入手します。 authorizationEndpointURL
oauthServerURL
の末尾に/authorization
を追加します。tokenEndpointUrl
oauthServerURL
の末尾に/token
を追加します。jwkEndpointUrl
oauthServerURL
の末尾に/publickeys
を追加します。issuerIdentifier
発行者 ID の形式は <region>>.cloud.ibm.com
になります。 使用可能なリージョンについてはこちらを参照してください。tokenEndpointAuthMethod
"basic" を指定します。 signatureAlgorithm
"RS256" を指定します。 authFilterid
保護するリソースのリスト。 trustAliasName
トラストストア内の証明書の名前。
Liberty for Java SDK の初期化
-
server.xml
ファイルで、保護リソースを指定するための許可フィルターを定義します。 フィルターが 定義されていない場合、サービスはすべてのリソースを保護する。<authFilter id="myAuthFilter"> <requestUrl id="myRequestUrl" urlPattern="/protected_resource" matchType="contains"/> </authFilter>
-
特別なサブジェクト・タイプを
ALL_AUTHENTICATED_USERS
として定義します。<application type="war" id="ProtectedServlet" context-root="/appidSample" location="${server.config.dir}/apps/libertySample-1.0.0.war"> <application-bnd> <security-role name="myrole"> <special-subject type="ALL_AUTHENTICATED_USERS"/> </security-role> </application-bnd> </application>
-
libertySample-1.0.0.war
。 GitHub をダウンロードし、サーバーのappsフォルダに置いてください。 例えば、サーバーの名前がdefaultServer
である場合、war ファイルはtarget/liberty/wlp/usr/servers/defaultServer/apps/
に置かれます。 -
以下の内容を
server.xml
ファイルに追加して、SSL を構成します。 トラストストアも作成する必要があります。<keyStore id="defaultKeyStore" password="myPassword"/> <keyStore id="appidtruststore" password="Liberty" location="${server.config.dir}/mytruststore.jks"/> <ssl id="defaultSSLConfig" keyStoreRef="defaultKeyStore" trustStoreRef="appidtruststore"/>
デフォルトで、SSL 構成では、トラストストアを OpenID Connect 用に構成する必要があります。 Libertyでの OpenID Connect Clientの設定についてはこちらをご覧ください。
Spring Boot for Java SDK の構成
Spring Boot アプリケーションと連携するように App ID を構成できます。
開始前に
以下の前提条件を満たしている必要があります。
- App ID サービスのインスタンス
- サービス資格情報のセット
- Java + Maven プロジェクト
- Apache Maven 3.5 以上
- Java 1.8
- Spring Boot 2.0 および Security OAuth 2.0 以上
Spring Boot フレームワークの初期化
-
Maven
pom.xml
ファイルの<project> </project>
タグの間に以下のコードを追加します。<parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>2.0.2.RELEASE</version> <relativePath/> </parent>
-
Maven
pom.xml
ファイルに以下の依存関係を追加します。<dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-security</artifactId> </dependency> <dependency> <groupId>org.springframework.security.oauth.boot</groupId> <artifactId>spring-security-oauth2-autoconfigure</artifactId> <version>2.0.0.RELEASE</version> </dependency> </dependencies>
-
同じファイル内に Maven プラグインを入れます。
<plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin>
OAuth2 の初期化
-
以下のアノテーションを Java ファイルに追加します。
@SpringBootApplication @EnableOAuth2Sso
-
WebSecurityConfigurerAdapter
を使用してクラスを拡張します。 -
セキュリティー構成をオーバーライドし、保護エンドポイントを登録します。
@Override protected void configure(HttpSecurity http) throws Exception { http.authorizeRequests() .antMatchers("/protected_Resource").authenticated() .and().logout().logoutSuccessUrl("/").permitAll(); }
資格情報の追加
-
次のいずれかの方法で資格情報を入手します。
-
App ID ダッシュボードの**「アプリケーション」タブに移動します。 アプリケーションがまだない場合は、「アプリケーションの追加 (Add application)」**をクリックして新しいアプリケーションを作成できます。
-
/management/v4/<tenantID>/applications
エンドポイントに対して POST 要求を行う。要求の形式:
curl -X POST \ https://us-south.appid.cloud.ibm.com/management/v4/39a37f57-a227-4bfe-a044-93b6e6060b61/applications/ \ -H 'Content-Type: application/json' \ -H 'Authorization: Bearer <IAMToken>' \ -d '{"name": "ApplicationName"}'
応答の例:
{ "clientId": "111c22c3-38ea-4de8-b5d4-338744d83b0f", "tenantId": "39a37f57-a227-4bfe-a044-93b6e6060b61", "secret": "ZmE5ZDQ5ODctMmA1ZS00OGRiLWExZDMtZTA1MjkyZTc4MDB4", "name": "ApplicationName", "oAuthServerUrl": "https://us-south.appid.cloud.ibm.com/oauth/v4/39a37f57-a227-4bfe-a044-93b6e6060b61" }
-
-
application.yml
構成ファイルを/springbootsample/src/main/resources/
ディレクトリーに追加します。 サービス資格情報からの情報を使用して、構成を完成させることができます。security: oauth2: client: clientId: <clientID> clientSecret: <clientSecret> accessTokenUri: <oauthServerURL>/token userAuthorizationUri: <oauthServerURL>/authorization resource: userInfoUri: <oauthServerURL>/userinfo
他の言語での App ID の使用
OIDC 準拠のクライアント SDK では、App ID を他の言語で使用できます。 詳しくは 認定図書館リストをご覧ください。
次のステップ
App ID がアプリケーションにインストールされたので、ユーザーの認証を開始する準備がほとんどできています。 次に、以下のいずれかの作業を行ってください。
- ID プロバイダーを構成します
- ログイン・ウィジェットのカスタマイズと構成を行います
- 詳しくは、 Node.js SDK を参照してください。