Azure Web AppsとNode.jsで作る電車運行状況通知──LINE Bot(1) / WebAppsの設定

AWSやAzureを始めたとしたクラウドサービス全般を触っていく連載「クラウドサービス研究スタジオ」。この連載では、IaaS,PaaS,BaaS,SaaSなど幅広い形態のサービスを実際に使ってレポートしていきます!

今回作るもの

こんにちは、dotstudio株式会社のびすけです。

初回は3本くらいかけて、Azure Web Appsを使って電車運行状況を知らせてくれるLINE Botを作ってみたいと思います。

優勝賞金1000万円のアワードもあるので、読者のみなさんもBotアプリケーションを作って賞金を狙いにいきましょう。

先に完成イメージのLINE Botを紹介します。

このような感じで登録した電車の遅延情報があればLINE Botが教えてくれます。

BotプログラムはNode.jsで作成し、Azure Web Appsにホスティングして運用します。

  • Azure Web Appsの設定
  • アプリケーション作成部分
  • LINEとのつなぎこみ

の三構成で考えています。

今回はWeb Appsの設定をメインで紹介します。

8,568通り、あなたはどのタイプ?

Azure Web Appsとは

Web Apps」はAzureが提供するPaaSです。昔はAzure Websitesと呼ばれていました。

Web Appsではインフラ側の設定を自分でやらなくても、サーバーサイドプログラムを動作させることができます。デプロイや自動スケールの設定などもできるため、Web制作で必要になる機能の大半をカバーできます。

Web AppsではNode.jsアプリケーションにも対応していて、Node.jsプログラムをWeb Appsに載せるだけで動作してくれます。

今までのWeb Appsは内部的にWindowsサーバーだったのですが、最近のアップデートでLinux版も使えるようになりました。

8,568通り、あなたはどのタイプ?

Web Appsでアプリケーションを作成してみる

実際にWeb Appsでアプリケーションを作ってみましょう。Linux版(App Service on Linux)で進めます。

  • まずは新規を選択します

  • 検索フォームでWeb Appで検索します

  • Web App On Linux(プレビュー)を選択します

今回は最近出たLinuxイメージを使ってみましょう。

  • 作成を選択します

これでアプリケーションが作成準備ができます。

アプリケーションの情報を入力する

アプリケーションの情報を決めていきます。
App Sirvice プラン/場所サブスクリプションは特に変更なしで大丈夫です。

  • アプリ名リソースグループの入力をします。

アプリケーション名に任意の名前を入力しましょう。これがそのままドメインになります。

リソースグループも新規で作成する場合はリソースグループ名も入力します。

  • コンテナーの構成を選択します

デフォルトでNode.jsのコンテナーを選択できます。

  • 作成でアプリケーションを作成します

最後にバージョンを決めたら作成からアプリケーション作成をしましょう。
今回は用意されていたNode.js 6.6.0のランタイムを選択しました。

これでアプリケーションが立ち上がります

しばらく待つとWeb Appsのサービス一覧に今作成したアプリ名が表示され、アプリケーションが作成されたことが分かります。

補足: Docker Hubから任意イメージも利用できる

補足説明なのでスキップしても大丈夫です。App Service on LinuxではビルトインランタイムでPHPやNode.jsがあったのですが、DockerHub経由でGoやその他言語のコンテナも利用可能です。

例えばGoのコンテナを利用する場合、公式のGoイメージとタグ一覧が載っているこちらを参照して名前を指定すれば利用することが可能です。

1.7.4をいれる場合は以下のように指定します。

ちなみにビルトインのイメージとバージョンは以下になります。(2016年12月時点)

Node.jsが使えるのは個人的にすごくうれしいポイントです。

実際のソースコードのデプロイ方法

それではWeb Appsのアプリケーション作成が出来たので、実際にソースコードをデプロイしてみましょう。

Linux版の場合プレビューということもあり、現時点でのデプロイ方法はローカルGitリポジトリGitHubのみ選択可能です。

  • ソースの選択からGitHubを選択します。

  • プロジェクトの選択からリポジトリを選択します。

試しにこちらのハローワールドプロジェクトをデプロイしてみます。
試す場合はフォークして利用してみて下さい。

このハローワールドプロジェクトの中身はメインとなるserver.jsと起動スクリプトを指定しているprocess.jsonになります。

【server.js】
'use strict'

const HTTP = require('http');
const PORT = process.env.PORT || 3001;

HTTP.createServer((req, res) => {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello Node.js!!!!!!\n');
}).listen(PORT);
【process.json】
 {
      "name"        : "worker",
      "script"      : "./server.js",
      "instances"   : 1,
      "merge_logs"  : true,
      "log_date_format" : "YYYY-MM-DD HH:mm Z",
      "watch": ["./server.js"],
      "watch_options": {
        "followSymlinks": true,
        "usePolling"   : true,
        "interval"    : 5
      }
 }

App Service on LinuxではPM2を使ってるらしくPM2で利用するprocess.jsonを指定する必要があるようです。

OKで連携します。

これでWeb AppsとGitHubが連携されます。GitHubに更新をプッシュするたびにWeb Apps側にデプロイされるようになります。

  • スタートアップファイルを指定します。

設定>Dockerコンテナー>スタートアップファイルの項目にprocess.jsonを指定しましょう。

  • デプロイのテスト

設定が終わったらGitHubにプッシュしてみましょう。
デプロイオプションの項目を確認するとプログレス表示に変わります。

少し待つと緑色のチェックマークになります。

これでデプロイが完了です。

確認してみる

自分のAzureのサーバーアドレスにブラウザからアクセスしてみましょう。

こんな感じでHello Node.jsと文字が出てればOKです。

まとめ

いかがでしたでしょうか。
今回はBotアプリケーションを作成する際の基盤となるアプリケーションのサーバー部分をWeb Apps(App Service on Linux)で作成しました。

LINE BotだとSSL対応しているURLを用意する必要がありますが、Web Appsだと最初からSSL対応してくれているので、このままアプリケーションを作っていくことができます。

次回はBotのメインとなるプログラムを書いていきたいと思います。

それではまた。

のびすけ

dotstudio株式会社 代表取締役CEO。1989年生まれ。岩手県立大学在籍時にITベンチャー企業の役員を務める。同大学院を卒業後、株式会社LIGにWebエンジニアとして入社し、Web制作に携わる。 2016年7月よりdotstudio株式会社を立ち上げ、IoT領域を中心に活動している。日本最大規模のIoTコミュニティであるIoTLTや、JavaScript RoboticsコミュニティNodeBotsの主催、IoTバックエンドサービスであるMilkcocoaのエバンジェリストとしても活動中。
Twitter: @n0bisuke
dotstudio, inc.: https://dotstud.io/

※本記事は「CodeIQ MAGAZINE」掲載の記事を転載しております。

PC_goodpoint_banner2

Pagetop