プリザンターをAzure WebApp + SQLに導入する(2017年1月版)

先日、登壇したMETRO Plusで知り合い、昨日はITC-Neo研究会に登壇してもらった内田さんが開発されているオープンソースのノンプログラミングWebシステム開発ツール「プリザンター」をAzure環境に導入してみました。

プリザンターにはGitHub上に充実したインストールガイドがあるので、Azure WebApp環境に詳しい方は簡単に導入することができると思うのですが、私はそうでもない(クラウドはAWSかBluemixが多い)ので、ちょっと戸惑いました。でも、無事、導入することができました。

Azure環境への導入にはVisual Studioが必要

プリザンターは何もクラウド環境でないと使えないわけではなく、ふつうのWindowsマシンがあれば導入できます。その場合は、セットアッププログラムを順に進めて行くだけで良いのですが、Azure環境の場合はVisual Studioが必要になります。個人などでは無償のVisual Studio Community Editionで構いません。

Visual Studioを導入したら、プリザンターのGitHubからZIPファイルをダウンロードし、展開します。

Implem.Pleasanterというソリューション(sln)ファイルがあるので、それを開きます。Visual Studioからいくつかの警告が出ますが、「いいえ」→「OK」と進めます。(詳しくは公式のインストールガイドを参照してください。)

ソリューションエクスプローラーからRds.jsonを開き、Azure SQL Databaseの接続情報を設定しますが、その前にAzure環境の準備を進めましょう。

Azure WebApp + SQLの設定

Azureへのユーザー登録は済んだものとして話を進めます。

Azureでは様々なサービスを使用することができますが、ここではWeb App + SQLを使用します。

アプリ名とリソースグループ名を適当に入力します。
App Service プラン/場所は、デフォルトではS1プランの米国南部になっていますが、このままではいけません。

新規作成をクリックするとプランの一覧が出てきます。S1プランだと月額4,553円です。ちょっとオーバースペックな気がします。

場所をJapan Eastに変更し、プランの一覧から「すべて表示」をクリックすると、D1 Sharedというプランがでてきます。これはアプリごとの課金になりますが月額986円です。Azure WebAppで稼働させるアプリがプリザンターだけなら、まずはこれで良いでしょう。

次はSQL Databaseです。こちらも「新しいデータベースの作成」で、適当な名前を入力します。

価格レベルはBasicにしました。月額509円なので、WebAppとあわせて月額1,500円くらいで運用できることになります。

サーバー名、サーバー管理者ログイン(ID)、パスワードを入力し、場所は「東日本」を選択しました。WebAppもSQL Databaseもどちらも日本を選んだので、ネットワークレイテンシ的にもセキュリティ的にも、気にする企業にはちょうど良いでしょう。

もう一つ、照合順序の設定もしておきたいと思います。ここでは「Japanese_CI_AS」と入力しました。

ここまで設定できたら、作成ボタンをクリックしてしばらく待ちます。

環境の作成が完了したら、SQLデータベースを表示し、「データベース接続文字列の表示」をクリックします。

データベース接続文字列が表示されるので、ADO.NETのタブの表示内容をコピーしておきます。

Visual Studioに戻り、Rds.jsonを設定します。ProviderをAzure、TimeZoneInfoをUTCとして、あとは4行目から6行目までの3つのConnectionStringに、すべて同じ値(上記ADO.NETタブに表示された接続文字列)を設定すればOKです。

SQLデータベースのファイアウォール設定

この後、Visual StudioからSQLデータベースへのテーブル作成等を行うのですが、このままではSQLデータベースのファイアウォールで通信ができず、失敗してしまいます。

AzureのSQLデータベース画面に戻り、「ファイアウォール設定の表示」をクリック、さらに「+クライアントIP」をクリックすると、いまAzureにアクセスしているPCのIPアドレスが通信許可されます。

SQLデータベースにテーブルを作成

プリザンターの導入ガイドどおり、ソリューションエクスプローラーからImplem.CodeDefinerを右クリックして、スタートアッププロジェクトに設定します。

コマンドライン引数として _rds を入力し、Control+F5を押下すると、コマンドプロンプトが立ち上がり、テーブルの作成が開始されます。

WebAppの公開

次は、ソリューションエクスプローラーからImplem.Pleasanterを右クリックし、公開をクリックして、WebAppを公開します。

Azure SDKのバージョンアップ

ここで、このような公開ダイアログが表示された場合はAzure SDKのバージョンが古く、先ほどAzureで作成したWebAppが選択できません。

Visual Studioの画面からAzure SDKのバージョンアップを行います。

いざ公開!

Azure SDKのバージョンアップを行った後、Visual Studioを再度起動してImplem.Pleasanterを右クリックして公開をクリックすると、このようなダイアログが表示されます。

ここで、Microsoft Azure App Serviceを選択します。

このように、先ほど作成したWebAppが表示されるはずですので、選択してOKをクリックします。

あとは、公開ダイアログを進め、最後に発行ボタンをクリックします。

公開が完了した後、WebAppのURLにアクセスすると、プリザンターのログイン画面が表示されます。

この記事を書いた人

井上 研一

株式会社ビビンコ代表取締役、ITエンジニア/経済産業省推進資格ITコーディネータ。AI・IoTに強いITコーディネータとして活動。2018年、株式会社ビビンコを北九州市に創業。IoTソリューションの開発・導入や、画像認識モデルを活用したアプリの開発などを行っている。近著に「使ってわかった AWSのAI」、「ワトソンで体感する人工知能」。日本全国でセミナー・研修講師としての登壇も多数。