Fujitsu

K5 Playground

K5 Playground × CF Webハンズオン

ハンズオン教材
K5「CF」の操作方法

2.1. ハンズオンの流れ

以下の流れで、ハンズオンを実施致します。

  • 事前準備
  • CFコマンドの確認
  • サンプルアプリケーションの配備
  • サンプルアプリケーションの修正

2.2. 事前準備

ハンズオン「K5 「CF」の操作方法」を進めるために必要な、事前準備を行います。
以下の準備を行ってから、ハンズオンを進めてください。(既に実施済みの作業についてはスキップしてください。)

CFコマンドのインストール

事前準備3.CFコマンドのインストール」を参照して、CFコマンドをインストールしてください。

作業用フォルダの作成

「Cドライブ」、又は「Dドライブ」直下に「K5CF\helloPaasStaticfile」フォルダを作成してください。

2.3. CFコマンドの確認

2.3.1. CFにログイン

1. APIエンドポイントの設定

[cf api]コマンドを実行して、CFのAPIエンドポイントを設定してください。

cf api https://api.<リージョン識別子>.paas-cf.cloud.global.fujitsu.com

(注)APIエンドポイントはリージョン単位で異なります。リージョン識別子は、FUJITSU Cloud Service K5 「CF」基本情報の「リージョン識別子」、及び「APIエンドポイント」から確認してください。

実行例

    東日本リージョン2(jp-east-2)を利用する場合

    cf api https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com

実行結果

    「api endpoint」にエンドポイントが設定されているかを確認してください。
    (注)APIエンドポイント設定時点では、CFにログインしていないため、「Not logged in.」と表示されます。

    C:\>cf api https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com
    Setting api endpoint to https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com...
    OK
    
    api endpoint:   https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com
    api version:    2.77.0
    Not logged in. Use 'cf login' to log in.

2. CFにログイン

[cf login]コマンドを実行してください。

cf login -u <ユーザー名> -o <組織名> -s <スペース名>
  • ユーザー名:通知されたユーザー名、契約番号を[ユーザー名@契約番号の形式]で指定します。
  • 組織名:通知された契約番号を指定します。
  • スペース名:通知されたスペース名を指定します。

実行例

    ユーザー名[CFUSER]、契約番号[AAA00001]、スペース名[CFSPACE]でログインする場合

    cf login -u CFUSER@AAA00001 -o AAA00001 -s CFSPACE

[cf login]コマンドを実行すると、パスワードを聞かれますので、「Password>」の後に続きて、通知されたパスワードを入力してください。
(注)パスワード入力時、タイプした文字は表示されません。

C:>cf login -u CFUSER@AAA00001 -o AAA00001 -s CFSPACE
API endpoint: https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com

Password>

実行結果

    「API endpoint」、「User」、「Org」、「Space」を確認し、正しくログインできていることを確認してください。

    C:>cf login -u CFUSER@AAA00001 -o AAA00001 -s CFSPACE
    API endpoint: https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com
    
    Password>
    Authenticating...
    OK
    
    Targeted org AAA00001
    
    Targeted space CFSPACE
    
    
    
    API endpoint:   https://api.jp-east-2.paas-cf.cloud.global.fujitsu.com (API version: 2.77.0)
    User:           CFUSER@AAA00001
    Org:            AAA00001
    Space:          CFSPACE

2.3.2. アプリケーションの確認

1. アプリケーション一覧を表示

[cf apps]コマンドを実行してください。

cf apps

実行結果

    アプリケーションが表示されることを確認してください。
    (注)7日間無料トライアルでは、3つのアプリケーションを用意しております。

    C:\>cf apps
    Getting apps in org AAA00001 / space CFSPACE as CFUSER@AAA00001...
    OK
    
    name                 requested state   instances   memory   disk   urls
    AAA00001-xxxx1234    stopped           0/1         512M     1G     AAA00001-xxxx1234.jp-east-2.cf-app.net
    AAA00001-yyyy1234    stopped           0/1         256M     1G     AAA00001-yyyy1234.jp-east-2.cf-app.net
    AAA00001-yyyy5678    stopped           0/1         256M     1G     AAA00001-yyyy5678.jp-east-2.cf-app.net

