IBM Bluemixを使って

Twitter上の評判検索

アプリケーションを作る

ibm.biz/bluemix-i4tw

IBM Insights for Twitter デモサイト

https://cdetestapp.mybluemix.net/ 2

“IBM” で検索

“IBM” を含むツイートが検索される。

3

“IBM sentiment:positive” で検索

“IBM” を含むツイートで、内容がポジティブなものだけが検索される。

4

IBM Insights for Twitter の情報

https://www.ng.bluemix.net/docs/services/Twitter/index.html5

API リファレンス情報

https://cdeservice.mybluemix.net/rest-api/#!/ibm_twitter_insights

このページは常に開けるようにしておく。

6

これから作成するアプリ

検索対象文字列をパラメータ q で指定。指定文字列の感情毎の検索結果件数を表形式で出力する。

7

検索対象文字列を指定すると、その感情ごとの割合をドーナツチャートで表示する。

8

これから作成するアプリ （発展）

Bluemix にログイン

ログイン後のダッシュボード画面で「アプリの作成」をクリック

9

WEB アプリを選択

アプリの種類は「WEB」を選択10

PHP ランタイムを選択

ランタイムの種類は「PHP」を選択。※実際はどのランタイムでも作れるが、本資料では PHP で作成する

11

続行

PHP ランタイムの説明を確認して「続行」。12

アプリケーションの名前を指定

PHP ランタイムアプリケーションの名前を指定して入力して「完了」。ホスト名の一部になるので、他の人と重ならない名前にする。

（例） PHPAppYYYYMMDD（日付）

13

ステージング処理待ち

PHP ランタイムの作成はこれで終わり。ステージング処理が完了するまで待つ。この画面では、この後にどうやって PHP アプリをランタイムに反映させるか、の方法が紹介されている。 14

ステージング処理完了

ステージング処理完了（もうアプリケーションサーバーとして利用可能）。

リンクをクリックすると作成したサーバー上でスターターコードが実行されます。

一度ダッシュボードに戻る。 15

ダッシュボード画面

ダッシュボード画面に今作った PHP ランタイムが追加されていることを確認。このアイコンをクリック。

16

作成した PHP ランタイムの概要

作成して稼働中の PHP ランタイムに Twitter 連携サービスを追加するので、「サービスまたは API の追加」をクリック。

17

Insights for Twitter を選択

IBM Bluemixのサービス一覧が表示される。画面左で「データおよび分析」を選択して、「Insights for Twitter」をクリック。

18

Insights for Twitter の追加

Insights for Twitter サービスの内容が表示される。画面右のアプリに作成した PHP ランタイムが選択されていることを確認し、サービス名、プランはデフォルトのままで「作成」をクリック。 19

再ステージングの実行

構成が変わったため、再ステージングする必要がある。

確認ダイアログボックスが表示されるので「再ステージ」を選択。

20

再ステージング完了

再ステージングが完了し、シグナルが緑色になったことを確認。

右のメニューから「概要」をクリックする。

21

Insights for Twitter の確認

画面を下にスクロールすると、”Insights for Twitter” サービスのアイコンが追加されていることが確認できる。

その中の「資格情報の表示」をクリック。

22

資格情報の確認

”Insights for Twitter” サービスを利用するための情報が JSON フォーマットで表示される。この内容をテキストファイルにコピーしておく。

23

資格情報の内容

24

{"twitterinsights": [

{"name": "Insights for Twitter-tr","label": "twitterinsights","plan": "Free","credentials": {

"port": "433","username": "5bb107c76f9ca7c9049583ebff7e5815","host": "cdeservice.mybluemix.net","password": "q7wy60fEPF","url": "https://5bb107c76f9ca7c9049583ebff7e5815:q7wy60fEPF@cdeservice.mybluemix.net"

}}

]} “credentials” 内の “url”に Insights for Twitter の API を使うためのユーザー名＆パスワード付き URL がある。この内容はランタイムの VCAP_SERVICES という環境変数の値として取得可。

試しにブラウザで実行してみる

