まだプログラマーですが何か?

プログラマーネタ中心。たまに作成したウェブサービス関連の話も https://twitter.com/dotnsf

モデル定義だけで OpenAPI 対応の REST API を生成してくれる StrongLoop LoopBackIBM DB2 に対応していたので使ってみました。

基本的な考え方や手順は以前にこちらで紹介した MySQL 対応での手順と同様ですが、以下ではデータソースをDB2 とした場合の手順を紹介します:
StrongLoop アプリで MySQL を使う


まずは DB2 サーバーを用意します。自前で用意できる場合はその環境を使っていただいても構いませんが、IBM Bluemix ユーザーであれば SQL Database 等、DB2 サーバーのインスタンスを使っていただいても構いません。

では次のような DB2 サーバー環境が用意できているものとします:
ホスト名XX.XX.XX.XX
ポート番号50000
データベース名SQLDB
ユーザー名db2_username
パスワードdb2_password


この DB2 インスタンスに REST API で読み書きするモデルのテーブルを作成します。上記の MySQL での例と同様の item テーブルを用意します。ここで1点注意があります。DB2 の CREATE TABLE 文は普通に実行するとテーブル名や列名を全て大文字で作成します。普通に利用する際には大文字小文字を区別することなく利用できるのですが、LoopBack 環境では全て小文字で定義されている前提で API が発行されます。つまりデフォルトの大文字のままでテーブルを定義すると後で「テーブルが見つからない」といったエラーが発生してしまいます。それを避ける目的で create table 内のテーブル名や列名の部分は全てダブルクォーテーションで括り、明示的に小文字で作成する必要があります。この点に注意して作成してください:
> create table "item"("id" int primary key generated always as identity (start with 1 increment by 1),"name" varchar(50) not null,"code" varchar(50) not null,"price" int);

これで DB2 側の準備はできました。ではこの item テーブルのデータを読み書きする API を LoopBack で用意しましょう。以下 CentOS 環境を前提に紹介します。

まず、StrongLoop や LoopBack は npm を通じて提供され、Node.js 上で動きます。というわけで Node.js と npm を導入する必要があります:
# yum install epel-release
# yum install nodejs npm --enablerepo=epel

次に npm を使って LoopBack と StrongLoop を導入します:
# npm install -g loopback
# npm install -g strongloop

StrongLoop / LoopBack が導入できたら、これらを使って API を作成します。まずは作業用のディレクトリ(下の例では ~/tmp)を作って、そこに移動しておきます:
# cd
# mkdir tmp
# cd tmp

このディレクトリに LoopBack のアプリケーション環境を作成します。ここではアプリケーション名を db2app と指定しています:
# slc loopback db2app

アプリケーション名と、アプリケーションディレクトリを聞かれますが、いずれもデフォルトの db2app をそのまま指定します。またアプリケーションの種類を聞かれますが、これもデフォルトのまま api-server を選択します:
2016031401


すると db2app アプリケーションの基本部分のインストールが開始され、しばらく待つとこのような画面になり、導入が完了します(この時点で db2app ディレクトリが作られているはずです):
2016031402


上図の最後の部分にこの後の手順が記載されています。が、LoopBack の標準 DB ではなく、他の外部 DB を利用する場合の手順は少し異なります。まずはアプリケーションディレクトリに移動しておきます:
# cd db2app

次にこのプロジェクトのデータソースが DB2 になるようカスタマイズします。まずは DB2 コネクタをインストールします。このコマンドで DB2 ODBC CLI ドライバなどもダウンロード&インストールされます:
# npm install --save loopback-connector-db2

DB2 コネクタがインストールできたら、このコネクタを使ってデータソースを定義します。カスタムデータソースの名称は "mydb" としています:
# slc loopback:datasource mydb

そしてデータソース名はデフォルトのまま mydb を選択します。次のコネクターの選択肢において "IBM DB2" を選択します(ここが今回、新たに DB2 対応した機能です):
2016031403


続けて DB2 サーバーへの接続情報を指定します。上記表の内容通りにホスト名、ポート番号、ユーザー名、パスワード、そしてデータベース名を入力します:
2016031404


ちなみにここでの作業の内容は server/datasource.json ファイルに記載されます。直接編集する場合は同ファイルをテキストエディタで編集してください。


データソースの定義ができたら最後に item モデルを生成します:
# slc loopback:model item

モデル名はデフォルトのまま item を指定します。次にデータソースを聞かれるので上記で作成した mydb を指定します(これでデータソースは DB2 になります)。以下はこれまでと同様でベースクラスには PersistedModel、REST API 公開は Yes、カスタム plural form はなし(そのままリターン)、そして common モデルを指定します:
2016031405


そして各列の定義では上記表のように name 列は string 型で必須(Yes)、code 列も string 型で必須(Yes)、price 列は number 型で必須ではない(No)をそれぞれ指定します:
2016031406


最後に Property name を聞かれた所でそのまま Enter を入力して、列のカスタマイズを完了します。これでモデルの定義も完了しました。


モデルが出来たので、LoopBack で API が稼働し公開されるはずです。実際の動作を確かめてみましょう:
# node .

すると画面には API Explorer にアクセスするための URL (最後が /explorer になっている方)が表示されます:
2016031407


