CodeIQ MAGAZINECodeIQ MAGAZINE

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

2016.12.28 Category:【連載】クラウドサービス研究スタジオ Tag: , , ,

  • 43
  • このエントリーをはてなブックマークに追加

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

今回作るもの

こんにちは、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の設定をメインで紹介します。

Azure Web Appsとは

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

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

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

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

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のメインとなるプログラムを書いていきたいと思います。

それではまた。

CodeIQでLINE BOTクイズに挑戦しよう!

LINE BOTの理解度をはかるクイズに挑戦してみませんか?
ITエンジニアのスキルの腕試しができる「CodeIQ」では初心者向けの基礎知識をチェックできるクイズを出題中!
ぜひチャレンジしてみてくださいね♪

CodeIQ運営事務局LINE BOT勉強会からの問題「LINE 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/

  • 43
  • このエントリーをはてなブックマークに追加

■関連記事

1分で完了!?ナウいデプロイツール「now」でNode.jsアプリケーションを爆速デプロイ!... 今回紹介するもの こんにちは、dotstudioのちゃんとくです。 連載第1回はAzure、第2回はBluemixと、比較的知名度の高いサービスを紹介しました。第3回の今回は、コマンドラインから3文字でデプロイできる新感覚のサービス、「now」を紹介したいと思います。 Node.jsで簡単なW...
IBM BluemixとNode.jsでお天気通知! – Facebook Messen... 今回作るもの こんにちは、エンジニアのちゃんとくです。テクニカルライターとしてdotstudioに参加しています。 今回は、2016年に公開された話題のMessenger Platformを使ってFacebook Messenger Botを作りIBM Bluemixにホスティングしてみます。 ...
IBM BluemixとNode.jsでお天気通知! – Facebook Messen... 今回作るもの こんにちは、エンジニアのちゃんとくです。テクニカルライターとしてdotstudioに参加しています。 連載第3回の今回は、2016年に公開された話題のMessenger Platformを使って、Facebook Messenger Botを作りIBM Bluemixにホスティング...
IBM BluemixとNode.jsでお天気通知! – Facebook Messen... 今回作るもの こんにちは、エンジニアのちゃんとくです。テクニカルライターとしてdotstudioに参加しています。 連載第2回の今回は、2016年に公開された話題のMessenger Platformを使ってFacebook Messenger Botを作りIBM Bluemixにホスティングし...
IBM BluemixとNode.jsでお天気通知! – Facebook Messen... 今回作るもの こんにちは、エンジニアのちゃんとくです。テクニカルライターとしてdotstudioに参加しています。 連載第2回の今回は、2016年に公開された話題のMessenger Platformを使ってFacebook Messenger Botを作りIBM Bluemixにホスティングし...
Azure Web AppsとNode.jsで作る電車運行状況通知──LINE Bot(4) / L... 今回作るもの こんにちは、dotstudio株式会社ののびすけです。 今回はAzure Web Appsを使って電車運行状況を知らせてくれるLINE Botを作ってみます。 先に完成イメージのLINE Botを紹介します。 このような感じで登録した電車の遅延情報があればLINE Botが教え...

今週のPickUPレポート

新着記事

週間ランキング

CodeIQとは

CodeIQ(コードアイキュー)とは、自分の実力を知りたいITエンジニア向けの、実務スキル評価サービスです。

CodeIQご利用にあたって
関連サイト
codeiq

リクルートグループサイトへ