先ほど確認した “url” 値の最後に “/api/v1/messages/count?q=IBM” を付けて、ウェブブラウザでアクセスすると、”IBM” で検索した時の実行結果が表示される。

count 関数を実行しているので、結果のツイート数が “results” 値として得られる。

“count” 部分を “search” にすると、ツイート内容も含めた検索結果が得られる。

25

ポジティブな内容だけをカウントする

先ほど確認した “url” 値の最後に “/api/v1/messages/count?q=IBM%20sentiment%3apositive” を付けて、ウェブブラウザでアクセスすると、”IBM sentiment:potisive” で検索した時の実行結果（ポジティブな内容のツイート数）が表示される。

“positive” の部分を “negative” に変えると、ネガティブなツイート数が検索できる。“neutral” に変えると、中間感情的なツイート数が検索できる。“ambivalent” に変えると、混合感情的なツイート数が検索できる。

26

count API の実行結果(JSON){"related":{"search":{"href":”https://cdeservice.mybluemix.net/api/v1/messages/search?q=IBM+sentiment%3Apositive”

}},"search":{"results":12978

}}

27

アプリの実装内容

(1) パラメータを受け取る。（例 IBM）

(2) 受け取ったパラメータに “positive”, “neutral”, “ambivalent”, “negative” の各感情要素を付けて、Insights for Twitter の count 関数を（４回）実行する。（例 “q=IBM%20sentiment%3apositive”, “q=IBM%20sentiment%3aneutral”, … ）

(3) 各結果のツイート数をそれぞれ取得して、結果画面に反映させる。

28

ソースコードの開発／デプロイ

• 選択肢は３つ

1. Eclipse 環境で開発し、Eclipse プラグインを使ってデプロイ

2. テキストエディターで開発し、cfツールを使ってデプロイ

3. IDS(IBM Bluemix DevOps Services) を使って Gitリポジトリを作り、リポジトリのコードを編集した後に

ビルド＆デプロイ

今回今回今回今回はははは エディターエディターエディターエディター / cf ツールツールツールツールをををを使った方使った方使った方使った方法法法法を紹を紹を紹を紹介しま介しま介しま介しますすすす

29

cfツールのセットアップ

右メニューの「コーディングの開始」をクリックして、画面を下にスクロールし、

「CFコマンド・ライン・インターフェースのダウンロード」のリンクをクリックする。

30

GitHubのCloud Foundryのページが表示される。OS環境に合った「CFコマンド・ライン・インターフェース」をダウンロードする。インストーラーを実行して導入する。

31

cfツールのセットアップ

cfツールのセットアップ

32

コマンド・プロンプト（ターミナル）を立ち上げ、”cf –v”と実行する。Cloud Foundry CLIのバージョンが表示されればセットアップ完了。

ソースコードのダウンロード

PHP ランタイム用のスターター・コードを編集するため、いったんローカルPCにダウンロードする。 「スターター・コードのダウンロード」をクリック。

33

ソースコードの解凍

ローカルPCの任意の作業用ディレクトリに、ダウンロードしたzipファイルを展開する。

解凍すると、Bluemix上で作成したPHPのアプリケーション名のディレクトリが作成され、それ以下にソースコードが展開される。

34

ファイルを追加する

PHPのプログラムファイルを追加する。

zipファイルを展開して作られたアプリケーション名のディレクトリの直下に“insights4twitter.php”という名前のファイルを新規作成で追加する。

エディターでこのファイルを開き、次ページのコードを入力する。

35

このファイルを追加するこのファイルを追加するこのファイルを追加するこのファイルを追加する