ウェブブラウザでこのページにアクセスすると、db2app アプリケーションと、その中に item モデルを読み書きする一連の API が生成されていることが確認できます:
2016031408


後はここで紹介したような方法で実際の API を実行して、この画面から動作確認することが可能です:
2016031409


ここでデータレコードを作成した場合、当然 DB2 サーバー内に格納されます。DB2 側のデータを参照して同じデータが保存されていることを確認できます:
2016031410


これまで LoopBack は Oracle や SQL Server には対応していましたが、ようやく "StrongLoop An IBM Company" っぽい連携ができるようになりました(笑)。
2016031411


特定の技術カテゴリの文書(特に日本語文書)をまとめて探したい場合、いくつかの方法が考えられます。ただ最近は Qiita が人気で、ここからタグを使って
  https://qiita.com/tags/(技術タグ名) 
にアクセスする、といった方法が考えられます。

例えば Qiita 内の "Bluemix" の日本語技術文書を探すのであれば、
  https://qiita.com/tags/bluemix
といった具合です:
2016030701


さて、これらの文書をまとめて(API 的に)取得したい、となった場合はどうしましょう? よくある方法としては RSS で取得する、という方法が考えられますが、では Qiita のタグ一覧ページを RSS で取得するにはどうすればいいのでしょうか? これが今日のお題です。

答は簡単で、URL の最後に /feed.atom を付けるだけです:
  https://qiita.com/tags/(技術タグ名)/feed.atom

"Bluemix" 記事を対象にするのであれば、こんな感じになります:
  http://qiita.com/tags/bluemix/feed.atom

2016030702


Qiita の記事をタグを指定して RSS リーダーで読む、といった場合でも使えるワザだと思いますが、記述文書を API 的に収集する、という用途でも便利な方法だと思いました。

 

JavaScript(HTML5) の機能だけで、PC に付属したマイクから音声を入力(つまり PC の前で喋った音声データを取り込む)してみました。なお、この機能を使うには UserMedia に対応したブラウザが必要です。以下のコードは Windows 版の FireFox で動作確認をしています。

サンプルのコードはこんな感じになります:
<html>
<head>
<title>HTML5 Audio</title>
<script type="text/javascript"> 
//. ブラウザによる差異を吸収
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
window.AudioContext = window.AudioContext || window.webkitAudioContext || window.mozAudioContext || window.msAudioContext;
 
//. バッファサイズ等
var audioContext = new AudioContext();
var bufferSize = 4096;
var cnt = 0;
 
//. 音声処理
function onAudioProcess( e ){
  //. 取得した音声データ
  var input = e.inputBuffer.getChannelData(0);

//. ↑この input に音声データが入っているので、これをストリーミングなどで処理すればよい。
//. 以下は実際にデータが入っていることを確認するためのサンプル処理
//. 音声データの最大・最小値を求める var mx = 0, mn = 0; for( var i = 0; i < bufferSize; i ++ ){ if( mx < input[i] ){ mx = input[i]; } if( mn > input[i] ){ mn = input[i]; } } //. 一度に取得した音声データの最大・最小値を求める(特に意味は無いが、データが取得できている確認) cnt ++; console.log( "[" + cnt + "] min = " + mn + ", max = " + mx ); } //. 音声処理開始 function initialize(){ navigator.getUserMedia( { audio: true }, function( stream ){ //. 音声処理 var javascriptnode = audioContext.createScriptProcessor( bufferSize, 1, 1 ); var mediastreamsource = audioContext.createMediaStreamSource( stream ); window.dotnsf_hack_for_mozzila = mediastreamsource; //. https://support.mozilla.org/en-US/questions/984179 mediastreamsource.connect( javascriptnode ); javascriptnode.onaudioprocess = onAudioProcess; javascriptnode.connect( audioContext.destination ); },function( e ){ console.log( e ); } ); } </script> </head> <body onload="initialize()"> </body> </html>

余談ですが、上記コードの赤字部分は今回一番迷った所。どうも FireFox のバグらしく、取得したメディアストリームがいつの間にか消えて(音声入力処理が止まって)しまう、という現象に遭遇しました。そのバグを回避するため、無理やり取得した値をグローバル変数化して消えないようにしています。バグの詳細についてはこちら:
https://support.mozilla.org/en-US/questions/984179


この HTML をマイク入力を ON にした状態で対象ブラウザで開くと、「PC のマイクをこのアプリと共有しますか?」という確認メッセージが表示されます。ここで「共有」を選択してください:
2016030301

共有すると画面に FireFox がマイクを利用中であること(知らないうちに音声を取得しているわけではないこと)を知らせるマークが表示されます。このマークが出ている間は PC のマイクで拾った音声をこのウェブページで共有していることを表しています:
2016030302


ここで F12 キーを押すとデバッグ画面が表示され、コンソールタブを見ると取得した音声データ1まとまり(4Kbyte)単位での最大値と最小値(簡単にいうと音の大きさ)を表示し続ける、というアプリになっています。
2016030303


実際には取得した音声データを保存(録音)して再生できるようにするとか、ストリーミングで処理してテキスト化するとか、・・・ という使い方になると思いますが、その入力を HTML で行う方法の紹介でした。

このページのトップヘ