2. アプリケーションの情報を確認

[cf app]コマンドを実行してください。

cf app <アプリケーション名>

実行例

    アプリケーション「AAA00001-xxxx1234」を確認する場合

    cf app AAA00001-xxxx1234

実行結果

    アプリケーション情報が出力されていることを確認してください。

    C:\>cf app AAA00001-xxxx1234
    Showing health and status for app AAA00001-xxxx1234 in org AAA00001 / space CFSPACE as CFUSER@AAA00001...
    OK
    
    requested state: started
    instances: 0/1
    usage: 512M x 1 instances
    urls: AAA00001-xxxx1234.jp-east-2.cf-app.net
    last uploaded: Wed Sep 6 08:40:42 UTC 2017
    stack: cflinuxfs2
    buildpack: nodejs_buildpack
    
    There are no running instances of this app.

「1.アプリケーション一覧を表示」で確認したアプリケーション毎に[cf app]コマンドを実行し、対応するビルドパックを確認してください。
本Webハンズオンでは、「node.js_buildpack」×1、「staticfile_buildpack」×2の環境をご用意しております。

本教材では、3つのアプリケーションを以下のように定義して、ハンズオンを進めます。 (注)以下で記載している赤文字部分のアプリケーション名はダミーとなっております。本章で確認した際に表示されたアプリケーション名を当てはめてハンズオンを進めてください。

  • バックエンドアプリ「AAA00001-xxxx1234」:node.js_buildpack
  • フロントエンドアプリ①「AAA00001-yyyy1234」:staticfile_buildpack
  • フロントエンドアプリ②「AAA00001-yyyy5678」:staticfile_buildpack

2.4. サンプルアプリケーションの配備

アプリケーションをK5 CFに配備します。

使用するアプリケーション

  • フロントエンドアプリ②「AAA00001-yyyy5678」:staticfile_buildpack

アプリケーション配備時のイメージ

2.4.1. サンプルアプリケーションのダウンロード

1. 「サンプルアプリケーション」のダウンロードサイトにアクセス

以下のURLにアクセスしてください。
https://cf-docs.jp-east-1.paas.cloud.global.fujitsu.com/ja/sample/index.html

2. サンプルアプリケーションのダウンロード

「Staticfile」をクリックしてください。
(注)本教材では、「東日本リージョン2」の「Staticfile」をダウンロードしておりますが、ダウンロードするサンプルアプリケーションはご利用されているリージョンに合わせてダウンロードしてください。

3. zipファイルの展開

ダウンロード先に移動してください。

「helloPaasStaticfile.zip」を右クリックし、「すべて展開」をクリックしてください。

事前準備で用意した作業用フォルダを指定し、「展開」をクリックしてください。

「helloPaasStaticfile」フォルダに移動し、資材が展開されているかを確認してください。

2.4.2. サンプルアプリケーションの配備

1. ディレクトリの移動

[helloPaasStaticfile]ディレクトリに移動してください。

d:
cd \K5CF\helloPaasStaticfile

2. サンプルアプリケーションの配備

[cf push]コマンドを実行してください。

cf push <フロントエンドアプリ②>

実行例

    フロントエンドアプリ②「AAA00001-yyyy5678」にサンプルアプリケーションを配備する場合

    cf push AAA00001-yyyy5678

実行結果

    「ERR!」が出力されていないこと、及びstateに「running」が出力されていることを確認してください。

    D:\K5CF\helloPaasStaticfile>cf push AAA00001-yyyy5678
    ----------------------------------------------------------------------------------
    ~省略~
    ----------------------------------------------------------------------------------
         state     since                    cpu    memory         disk         details
    #0   running   2017-09-12 04:33:59 PM   0.0%   3.7M of 256M   5.5M of 1G

2.4.3. サンプルアプリケーションの確認

1. アプリURLにアクセス

WebブラウザからアプリURLにアクセスしてください。
http://<フロントエンドアプリ②>.<リージョン識別子>.cf-app.net/

実行例

    東日本リージョン2のCFに配備したフロントエンドアプリ②「AAA00001-yyyy5678」にアクセスする場合
    http://AAA00001-yyyy5678.jp-east-2.cf-app.net/

以下のように表示されましたら、正常に配備・起動されています。

