当ブログに掲載しているサンプルは、すべて利用者の自己責任という形でお願いします。
ただし、明らかな不具合がある場合、ご連絡いただければ、訂正記事を出します。
また、こちらのサンプルは、別のサイト等への公開、転載は一切禁止しています。
どうしてもと言う場合は、筆者にあらかじめご連絡ください。

テクてく Lotus 技術者 Slack に参加しよう!

2016年8月27日土曜日

XPages研究会のハンズオンをまとめましたよ(2)

はい、こんにちは。

前回(XPages研究会のハンズオンをまとめましたよ(1))の続きです。

前回は、Node-REDアプリ経由でTwitterのつぶやきデータをIBM Bluemix上のXPages NoSQL Databaseに格納するところまで実装しました。


次は、XPages NoSQL Databaseの内容をXPagesアプリで表示してみましょう。ということでXPagesアプリを作成します。

5.xspアプリを作成する

  • Bluemixのダッシュボードに戻り、「Cloud Foundryアプリ」にある[アプリの作成]をクリックする
  • 「どのような種類のアプリを作成しますか?」を聞かれるので、[Web]をクリックする
  • 「どのように開始しますか?」を聞かれるので、[XPages]をクリックする
  • 画面下にXPagesの説明が表示されるので読んだら、[続行]をクリックする
  • 「新規アプリはどのような名前にしますか?」と聞かれるので、[アプリ名]にアプリケーションの名前を入力する(*1)
  • [完了]をクリックする
  • アプリケーションのステージングが完了するのを待つ
  • 「アプリは実行中です。http://~」の表示になったら、ダッシュボードに戻る
  • 実行中になっているxspアプリをクリックする
  • アプリケーションの画面になるので、[サービスまたはAPIのバインド]をクリックする
  • 「アプリケーションへのサービスの追加」画面が表示されるので、作成したXPages NoSQL Databaseを選択して[追加]をクリックする
  • 再ステージが必要という画面が表示されるので[再ステージ]をクリックする
  • 再ステージが完了すると、アプリケーションの画面にXPages NoSQL Databaseが追加されているのが確認できる

*1 任意で良いが、Bluemix全体でユニークである必要があるので、自分のものと分かり易いような名前をつけること


これでXPages on Bluemixとしての準備はできましたが、まだXPagesアプリをきちんと作成していません。
ここでようやくIBM Domino Designerを使ってXPagesアプリを作成します。

6.XPagesアプリを作成する

  • 前回の記事の「2.XPages NoSQL Databaseサービスを作成」でダウンロードしたBluemix用のNotes User IDを使ってXPagesアプリケーションを作成する
スターターコードをダウンロードすることによって、ある程度作成されたNotesDBを利用することもできますが、大したものを作成するわけではないので、今回は新規にNotes DBを作成します。

  • まず、事前に作成してあるXPages NoSQL Databaseで作成したフォームを表示するためのXPageを作成する
フォームの情報を表示するので、Domino文書のデータソースを定義します。
まず、データソースはIBM Bluemix上にあるXPages NoSQL Databaseなので、現在作成しているNotes DBとは別の場所にあります。そのため、データソースも「現在のアプリケーション」ではなく、計算して求める必要があります。
計算式は次のようになります。
bluemixContext.getDataService().findDatabaseName();
というのが、Bluemix上のNotes DBを探すための関数です。
xspアプリにXPages NoSQL Databaseをバインドしておくと、この関数によりそのNotes DBのファイル名を取得することができるようです。

あとは、フィールドを表示するためのコントロールを2つ定義して終わりです。
今回は編集する必要はないので、「計算結果コントロール」を配置しています。
  • 次にビューを表示するためのXPageを作成する
今回はサンプルということでビューコントロールを配置しただけのものにしました。
ここで注意したいのが、データソースの定義とビュー列の設定です。

データソースの定義はフォームの時と同じように、
bluemixContext.getDataService().findDatabaseName();
で取得するようにします。
この方法でデータソースを定義すると、ビュー名は自動で取得できないため、手動で入力する必要があります。

また、これにより、ビュー列も自動で取得することができないため、手動で追加する必要があります。
ソース画面で直接入力することもできますが、GUI上での操作をする場合、ビューコントロール上でマウスの右クリックをして[列の追加]メニューを実行すれば良いです。
当然、ビュー列の値も手動で設定する必要があります。

