Azure Web AppsとNode.jsで作る電車運行状況通知──LINE Bot(2) / アプリケーション作成

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

今回作るもの

こんにちは、dotstudio株式会社のびすけです。今回はAzure Web Appsを使って電車運行状況を知らせてくれるLINE Botを作ってみたいと思います。

先に完成イメージのLINE Botを紹介します。
このような感じで登録した電車の遅延情報があればLINE Botが教えてくれます。

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

  • Azure Web Appsの設定
  • アプリケーション作成
  • LINEとプログラムの連携を試す
  • LINE Botをデプロイする

の四部構成で紹介します。

第二回の今回はアプリケーション作成部分を紹介します。

Azure Web Appsの設定とソースコードのデプロイ方法については前回の記事をご覧ください。

Node.jsとは

通常JavaScriptはブラウザで動作する言語ですが、Node.jsはサーバサイドで動作するJavaScriptです。

クライアントもサーバサイドもJavaScriptで書けるという利点はもちろん、Node.jsは「ノンブロッキングI/O」と「イベントループ」という2つのモデルを採用して実現した軽量さと効率の良さが注目されています。

JavaScriptが採用している「シングルスレッド」は時間のかかる処理があると他の処理に待ち時間(ブロック)が発生し全体の実行速度が遅くなってしまう問題がありました。

「ノンブロッキングI/O」では非同期処理によって各処理を別々に行ってくれるので、大量の処理を効率的に実行することができます。

またNode.jsではリクエストやコールバックをイベントとして扱います。処理の重いイベントが発生しても、前述のノンブロッキングI/Oで並行処理されるため他の処理をブロックせずに実行されます。

このような大量アクセスに対応可能な処理の仕組みとリアルタイム通信の実現性から、様々なソーシャルゲームやチャットなどで採用されています。

プロジェクトを作成する

本記事ではNode.jsがインストールされていることを前提に進めます。インストールがまだの方は下記記事などを参考に準備をして下さい。

nvm編:いまアツいJavaScript!ゼロから始めるNode.js入門~5分で環境構築編~
nodebrew編:僕がMacを買い換えてすぐにいれるツール&すぐにする初期設定【2016年9月版】

筆者の環境は以下です。

  • Node.js v7.10.0
  • npm 5.0.0
  • OS X El Capitan 10.11.6

Node.jsやnpmのバージョンが古いと期待通り動かないことがあるので最新版にすることを推奨します。

Node.jsのプロジェクトはpackage.jsonがあるディレクトリが起点となります。

プロジェクトディレクトリを作成し、その下にnpm init --yesコマンドでpackage.jsonを作成しましょう。

$ mkdir linebot-sample
$ cd linebot-sample/
$ npm init --yes

実行すると下記のメッセージとともにpackage.jsonが作成されます。

{
  "name": "linebot-sample",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

次にプログラムのメインとなるserver.jsを作成します。

$ touch server.js

ディレクトリ内にserver.jspackage.jsonの二つのファイルがあることを確認しましょう。

$ ls
server.js        package.json

エディタでserver.jsを編集します。以下をコピー&ペーストしましょう。

server.js
'use strict';

const http = require('http');
const PORT = 3000;

http.createServer((req, res) => {
    res.writeHead(200, {'Content-Type': 'text/plain;charset=utf-8'});
    res.end('こんにちは');
}).listen(PORT);

console.log(`Server running at ${PORT}`);

アプリケーションを起動してみます。

$ node server.js

起動すると以下がターミナルに表示されます。

Server running at 3000

http://localhost:3000/ にブラウザでアクセスして「こんにちは」と表示されることを確認しましょう。

Twitterと連携する

電車の遅延情報を取得するやり方はいろいろありますが、今回はこちらのTwitterBotから情報取得するBotを作ります。

このアカウントは#TrainDelayというハッシュタグをつけて投稿しています。この情報を取得しましょう。

まずは、Twitterを利用するためのnpmモジュールを追加します。

$ npm i --save twitter

次にTwitterの開発者画面からアクセストークンを取得します。

https://apps.twitter.com/

下記のエラーが出た場合はアカウントに電話番号認証を追加しましょう。

Error
You must add your mobile phone to your Twitter profile before creating an application. Please read https://support.twitter.com/articles/110250-adding-your-mobile-number-to-your-account-via-web for more information.

作成できたらPermissionsのタブから権限を変更します。

Read, Write and Access direct messagesに変更し、ページ下部の「Update Settings」をクリックして保存します。

続いてKeys and Access Tokensのタブから以下の4つのキーを取得します。

アプリケーションのキー

  • Consumer Key (API Key)
  • Consumer Secret (API Secret)

アプリケーションに登録するユーザーのキー

  • Access Token
  • Access Token Secret

Application Settingsの項目にConsumer KeyConsumer Secretが記載されています。

続いてYour Access Tokenの項目の「Create my access token」をクリックしましょう。

Access TokenAccess Token Secretが生成されました。

取得したキーを使ってNode.jsでツイートを取得していきます。

ツイートを取得してみる

試しにツイートを取得できるコードを書いてみます。tweet.jsというファイルを作成して編集しましょう。

$ touch tweet.js
tweet.js
'use strict';

const Twitter = require('twitter');
const tw = new Twitter({
  consumer_key: '', // Consumer Key
  consumer_secret: '', // Consumer Secret
  access_token_key: '', // Access Token
  access_token_secret: '' // Access Token Secret
});
const TARGET_HASHTAG = '#TrainDelay';

tw.stream('statuses/filter', {'track': TARGET_HASHTAG}, (stream) => {
  stream.on('data', (data) => {
    console.log(data.text);
  });
});

先ほど取得した4つのキーとトークンを記入したら実行してみましょう。

$ node tweet.js

#TrainDelayにツイートがあるとターミナルに表示されていきます。

取得するハッシュタグはTARGET_HASHTAG = ''の部分で変更できます。

必要な情報を抜き出す

ハッシュタグ上のツイートから、取得したい路線に関する情報を抜き出しましょう。

今回使うTwitter Botの呟きから、自分の取得したい路線の文字列を確認します。

今回は「上野東京ライン」について取得してみます。

tweet.jsを以下のように変更します。

tweet.js
'use strict';

const Twitter = require('twitter');
const tw = new Twitter({
// 4つのキーを指定
  consumer_key: '',
  consumer_secret: '',
  access_token_key: '',
  access_token_secret: ''
});
const TARGET_HASHTAG = '#TrainDelay';

tw.stream('statuses/filter', {'track': TARGET_HASHTAG}, (stream) => {
  stream.on('data', (data) => {
    if (data.text.indexOf("上野東京ライン") !== -1) {
      console.log(data.text);
    }
  });
});

先ほどと同様にTwitterから取得した4つのキーを記入します。

これで指定した路線の運行情報だけを取得するコードが完成しました。

まとめ

いかがでしたでしょうか。

今回はアプリケーションのメイン部分となるTwitterハッシュタグ情報を取得する部分をNode.jsで作成しました。

Node.jsにはTwitterを利用するためのnpmモジュールがあるため簡単にツイートを取得することができます。

次回は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/

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

PC_goodpoint_banner2

Pagetop