2.4.4. アプリケーションの停止

実際にご契約いただいた場合、K5 CF は、ご利用時間ごとの課金となっております。
K5 CFを開発環境で使用されている場合、使用していないアプリケーションは停止しておくことをお勧めします。

アプリケーションを停止する場合は、以下の操作を実施してください。

1. アプリケーションの停止

[cf stop]コマンドを実行してください。

cf stop <フロントエンドアプリ②>

実行例

    フロントエンドアプリ②「AAA00001-yyyy5678」を停止する場合

    cf stop AAA00001-yyyy5678

実行結果

    C:\>cf stop AAA00001-yyyy5678
    Stopping app AAA00001-yyyy5678 in org AAA00001 / space CFSPACE as CFUSER@AAA00001...
    OK

2.4.5. アプリケーションの起動

再度アプリケーションを起動する場合は、以下の操作を実施してください。

1. アプリケーションの起動

[cf start]コマンドを実行してください。

cf start <フロントエンドアプリ②>

実行例

    フロントエンドアプリ②「AAA00001-yyyy5678」を起動する場合

    cf start AAA00001-yyyy5678

実行結果

    「ERR!」が出力されていないこと、及びstateに「running」が出力されていることを確認してください。

    C:\>cf start AAA00001-yyyy5678
    Starting app AAA00001-yyyy5678 in org AAA00001 / space CFSPACE as CFUSER@AAA00001...
    ----------------------------------------------------------------------------------
    ~省略~
    ----------------------------------------------------------------------------------
    	  state      since                          cpu      memory        disk            details
    #0   running   2017-09-08 01:31:10 PM   0.0%   3.7M of 256M   5.5M of 1G

2.5. サンプルアプリケーションの修正

2.5.1. サンプルアプリケーションの修正

1. ディレクトリの移動

「D:\K5CF\helloPaasStaticfile」フォルダに移動してください。

2. 「index.html」ファイルの修正

「index.html」ファイルを右クリックし、「プログラムを開く」から「別のプログラムを選択」をクリックしてください。

任意のテキスト・エディターを選択し、「OK」をクリックしてください。
(注)使用するエディターは、コードの修正に用いるため、「メモ帳」以外のエディターをお勧めします。

赤文字部分を追加し、上書き保存してください。(HTMLの知識をお持ちの方はご自由に編集ください)

<!DOCTYPE html>
<html>
<head>
	<title>Staticfile sample of Fujitsu PaaS</title>
</head>
<body>
	<h1 style='color:#ff0000;'><p>Hello, welcome to Fujitsu PaaS!</p></h1>
</body>
</html>

2.5.2. サンプルアプリケーションの配備

1. ディレクトリの移動

[helloPaasStaticfile]ディレクトリに移動してください。

d:
cd \K5CF\helloPaasStaticfile

2. サンプルアプリケーションの配備

[cf push]コマンドを実行してください。

cf push <フロントエンドアプリ②>

実行例

    フロントエンドアプリ②「AAA00001-yyyy5678」にサンプルアプリケーションを配備する場合

    cf push AAA00001-yyyy5678

実行結果

    「ERR!」が出力されていないこと、及びstateに「running」が出力されていることを確認してください。

    D:\K5CF\helloPaasStaticfile>cf push AAA00001-yyyy5678
    ----------------------------------------------------------------------------------
    ~省略~
    ----------------------------------------------------------------------------------
         state     since                    cpu    memory         disk         details
    #0   running   2017-09-13 10:16:09 AM   0.0%   2.6M of 256M   5.5M of 1G

2.5.3. サンプルアプリケーションの確認

1. アプリURLにアクセス

WebブラウザからアプリURLにアクセスしてください。
http://<フロントエンドアプリ②>.<リージョン識別子>.cf-app.net/

実行例

    東日本リージョン2のCFに配備したフロントエンドアプリ②「AAA00001-yyyy5678」にアクセスする場合
    http://AAA00001-yyyy5678.jp-east-2.cf-app.net/

以下のように、大見出しで文字が赤く表示されましたら、正常に修正・配備されています。

以上で、ハンズオン「K5 「CF」の操作方法」は終了です。

Japan

国・地域を変更

ページの先頭へ