さらに、「実行時に、選択した文書を開くために使用」の項目の値を先ほど作成したフォーム用のXPageの名前に変更します。


ビューが作成できたらXPageを保存します。
  • XPageを作成したらアプリケーションビューで[IBM Bluemix Manifest]をダブルクリックする
  • IBM Bluemix Manifestを作成するウィザードを起動するかどうか聞いてくるので、[はい]をクリックする

ここからはいよいよBluemixにxspアプリをアップロードするための作業に入ります。
IBM Domino Desigerのプリファレンス設定でBluemixとの接続設定はできるようなっているはずですが、どのアプリケーションと関連付けするのかといった設定をすることになります。
といってもウィザードの設定どおりにすれば簡単にできます。
  • デプロイ用のディレクトリの場所を聞いてくるので任意のフォルダを指定する
  • [次へ]をクリックする
任意のフォルダとなっていますが、後で分からなくならないように、Notesが格納されている場所とは別のフォルダにすると良いでしょう。
  • デプロイ方法を聞いてくるので、そのまま[次へ]をクリックする
デプロイするのに、Notes DBのコピーを配置するのかレプリカを配置するのかを聞いてきます。
コピーを推奨しているので、そのままにしておきましょう。
  • デプロイするスペースを聞いてくるので、xspアプリがあるスペースを選択して[次へ]をクリックする
ここでは自分が作成したxspアプリがBluemixのどのスペースにあるのかを聞いてきます。
スペースが見当たらない場合は、Bluemixの別のリージョン(地域:米国南部、英国、シドニーのいずれか)に作成している可能性があるので、IBM Domino DesignerのプリファレンスでBluemixのURLを確認してください。
  • アプリケーションを作成するのか既存のに置換するのか聞いてくるので先ほど作成したxspアプリを選択して[終了]をクリックする
ここでxspアプリの名前を選択します。忘れてしまった!という場合は、Bluemixのダッシュボードで確認しましょう。
たくさんアプリを作成している場合は間違えないように注意してくださいね。
  • IBM Bluemix Manifestが作成されたので、[ESC]を押して画面を閉じる

これでこのNotes DBとBluemixのアプリの連携設定ができました。
この作業(IBM Bluemix Manifestの作成)は一つのNotes DBにつき一度だけ設定すればよいものです。
  • アプリケーションを右クリックして[IBM Bluemix]-[Deploy Application]をクリックする

この作業を行うと、Notes DBがBluemix上にデプロイされます。ここはかなり時間がかかりますので、気長に待ちましょう。

  • デプロイに成功すると、「Deployment Success」というメッセージが表示されるので[OK]をクリックする

このメッセージが表示されたら、IBM Bluemix上でアプリケーションが稼働している状態になっています。
ダッシュボードでアプリの画面を開いてxspアプリのURLをクリックします。
すると、XPagesアプリケーションが別ウィンドウで開きます。



起動したばかりなので、ビューには何も表示されていませんが、Twitterでつぶやけば、その内容が表示されるようになります。
(当然、Node-REDのアプリも起動しておく必要があります)


ということで、XPages研究会の7-8月のハンズオンの内容を2回に分けて紹介してみました。
XPages研究会のメンバーでまだ出来上がってないという方や、IBM BluemixとXPagesの連携に興味があるな。という方は、この記事を元に演習してみてくださったら嬉しい限りです。


では、今日はこの辺で・・・




2016年8月26日金曜日

XPages研究会のハンズオンをまとめましたよ(1)

みなさん、こんにちは。
8月も終わりに差し掛かっているというのに暑い日が続いています。

さて、私はノーツコンソーシアムという団体に参加しています。
さらに、その中のXPages研究会(月一開催、コンソーシアム会員のみ参加可能)に参加しています。
今年のテーマは、「Bluemixとの連携(twillio, node-red関連)をやってみたい」(あわよくば、業務で使えるアプリを開発したい)です。

4-6月はIBM BluemixやNode-REDについての学習や、IBM BluemixにXPageアプリをデプロイする方法について学習しました。
7-8月は、実際にアプリケーションを作ってみようということで、ソルクシーズ 吉田さんの記事(こちら)をもとにして、全部をIBM Bluemix上で実現してみよう!ということをやってみました。

吉田さんの記事ではNode-REDもDominoもオンプレミス環境にあるのですが、それを全部IBM Bluemix上に移植してみようということです。


実は、私の説明が悪かったため、参加者の皆さん、「何をどうすればいいのよ???」という状態だったようで、反省を兼ねて、実装方法をまとめることにしました。


