CodeIQ MAGAZINECodeIQ MAGAZINE

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

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

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

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

今回作るもの

こんにちは、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のアカウントを作成してプログラムと連携してみます。

それではまた。

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/

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

■関連記事

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

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