第1章 3scale 管理の API 用デベロッパーポータル作成の概要
3scale デベロッパーポータルは、API 利用者が使用する Web サイトです。
- お客様の 3scale 管理のアップストリーム API にアクセスするためにサインアップする
- お客様のアップストリーム API の使用方法に関するドキュメントを参照する
3scale が提供するデベロッパーポータルのサンプルには、ほとんどの API プロバイダーがデベロッパーポータルに実装する必要のある機能が含まれます。このネイティブデベロッパーポータルでは、サンプルの Echo API を使用して、一般的なデベロッパーポータルの構造を実証します。ネイティブデベロッパーポータルの確認後、ポータルを変更するための手順が記載されているので、独自のデベロッパーポータルの作成方法を理解することができます。
ネイティブデベロッパーポータルの確認および変更の前提条件はありません。ただし、ネイティブのデベロッパーポータルを変更して独自のデベロッパーポータルを作成したら、デベロッパーポータルを API 利用者に公開する前に、サインインワークフローおよび認証も実装する必要があります。
1.1. デベロッパーポータル作成用の 3scale 編集環境の確認
デベロッパーポータルの作成を開始する前に、3scale で提供されるサンプルの Echo API デベロッパーポータルを確認してください。Echo API デベロッパーポータルは、専用のデベロッパーポータルを作成するための開始点となります。デベロッパーポータルはゼロから作成しません。代わりに、ネイティブの Echo API デベロッパーポータルを変更して、希望のルックアンドフィールのデベロッパーポータルを作成します。
手順
- 3scale 管理ポータルで、上部のコンテキストセレクターを展開し、Audience をクリックします。
左側のナビゲーションツリーで Developer Portal を展開し、Content をクリックします。これにより、デベロッパーポータルを作成するためのメインの編集環境が表示されます。

3scale では、Root に、デベロッパーポータルのリソース階層が表示されます。
- Documentation、Homepage、および Show は、デベロッパーポータルの基盤ページです。各ページでスクロールダウンし、ページコンテンツを定義する HTML を表示します。
- これらのページより下のフォルダーには、3scale リソースをデベロッパーポータルにプルするページが含まれます。たとえば、Account フォルダーには、3scale 管理者が管理ポータルで作成した 3scale アカウントを表示および編集するページが含まれます。これらのページを開始点として使用し、必要に応じて変更します。
- 右上の New Page ドロップダウンでは、ページ、レイアウト、パーシャル、セクション、ファイル、またはポートレットを追加できます。それぞれの項目を選択して、作成するために指定する情報を表示します。
- Developer Portal > Content を選択し、Layoutsが表示されるまでリソースの階層をほぼ最下部までスクロールし、Main layout をクリックします。
Layout ‘Main Layout" の見出しが表示されるように、上方向にスクロールします。
内部タイトルとシステム名の後に、Liquid が有効になっていることを確認できます。Liquid は、3scale が 3scale システムからのほとんどのデータを表示および処理するのに使用するフレームワークです。ページコンテンツを定義するコードには、Liquid マークアップと HTML が含まれます。これは Draft タブに表示されます。これには、デベロッパーポータルページのメインレイアウトのコードが含まれています。
- 左側のナビゲーションツリーで、Developer Portal > Content の下にある各サブカテゴリーを順番にクリックして確認します (Drafts、Redirects、Groups、Logo、Feature Visibility、および ActiveDocs)。
左側のナビゲーションツリーで、Developer Portalの下にある Visit Portal (最後のエントリー) をクリックします。
新しいブラウザータブに、3scale が提供する Echo API デベロッパーポータルの開発バージョンの Web サイトが表示されます。この開発バージョンを使用して、3scale ネイティブデベロッパーポータルを表示します。その後、ネイティブデベロッパーポータルのカスタマイズを繰り返し、加えた変更を表示して、独自のデベロッパーポータルを作成することができます。
最上部にDraft|Publishedと書かれた濃いグレーのパネルが右側にあるので、これがデベロッパーポータルの開発バージョンであることが確認できます。Draft ビューは、反復/差分の改善をサポートします。Draft バージョンの見栄えおよび動作が希望どおりになったら、公開できます。
右側のパネルには、現在のページのコンテンツを提供する要素が一覧表示されます。
- Page Homepage
- Layout Main layout
- Partial Submenu
- Partial analytics
- Page Homepage をクリックします。新しいブラウザータブに、編集するために Page 'Homepage' が開いているデベロッパーポータルの編集環境が表示されます。
Echo API デベロッパーポータルの開発バージョンに戻り、右上の SIGN IN をクリックすると、API 利用者がデベロッパーポータルにサインインするために使用する SIGN IN ページが表示されます。
右側のグレーのパネルのテンプレートリストの下に、ユーザー名およびパスワードがあります。これを使用して、デベロッパーポータルへのサインインをシミュレーションできます。
-
SIGN IN ページの USERNAME OR EMAIL フィールドに
Johnを入力します。これは、右側のグレーパネルに一覧表示されるユーザー名です。 -
PASSWORD フィールドに、グレーのパネルに一覧表示されるパスワードである
123456を入力します。 - Sign In をクリックし、API 利用者に表示されるデベロッパーポータルを表示します。
-
SIGN IN ページの USERNAME OR EMAIL フィールドに
次のステップ
引き続き、十分にネイティブデベロッパーポータルを確認してください。編集環境や、Echo API デベロッパーポータルの開発バージョンの操作に慣れたら、3scale ネイティブデベロッパーポータルの変更 の手順に従います。