今回やろうとしていることを図に示すとこんな感じかな?
TwitterのデータをNode-REDを経由して、XPages NoSQL Databaseに格納
TwitterのつぶやきデータをNode-REDを経由して、XPages NoSQL Databaseに格納します。
そのXPages NoSQL Databaseに格納された文書をXPages on BluemixのアプリでWebブラウザから参照する。
といった感じです。


では、実際の方法を見ていきましょう。
※実際のXPages研究会での実装手順に基づいているため、順番は最適化されていませんのでご了承ください。

0.前提条件

  • IBM Bluemixアカウントを所持している
  • IBM Domino Designer 9.0.1 FP6をインストール済み
  • XPages Extension Library Release 15以上がインストール済み
  • IBM Domino DesignerのプリファレンスでIBM Bluemixの設定が完了している

IBM Bluemix上にアプリを作成するので、アカウントは作っておくことが必要になります。
また、XPagesアプリケーションを作成するので、IBM Domino Designerが必要になります。さらに、Bluemixへアプリケーションをデプロイするためには、XPages Extension Libraryをインストールしておく必要があります。


1.Node-REDアプリを作成

  • Bluemixのダッシュボードから「Cloud Foundryアプリ」にある[アプリの作成]をクリックする
Cloud Foundryアプリの作成
  • 「どのような種類のアプリを作成しますか?」を聞かれるので、[Web]をクリックする
  • 「どのように開始しますか?」を聞かれるので、[ボイラープレートの参照]をクリックする
  • 画面下に「ボイラープレートの参照」が表示されるので[ボイラープレートの参照]をクリックする
  • ボイラープレートの一覧が表示されるので、[Node-RED Starter コミュニティー]をクリックする
  • Node-RED Starter コミュニティの作成画面になるので、[名前]にアプリケーションの名前を入力する(*1)

  • [作成]をクリックする(*2)
  • アプリケーションのステージングが完了するのを待つ
  • 「アプリは実行中です。http://~」の表示になったら、[http://~]のリンクをクリックする
  • Node-REDの初期画面が表示されるので、[Go to your Node-RED flow editor]をクリックする
*1 任意で良いが、Bluemix全体でユニークである必要があるので、自分のものと分かり易いような名前をつけること
*2 名前以外の項目はデフォルトのままで良い

このままNode-REDのアプリ作成に突入したいところですが、Twitterから取得したデータをBluemix上のXPages NoSQL Databaseに格納するので、そのサービスを作っておく必要があります。

2.XPages NoSQL Databaseサービスを作成

  • IBM Bluemixのダッシュボードに戻り、「サービス & API」にある[サービスまたは API の使用]をクリックする
  • サービスの一覧画面になるので、画面一番下にある[Bluemix Labs Catalog]をクリックする 
  • IBM Bluemix Labs Catalogの一覧画面になるので、「データおよび分析」にある[XPages NoSQL Database]をクリックする
  • XPages NoSQL Databaseの作成画面になるので、そのまま[作成]をクリックする
  • IBM XPages NoSQL Database Serviceの画面になるので[LAUNCH]をクリックする
  • IBM XPages NoSQL Database Service Dashboardの画面になるので、[Download ID]をクリックする
  • Notes User IDがダウンロードされるので保管しておくこと(*3)
  • Node-REDで使用するユーザを登録するので「Web End Users」にある[Manage Web End Users]をクリックする
  • ユーザ名の一覧が表示されるので、[Create Web End User]をクリックする
  • FirstName、LastName、Passwordを入力したら[Create]をクリックする
  • ユーザーが作成されて一覧に表示される

*3 パスワードは「Password」欄に書いてある([Show]をクリックすると表示される)


XPages NoSQL Databaseの実体は、Notes DB(****.nsf)です。Bluemix上に作成されるのでアクセスするには専用のNotes User IDが必要であるということです。


3.Notes DBを修正する

  • ダウンロードしたBluemix用のNotes User IDを使ってDomino Designerを開く(*4)
  • IBM XPages NoSQL Database Service Dashboardの画面にある「Active DBs」の「DB Path」を参考にしてNotes DBを開く
  • フォームを作成する(フォーム名は任意ですが、ここでは「fmTwitter」としておきます)
  • フォームに日付フィールドとテキストフィールドを作成する(フィールド名は、それぞれ「created_dt」「body」としておきます)
  • フォームを保存する
  • 作成したフォームの文書だけを表示するビューを作成する(ビュー名は任意ですが、ここでは「vwTwitter」としておきます)
  • ビューの列情報は任意で作成してよい
  • Notes DBのACLにIBM XPages NoSQL Database Service Dashboardの画面で作成したユーザをエントリしておく(*5)