insights4twitter.php の内容<html><head><title>Insights for Twitter in PHP</title></head><body><?php$apiurl = '';$vcap = getenv( 'VCAP_SERVICES' );if( $vcap ){$bluemixenv = json_decode( $vcap );$apiurl = $bluemixenv->twitterinsights[0]->credentials->url;

}if( isset( $_GET['q'] ) ){$q = $_GET['q'];if( $q ){

?><h1><?php echo( $q ); ?></h1><table border='1'><?php

$iturl = $apiurl . '/api/v1/messages/count?q=' . $q . '%20sentiment%3a';

$sentiments = array( 'positive', 'neutral', 'ambivalent', 'negative' );

foreach( $sentiments as $sentiment ){$url = $iturl . $sentiment;$text = file_get_contents( $url );$json = json_decode( $text );$results = $json->search->results;

?><tr><td><?php echo( $sentiment ); ?></td><td><?php echo( $results ); ?></td></tr><?php

}?></table><?php}

}?>

</body></html>

環境変数取得環境変数取得環境変数取得環境変数取得

パラメータパラメータパラメータパラメータ q ががががある場合のみ実行ある場合のみ実行ある場合のみ実行ある場合のみ実行

４つの４つの４つの４つの sentiment

各各各各 sentimentごとに件数を取得ごとに件数を取得ごとに件数を取得ごとに件数を取得

各結果を表形式で各結果を表形式で各結果を表形式で各結果を表形式で

出力出力出力出力

コードをBluemixにデプロイ

37

コマンド・プロンプト（ターミナル）で Bluemixにログインする。

追加（変更）したコードをBluemixにデプロイする。

コマンド・プロンプト（ターミナル）で作成した“insights4twitter.php”のあるディレクトリに移動し、”cf push”コマンドを実行する。

C:¥Bluemix＞cf login –a https://api.ng.bluemix.net –u (IBM ID) –p (パスワード)

C:¥Bluemix＞cd PHPApp20150924

C:¥Bluemix¥PHPApp20150924＞cf push

変更したコードをBluemixに push

38

Bluemixへのデプロイが実行されるのでしばらく待機。

上のような表示で終了すればデプロイ成功。

動作確認

ウェブブラウザで

http://（アプリ名）.mybluemix.net/insights4twitter.php?q=IBMにアクセスして、期待通りに表が出力される結果になることを確認する。

“IBM” の部分を別の文字列にしても動くことを確認する。

39

ドーナツチャートで表示する場合

Google Visualization API を使用：

https://developers.google.com/chart/interactive/docs/gallery/piechart

jQuery を使用：

https://jquery.com/

40

insights4twitter2.php の内容<html><head><title>Insights for Twitter in PHP</title><script src="//www.google.com/jsapi"></script><script src="//code.jquery.com/jquery-2.0.3.min.js"></script><script type="text/javascript">google.load("visualization", "1", {packages:["corechart"]});$(function(){var data = google.visualization.arrayToDataTable([[ 'Sentiment', '#' ]

<?php$apiurl = '';$vcap = getenv( 'VCAP_SERVICES' );if( $vcap ){$bluemixenv = json_decode( $vcap );$apiurl = $bluemixenv->twitterinsights[0]->credentials->url;

}if( isset( $_GET['q'] ) ){$q = $_GET['q'];if( $q ){$iturl = $apiurl . '/api/v1/messages/count?q=' . $q .

'%20sentiment%3a';

$sentiments = array( 'positive', 'neutral', 'ambivalent', 'negative' );foreach( $sentiments as $sentiment ){$url = $iturl . $sentiment;$text = file_get_contents( $url );$json = json_decode( $text );$results = $json->search->results;

?>,[ '<?php echo( $sentiment ); ?>', <?php echo( $results ); ?> ]

<?php } } } ?>]);var options = { title: '<?php echo( $q ); ?>', piHole: 0.4 };var chart = new google.visualization.PieChart( document.getElementById('donutchart') );chart.draw( data, options );

});</script></head><body><h1><?php echo( $q ); ?></h1><div id='donutchart' style='width:100%; height:90%;'></div></body></html>

動作確認

insights4twitter2.php を前頁の内容で作成してコミット＆プッシュ＆デプロイ。

ウェブブラウザで

http://（アプリ名）.mybluemix.net/insights4twitter2.php?q=IBMにアクセスして、ドーナツチャートが表示されることを確認する。

“IBM” の部分を別の文字列にしても動くことを確認する。 42