*4 ロケーション文書を作成して、Bluemix用のDomino Serverに接続できるようにしておくこと
*5 アクセス権は[編集者]にしておくこと


これで、Twitterのデータを格納するためのNotes DBが出来上がりました。
いよいよ、Node-REDアプリを作成します。

4.Node-REDのフローを作成する

  • Node-REDのコーディング画面にもどり、ノードを作成する
※ノードの作成方法については、前述した吉田さんの記事を参照してください。
  • 作成したら[Deploy]をクリックする


これでTwitterから何かつぶやけば、XPages NoSQL DatabaseにNotes文書として格納されます。
つぶやいてから、文書として格納されるまでに時間がかかります(私の場合、1分以上かかってました)。

あとはXPagesアプリを作って参照できるようにするのですが、今日はここまでとします。
続きはまた今度。


2016年8月9日火曜日

XPagesでISO8601形式の日時表記をする際は気を付けましょう

皆さん、こんにちは。暑い日が続きますが、XPages開発はしてますか?

私は・・・しばらくしてませんでした。
そのせいなのか?開発の勘を取り戻すのにちょっと苦労しました(え?そんなにできやしない癖に何を偉そうにって?スミマセン・・・)


さて、閑話休題。
今日もXPagesでの日付の話題です。
XPagesはWebアプリケーションなので、日付の扱いがNotesクライアントと異なるために、色々と難しい問題を抱えています。
っていうか、Webの世界での日付の扱いが雑すぎるんじゃないか?って思ってますw

今回はISO8601形式についてです。
色々と検索してみると、
基本形式と拡張形式の2種類があって、
それぞれ
基本形式: yyyymmddThhMMss
拡張形式: yyyy-mm-ddThh:MM:ssZ
という表示の仕方(UTC形式の場合)をするという認識でした。

そして、日時をこの形式に変換するのには、
DateクラスのtoISOString()メソッドを使うものだと思ってました。えぇ、今朝までは・・・

なので、XPagesでもそうだろうと思い、プログラムを実装して動かしてみたら、
動かない!っていうか、正しく変換されない!
どういうことよ!!!

と思って、SSJSとCSJSで同じ関数を実行して違いを確認してみました。

XPageの画面に、ボタンコントロールを配置して、それぞれSSJSとCSJSを記述しました。
また、「ssjsDate1」「csjsDate1」という計算結果コントロールを埋め込んでます。


SSJSのソース
var sdate = "2016/08/10";
var stime = "10:00:00";
var sdt1  = new Date( sdate + " " + stime ).toISOString();
getComponent( "ssjsDate1" ).setValue( sdt1 );


CSJSのソース
var sdate = "2016/08/10";
var stime = "10:00:00";
var sdt1  = new Date( sdate + " " + stime ).toISOString();
document.getElementById( "#{id:csjsDate1}" ).innerHTML = sdt1;


実行した結果がこちら・・・
toISOStringの実行結果

CSJSの方は、思惑通りに表示されましたが、SSJSの方は違う形で表示されています。
はい、私がプログラムに組み込んだのはSSJSの方でした。
こりゃー、動かないよね。

なんでよ!なんでだよ!どういうことだよ!
と一人で勝手に怒っていましたが、おちついてヘルプを読むことにしました。
すると、Domino Designerヘルプには
「国際標準化機構 (ISO) 規格 8601 では、年、月、日、時、分、秒の順序を規定しています。 http://www.iso.org/iso/catalogue_detail?csnumber=40874 を参照してください。」
という一文があるじゃないですか。

年月日時分秒を順序を規定???
あー、確かに順序は決まってますねー。
って、そういうもんなの???


ということで今回は結論が出ないままです。
誰か、XPagesのSSJSで日付を
「拡張形式: yyyy-mm-ddThh:MM:ssZ」
の形式に出力する方法を教えてください(今のところ、年月日時分秒を分解して文字列連結するくらいしか思いつかない・・・)


では今日はこの辺で(笑)



Notes/Dominoで困ったことがあれば、弊社にお問い合わせください。
IBM Championの私が承ります!
お問い合わせはこちらから→Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