JAWS-Festa 2015登壇資料 URL の訂正

JAWS Festa 2015 「Raspberry Pi と AWS でIoT」資料ダウンロード先の訂正

http://jft2015.jaws-ug.jp/speaker/yukihito-kataoka/
JAWS Festa 2015 IoTトラック 「Raspberry Pi と AWS でIoT」資料ダウンロード先のURLが間違っていました。
誠に申し訳けございません。

お詫びと同時に、以下URLに訂正させて頂きます。
http://goo.gl/forms/41oaevDrAA

6.S3静的htmlのJavaScriptでグラフ表示

jPlot

s3の静的サイトにグラフを表示するJavaSciptプログラムを含んだhtmlをアップします。

S3に保管したJSONのデータは、S3の静的サイト内からAJAXで利用できます。
上の画像は html 内の javascript プログラムで以下の処理を行って表示しています。
・JSONの1日のセンサ生データGET
・1分毎のJSONデータを1時間平均に計算
・グラフで表示

グラフには jqPlot を利用しています。

jqPlot
http://www.jqplot.com/

実際のhtml5内の javascript プログラムは以下で確認できます。
https://github.com/yukataoka/IoT_Raspi_AWS_Demo/tree/master/S3WebSite

実際にRaspberry Pi から AWS S3 にアップされたJSONデータのサンプルは以下で確認できます。
https://github.com/yukataoka/IoT_Raspi_AWS_Demo/tree/master/S3WebSite/Hub01

実際の動きは、以下のサイトで確認できます。
http://s.ykata.net/

こちらのjavascriptプログラムの詳細は上記サイトをご参照ください。

最初のページに 戻る

5.センサ値をクラウドに保管・表示

5.1.node.js の設定

参考情報

m_shige1979のささやかな抵抗と欲望の日々(id:m_shige1979さん )
http://m-shige1979.hatenablog.com/entry/2014/06/17/211645

以下の手順で、開発言語 node.js (Javascript) と、Amazon AWS にデータをアップするためのモジュールを設定します。

$ wget http://node-arm.herokuapp.com/node_latest_armhf.deb
$ sudo dpkg -i node_latest_armhf.deb
$ npm install aws-sdk
aws-sdk@2.1.34 node_modules/aws-sdk
├── xml2js@0.2.8
├── sax@0.5.3
└── xmlbuilder@0.4.2

$ npm install sax@0.5.8
$ npm install xml2js@0.2.8
$ npm install xmlbuilder@0.4.2
$ npm install sax@0.5.3

$ npm install aws-sdk

5.2.AWSコンソールの設定

AWSのコンソールにログインします。
今回は
Cognito => アクセスID認証
Identity and Access Management => アクセスIDの利用権限設定
S3 => 静的Webサイト sensor.ykata.net で公開する設定例
を利用します。

Cognito は現時点で日本のリージョンでは使えません。(夏頃 東京リージョン でも使えるらしいです。)
「バージニア北部」を選択します。
AWS-01

詳細はそれぞれ以下で確認してください。
http://aws.amazon.com/jp/cognito/
http://aws.amazon.com/jp/iam/
http://aws.amazon.com/jp/s3/

先ず Cognito を設定します。
Create new identity pool を行います。
AWS-02

以下 identity pool name が SensorHUB2 の例です。
Create Pool します。
AWS-03


以下自動作成してくれた権限設定はそのままで、許可 します。
Unauthのロール名は設定で使いますので控えておきます。
AWS-04

この画面に来ると設定は完了です。
Get AWS Credentials の赤字部分は設定で使いますので控えておきます。
Go to Dashboad します。

AWS-05

ダッシュボード画面が表示され、以上でCognitoの設定完了です。
AWS-06

Identity and Access Management (IAM)で、先に設定した Cognito で発行される アクセスID の利用権限を設定します。
ロールを選択します。
AWS-07

Cognito の Unauthのロール名 を選択します。
AWS-08

S3をデータ保管先として利用しますので、ポリシーのアタッチ を行います。
AWS-09

Amazon S3 Full Access を選択し、 ポリシーのアタッチ を行います。
AWS-10

以上で IAM の設定は完了しました。
AWS-11

S3にデータを保管する バケット を作成します。
このバケットは JSON でデータを保管するとともに、グラフなどで情報を閲覧するWebサイトとして利用する設定も行います。
AWS-12

バケット名を公開するドメインと同じにすると、公開Webとしても使えます。
リージョンは Cognito と同じになるよう注意して、作成 してください。
AWS-13

バケットができたら、公開Webとして使うための バケットポリシーを追加 します。
AWS-14

ポリシーエディタが起動します。
最初から作成するのは難しいので、AWS Policy Generator を利用します。
AWS-15

以下の例のように入力します。
AWS-16

ARNは arn:aws:s3:::バケット名/* を入力します。
今回の例では arn:aws:s3:::sensor.ykata.net/* となります。
Add Statement します。
AWS-17

以下のように追加されたら、Generate Policy します。
AWS-18

以上、完成したポリシーをコピーして、ページを閉じます。
AWS-19

最初の画面で、ペースト し、保存 します。
AWS-20

保存 して、静的ウエッブサイトホスティング の設定をします。
AWS-21

ウエッブサイトホスティングを有効にします。
インデックスドキュメントを index.html に設定して 保存 します。
AWS-22

以上で設定は完了しました。

S3のバケット内で右クリックすると、アップロードというメニューがあります。
そちらを開いて、htmlなどのファイルをアップすると、Webとして利用できます。

5.3.CognitoによるアクセスIDの発行

Cognitoで実際に アクセスID が node.js のプログラムで発行されるか、確認してみます。
https://github.com/yukataoka/IoT_Raspi_AWS_Demo/blob/master/cognito.js

$ nano cognito.js
var AWS = require(‘aws-sdk’);
var awsRegion = “us-east-1”;
var cognitoParams = {
AccountId: “AWSのアカウントID”,
RoleArn: “arn:aws:iam::AWSのアカウントID:role/Cognito_SensorHUBUnauth_Role”,
IdentityPoolId: “us-east-1:AWSのIdentityPoolId”
};

AWS.config.region = awsRegion;
AWS.config.credentials = new AWS.CognitoIdentityCredentials(cognitoParams);
AWS.config.credentials.get(function(err) {
if (!err) {
console.log(“Cognito Identity Id: ” + AWS.config.credentials.identityId);
}
});

実行してみると、実際にIdを獲得している様子が分かります。

$ node cognito.js
Cognito Identity Id: us-east-1:7a465491-dc91-44e7-9d8c-f08dd674c532

5.4.センサ値をS3へ発行

実際にCognitoで発行、取得したIdにS3にアクセスし、データを保管します。

先ずは、センサ値をCSV形式で出力しLCDに表示する Python プログラムを作成します。
ブロッグではインデントが表示されないので、動くコードは以下を参照してください。
https://github.com/yukataoka/IoT_Raspi_AWS_Demo/blob/master/getSensor.py

$ nano getSensor.py
#!/usr/bin/python
import time
import wiringpi2
import os
import sys
import struct
import subprocess
from time import sleep
from notsmb import notSMB
#from TSL2561 import TSL2561
from tsl2561_lux import Luxmeter

tmpVal = -999
humVal = -999
co2Val = -999
luxVal = -999

“”” LUX Setting “””
##tsl = TSL2561()
tsl=Luxmeter()

i = 0
while True:
try:
# luxVal = int(tsl.readLux())
luxVal = int(tsl.getLux())
if luxVal <= 200000 and luxVal > 100:
break
i = i + 1
if i > 5:
break
sleep(0.5)
except:
blank =0;
sleep(0.5)

“”” CO2 Setting “””
I2CBUS = 1
CO2_ADDR = 0x68
READ = 0x22
readBytes = [0x00, 0x08, 0x2A]
bus = notSMB(I2CBUS)

i = 0
while True:
try:
resp = bus.i2c(CO2_ADDR,[0x22,0x00,0x08,0x2A],4)
time.sleep(0.1)
co2Val = (resp[1]*256) + resp[2]

if co2Val < 8000:
break

i = i + 1
if i > 5:
break
except:
blank =0;
sleep(0.5)

“”” Temperature Humidity Setting “””
wiringpi2.wiringPiSetup()
i2c = wiringpi2.I2C()
dev = i2c.setup(0x40)

i2c.writeReg16(dev,0x02,0x10)
i2c.writeReg8(dev,0x00,0x00)
sleep((6350.0 + 6500.0 + 500.0)/1000000.0)
tmpVal = ((struct.unpack(‘4B’, os.read(dev,4)))[0] << 8 | (struct.unpack(‘4B’, os.read(dev,4)))[1])
humVal = ((struct.unpack(‘4B’, os.read(dev,4)))[2] << 8 | (struct.unpack(‘4B’, os.read(dev,4)))[3])
os.close(dev)
tmpVal = round(((tmpVal / 65535.0) * 165 – 40), 1)
humVal = round(((humVal / 65535.0) * 100), 1)

sleep(0.5)

line = time.strftime(‘%Y/%m/%d,’) + time.strftime(‘%H:%M:%S,’)
line = line + str(tmpVal) + “,” + str(humVal) + “,” + str(co2Val) + “,” + str(luxVal)
print line

parm1 = time.strftime(‘%m/%d_%H:%M’)
parm2 = “T:” + str(tmpVal) + “*c_H:” + str(humVal) + “%”
parm3 = “CO2:” + str(co2Val) + “ppm”
parm4 = “Lig:” + str(luxVal) + “LUX”
cmd = “/var/www/bin/oled %s %s %s %s” % (parm1, parm2, parm3, parm4)
subprocess.Popen( cmd.strip().split(” “) )

この python プログラムで得たセンサの計測値を AWS の S3 にJSONで保管する node.js のプログラムを作成します。
https://github.com/yukataoka/IoT_Raspi_AWS_Demo/blob/master/sensor.js

$ nano  sensor.js
var execSync = require(‘child_process’).execSync;
var id = “Hub01”;

var AWS = require(‘aws-sdk’);
var awsRegion = “us-east-1”;

// 1タイムアクセスID作成
var cognitoParams = {
AccountId: “AWSのアカウントID”,
RoleArn: “arn:aws:iam::AWSのアカウントID:role/Cognito_SensorHUBUnauth_Role”,
IdentityPoolId: “us-east-1:AWSのIdentityPoolId”
};
AWS.config.region = awsRegion;
AWS.config.credentials = new AWS.CognitoIdentityCredentials(cognitoParams);
AWS.config.credentials.get(function(err) {
if (!err) {
// console.log(“Cognito Identity Id: ” + AWS.config.credentials.identityId);
}
});

// S3
var s3 = new AWS.S3();
var bucket = ‘s.ykata.net’;
// センサ値取得
var result = “” + execSync(‘sudo /pi/home/getSensor.py’);

// 現在値をJSONでS3にアップ
var vRes = result.replace(/[\n\r]/g,””).split(“,”);
var vKeyN = id + “/now.json”;
var vKeyF = vRes[0].replace(/\//g,”_”);
var vKeyD = id + “/” + vKeyF + “.json”;
var vJson = ‘{“Date”:”‘+vRes[0]+'”,”Time”:”‘+vRes[1]+'”,”Temperature”:’+vRes[2]+’,’;
vJson = vJson + ‘”Humidity”:’+vRes[3]+’,”CO2″:’+vRes[4]+’,”Illuminance”:’+vRes[5]+’}’;
var params1 = {
Bucket: bucket,
Key: vKeyN,
ContentType: ‘application/json’,
Body: vJson
};
s3.upload(params1, function(err) {
if(err) {
console.log(“Error uploading data 01 : “, err);
}
});

// 1日のデータをファイルに保管し、JSONでS3にアップ
var fs = require(‘fs’);
var path = ‘./’+vKeyF;
var fsData = “”;
var fsUPData = “”;
try {
fs.statSync(path);
fsData = fs.readFileSync(path, ‘utf8’);
fsUPData = fsData + “,” + vJson;
} catch (e) {
execSync(‘echo “” >> ‘ + path);
execSync(‘chmod 666 ‘ + path);
fsUPData = vJson;
}
fs.writeFileSync(path, fsUPData,’utf8′);
var params2 = {
Bucket: bucket,
Key: vKeyD,
ContentType: ‘application/json’,
Body: ‘[‘ + fsUPData + ‘]’
};
s3.upload(params2, function(err) {
if(err) {
console.log(“Error uploading data 02 : “, err);
}
});

このプログラムを cron に登録すると、毎分のデータをJSONで AWS S3 にアップするようになります。
cron の記載はフルパスで記載します。

$ crontab -e
* * * * *  /usr/local/bin/node /home/pi/sensor.js 2>> /home/pi/cron.log

続きは 6.S3静的htmlのJavaScriptでグラフ表示 へ

 

AWSとRaspberry Pi でIoT入門 (第9回JAWS-UG佐賀)

- Raspberry Pi で農業(施設園芸)用センサ、クラウド環境分析システム構築入門 -

JAWS-UG佐賀で上記内容で話をさせて頂きました。
理論中心の座学だけでなく、実践を見て頂きたくも仕事の本番環境は全て公開できません。
そこで、新しいセンサを評価がてら、実際の機器、作業で、センサによる値の計測から、クラウドAWSでのデータ保管、グラフによるデータ解析を行う一連のデモシステムを作成しました。

折角のご縁で、時間を頂いて話を聞きに来られた訳ですので、少しでもお役に立ちたく思います。
そこで、興味のある方に是非「ダイブ」(実際に試)して頂くための、デモシステムを構築した記録を以下にまとめました。
是非、ご参照ください。

以下で紹介するプログラムのソースコードは以下に公開しています。
https://github.com/yukataoka/IoT_Raspi_AWS_Demo

1.Raspberry Pi 初期設定
https://yukataoka.wordpress.com/2015/06/20/raspi01/

2.OSインストール後の設定
https://yukataoka.wordpress.com/2015/06/20/raspi02/

3.センサなどを使うための詳細設定
https://yukataoka.wordpress.com/2015/06/20/raspi03/

4.センサの設定とプログラミング
https://yukataoka.wordpress.com/2015/06/20/raspi04/

5.センサ値をクラウドに保管・表示
https://yukataoka.wordpress.com/2015/06/20/raspi05/

6.S3静的htmlのJavaScriptでグラフ表示
https://yukataoka.wordpress.com/2015/06/20/raspi06/

当日のスライド。
(後日公開予定)

実際のWebコンテンツ
http://s.ykata.net/

AWS麻雀のCDP:Stack Deploymentパターン

JAWS-DAYS 2015 AWS麻雀体験企画
– AWS麻雀のCDP役を理解する –

7.Stack Deploymentパターンを実践理解する

AWS麻雀CDP役(AWS OpsWorks Or Elastic Beanstalk Or AWS CloudFormation Or AWS CodeDeploy{発 扱い}+ コンピュート、データベース、ネットワークのいずれか2牌)
00

今回のStack Deploymentパターンは、AWSの利用環境を、予め設定した内容で自動構築し、簡単にコンテンツ更新を行えるパターンです。

システム開発や運用保守の段階では、試験環境を準備して、結果が問題ないと確認したうえで本番環境に適用します。
しかしながら、試験環境の設定、コンテンツを本番に適用する作業を手で行うと、ヒューマンエラーなどのトラブルが懸念されます。

そこで、あらかじめ試験環境構築を設定ファイル(テンプレート)で定義し、その通り実施する事で、本番環境構築を安全かつ容易に行えるようにします。
また、コンテンツを簡単にデプロィ(本番環境に展開)可能なうえ、バージョン管理を実施できる手法を試してみます。

具体的には Elastic Beanstalk を利用して、簡単にWebサービス用PHP開発環境を構築します。
続いて、自動で作成された構成である、EC2(Webサーバ)や、ロードバランサー、AutoScallingの設定を確認してみます。
そして、このような Elastic Beanstalk で指定した自動構成を実施する定義情報がある AWS CloudFormation の中身を少し紹介します。

参考情報は以下です。

AWS Elastic Beanstalkで環境構築自動化(supertaihei02 さん)
http://qiita.com/supertaihei02/items/b2373890b7e739ded318

Elastic Beanstalk 開発、テスト、デプロイ
http://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/create_deploy_PHP_eb.sdlc.html

AWS Elastic BeanstalkへGitでデプロイする方法(YoshikiNakamura さん)
http://qiita.com/YoshikiNakamura/items/55525fa0b17e74c25ceb

ZipファイルでElastic Beanstalkにデプロイ(サーバワークス CSチーム かわむら さん)
http://blog.serverworks.co.jp/tech/2012/09/28/elastic-beanstalk_deploy_zip/

 1. Elastic Beanstalk でWebサービス用PHP開発環境を構築

先ずは Elastic Beanstalk でWeb サービス用PHP開発環境を構築します。

管理コンソールで Elastic Beanstalk の画面を開きます。
02

実は最初の画面で、PHPを選択して 「Lunch Now」だけでも基本的な環境は作れてしまいます!
急いでいる方は、 「Lunch Now」が終わるのを待って、 2.コンテンツのデプロイ から参照ください。
さすがにこちらでは少し解説しないと内容を知る事にはなりませんので、 「create a new application」 で内容を確認しながら進めます。
03
残念ながら Elastic Beanstalk の画面は日本語化が間に合っていませんね。

Application name と Discription を入力し、次に進みます。
04

Web Server Environment を選びます。
05

今回は Permissions (権限)はそのまま次へ。
06
詳細が気になる方は、以下を参照ください。
http://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/AWSHowTo.iam.roles.aeb.tiers.web.html

platform は PHP、Environment(環境) Type は折角なので、Single instance(単独サーバ環境)より、Load Balancing, Auto Scaling で、インスタンス(サーバ)がダウンしても自動で復旧し、過負荷時にサーバ自動で追加起動する設定にしてみます。
07

最初の application version はサンプルを利用します。
Deployment Limits はどれだけのサーバ数を確保するというような設定と考えると良いでしょう。
今回は試験なので、Fixed でとりあえずインスタンス(サーバ)1台以上をキープの設定に変更してみます。
08
詳細が気になる方は、以下を参照ください。
http://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/using-features.rolling-version-deploy.html

Environment(環境)名と、URLを入力します。

すでにある名前は使えないので、Check availability で確認しましょう!
09

MySQLなどのRDMSを利用する場合は、RDSの設定をチェックします。
VPC( Virtual Private Cloud)の環境を使う場合は、VPCの設定をチェックします。
今回は使う予定がないので、そのまま次に進みます。
10

詳細の設定で、Instance type は無償試用対応インスタンスでパフォーマンスの良い t2.micro を選択し、EC2 key pair は既存のものがあれば選択します。
その他は初期値のままで良いでしょう。(後から変更も可能です。)
10-1
11

Environment(環境) Tag も設定できますが、今回は試すだけなのでパスします。
12

最後に設定の確認画面が表示されますので、Launch (構築)します。
13

14

構築中は半円の矢印がくるくる回っています。
しばらくコーヒーを味わえるぐらいの時間がかかります。
15

無事環境が構築されたら、緑丸の表示がでます。
Recent event でも確認できます。
さらに Show All で詳細を確認できます。
16

詳細を確認したら、URLのリンクをクリックしてみます。
17

初期コンテンツとして用意されているのはこのページです。
18

以上で、環境構築は完了です。

2.新しいコンテンツをデプロイ(展開)してみる

環境を構築しましたが、まだ実際のコンテンツが表示されている訳ではありません。
とりあえず、以下のサイトの無料テンプレートでコンテンツのデプロイ(展開)を試してみます。

Cafi Net カフィネット 無料テンプレート 73/5ページ/スライドショー
http://japanism.info/free-template.html

先ずは以下のような構成でコンテンツを圧縮したZipファイルを作成します。
20-1

Upload and Deploy で作業を開始します。
19

先ほどのZipファイルを選択し、デプロイします。
20

以下のように、再度作業中の画面が表示されます。
21

Running Version が変わり、Recent Events に Deploying new version の記述が追加されます。
22

再表示すると、入れ替わったコンテンツが確認できます。
23

ただ、これではPHPが動くかどうか確認できません。
そこで、livedoor天気予報のAPIを利用したコンテンツと、定番の phpinfo() を確認するファイルを追加して、デプロイしてみます。

livedoor天気予報 Weather Hacks
http://weather.livedoor.com/weather_hacks/

test.php

<?php
    $point = "390010";
    $url   = "http://weather.livedoor.com/forecast/webservice/json/v1?city=".$point;
    $json  = file_get_contents($url, true);
    $json  = json_decode($json, true);
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Stack Deploymentパターン</title>
</head>

<body>
<h2>Stack Deploymentパターン</h2>
<p>Elastic Beanstalk に デプロイするコンテンツ試験!</p>
<p>今回は livedoor天気情報 Wether Hacks <a href="http://weather.livedoor.com/weather_hacks/" target="_blank">http://weather.livedoor.com/weather_hacks/</a> のAPIをPHPで使った例にしてみました。</p>

<table border="1">

<tr><th colspan="2">
<a href="<?php echo $json['description']['text']; ?>" target="_blank"><?php echo $json['title']; ?></a>
</th></tr>
<tr><td colspan="2">
<?php echo $json['description']['text']; ?><br />
<a href="<?php echo $json['description']['text']; ?>" target="_blank"></a>
</td></tr>

<?php
foreach($json['forecasts'] as $value){
    echo "<tr>";
    echo "<td>".$value['dateLabel']."(".$value['date'].")</td>";
    echo "<td>";
    echo "<image src=\"".$value['image']['url']."\" />".$value['image']['title']."<br />";
    if($value['temperature']['min'] != "NULL") echo "最低気温".$value['temperature']['min']['celsius']."度 ";
    if($value['temperature']['max'] != "NULL") echo "最低気温".$value['temperature']['max']['celsius']."度 ";
    echo "</td>";
    echo "</tr>\n";
}
?>

<tr>
<td>高知その他のポイント</td>
<td>
<?php
foreach($json['pinpointLocations'] as $value){
    echo "<a href=\"".$value['link']."\" target=\"_blank\">".$value['name']."</a><br />";
}
?>
</td>
</tr>

<tr>
<td>提供時点</td>
<td><?php echo str_replace("T"," ",$json['publicTime']); ?></td>
</tr>

<tr>
<td>API提供先</td>
<td><a href="<?php echo $json['copyright']['link']; ?>" target="_blank"><?php echo $json['copyright']['image']['title']; ?></a></td>
</tr>

</table>

</body>
</html>
?>

info.php

<?php
phpinfo();
?>

先のZipファイルに、このPHPプログラムの2ファイルを追加します。
24

Zipファイルを選択し、デプロイします。
25

デプロイが完了したら、表示してみます。

URL/info.php
26

URL/test.php
27
PHPのプログラムがしっかり動いてます!

 3.自動で設定された環境を確認する

自動で設定された環境を確認してみます。

先ずは、EC2関連の設定を確認します。
30

インスタンス(サーバ)が稼働しているのが確認できます。
31

セキュリティグループの設定が追加されています。
32

ロードバランサー(アクセスを複数サーバに振り分ける装置)も設定されています。
33

ロードバランサー(アクセスを複数サーバに振り分ける装置)も設定されています。
34

Auto Scalling 関連の設定もされています。
35
36

ボリューム(サーバのハードディスク)は以下です。
37

続いて、状況を監視する CloudWatch の設定を確認します。
40

アラームが設定されています。
この設定をもとにAuto Scalling などが実施されます。
41

続いて、ログ(記録)などが保管される、S3(ストレージ)を確認します。
45

バケット(保管容器)が追加されています。
46

バケットの中身を確認すると、デプロイしたZipファイルの各バージョンのファイルが保管されているのが確認できます。
47

最後に、AWSのリソース(利用環境)を構成する設定がある、CloudFormationを確認します。
50

Stackと呼ばれる定義が作成されています。
51

Resourcesで構成した内容を確認します。
52

Templateで実際作成された定義を確認してみます。
53
これだけ長い定義記述を自動で作成している事が確認できます。
解読するためインデントを整理するのも大変な量です。

 4.構築した環境の動作を確認する

本当に構成された環境がうまく動いているのか、確認してみます。

インスタンス(サーバ)を削除してみます。
61

62

しばらく待つと、自動で新しいインスタンス(サーバ)が構築されています。
63

Elastic Beanstalk の画面でも確認します。
64

Recent Events でも確認できます。
65

66

5.設定変更の注意

過去 Elastic Beanstalk で設定した内容の変更、削除は必ずElastic Beanstalkの画面で行いましょう。
無視すると、思わぬトラブルに見舞われます。(過去の経験談)

Applicationを選択します。
64

Configuration を選びます。
71

変更をしたい部分の歯車マークをクリックします。
今回、Instances をクリックしてみます。
72

 

以下の変更画面が表示されます。
73
以下のサイトなどを参考にして、変更します。
さすがに、設定変更は専門の知識がないと厳しいでしょう。

インスタンス
http://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/using-features.managing.ec2.html

Elastic Beanstalk 全般
http://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/Welcome.html

6.Gitによるデプロイなど

Gitによるデプロイや、PHPフレームワークのfuelphpを使う場合などは、私の過去の記事を覗いてみてください。

Windows環境で Elastic Beanstalk を使ってデプロイ(アプリ更新)
Elastic Beanstalk でFuel PHPをデプロイ
Elastic Beanstalk で RDS(MySQL)を使う
Elastic Beanstalk の RDS を FuelPHP から利用

さらに詳しい内容を知りたい方は以下が参考になるでしょう!

CloudFormationで環境構築を自動化する(竹永篤史 さん)
http://www.atmarkit.co.jp/ait/articles/1408/25/news014.html

AWS CloudFormation サービスサンプルテンプレート
http://docs.aws.amazon.com/ja_jp/AWSCloudFormation/latest/UserGuide/sample-templates-services-us-west-2.html

AWS Elastic Beanstalkの(多分)最速設定(soramugi さん)
http://qiita.com/soramugi/items/1258127d159703fe731d

ElasticBeanstalkのログ保存方法(今岡久敏 さん)
http://blog.cloudpack.jp/2015/01/28/how-to-store-log-of-elasticbeanstalk/

Elastic BeanstalkでWordPressをインストールしてみました(サーバワークス CSチーム かわむら さん)
http://blog.serverworks.co.jp/tech/2012/06/29/elastic-beanstalk_wordpress_install/

Elastic Beanstalk アプリケーションソースバンドルを作成する
http://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/using-features.deployment.source.html

AWS麻雀のCDP:Direct Hostingパターン

JAWS-DAYS 2015 AWS麻雀体験企画
– AWS麻雀のCDP役を理解する –

5.Direct Hostingパターンを実践・理解する

AWS麻雀CDP役(8Gpbs+9Gpbs+4TB)

00

今回のDirect Hostingパターンは、CMSなどのWebコンテンツを、S3に静的htmlとして出力するなどで簡単に負荷対策を行う必要が無いWebサーバーを実現できます。

短期間で急激にアクセス数が増加する場合など、EC2のインスタンス増設では間に合わない場合がある。
また、アクセス増を見込んで予め準備しておくのではコスト増となり、他ではロードバランサーとAutoScaleでの対応も検討できるが、設定が必要なうえ少しタイムラグがある。

例えば、wordpressやMovable TypeのようなCMSで更新後htmlに変換し、S3に出力し、静的サイトとして公開する事で、特定サービスのアクセス数が急激に増加してもS3側で問題なく処理できます。
結果、負荷対策を行う必要が無いWebサーバーとして利用することができます。

今回はwordpressのコンテンツをS3に静的htmlサイトとして出力する方法でDirect Hostingパターンを試してみます。但し、Route53を使わず、EC2環境を利用し、デフォルトの割り当てDNSホスト名でwordpress環境を構築します。
wordpress環境は、構築時間を超短縮するため AMIMOTO AMI を利用します。

参考情報は以下です。
wordpressをAmazon S3で運用する方法(ITANDI技術ブログ)
http://tech.itandi.co.jp/2014/05/wordpress-amazon-s3/

WordPress の StaticPress プラグインで Amazon S3 に静的なサイトを構築する(inokappa さん)
http://qiita.com/inokappa/items/d4df29279b94e04590bd

StaticPress
http://ja.staticpress.net/

megumiteam/staticpress-s3
https://github.com/megumiteam/staticpress-s3

S3をWeb Storageとして利用しますが、その環境の構築などは以下を参考にしてください。

AWS麻雀のCDP:Web Storageパターン
https://yukataoka.wordpress.com/2015/04/06/webstorage/

先ず、S3にコンテンツを更新するユーザと権限、アクセスキーの作成を行います。

AWSのコンソール画面で、Identity & Access Management を選択します。
01

Usersを選択し、Create New Users します。
02

ユーザ名を入力し、Create します。
03

Access Key ID と Secret Access Key を保管します。
05


Access Key ID:<——- Access Key ———–>
Secret Access Key:<——- Secret Key ———–>

作成したユーザを選択します。
06

Inline Policies の click here をクリックします。
07

Policy Generator を Select します。
08

以下の画面で、
Effect => Allow
AWS Service => Amazon S3
Actions => All Actions Select
ARN => arn:aws:s3:::バケット名/*
を登録し、Add Statement します。
09

以下が追加されますので、Next Step します。
10

Policy に青拝啓部分の追記し、Apply Policy します。
11

今回の例
{
 ”Version”: “2012-10-17”,

 ”Statement”: [
  {
   ”Sid”: “Stmt1429413096000”,
   ”Effect”: “Allow”,
   ”Action”: [
    ”s3:*”
   ],
   ”Resource”: [
    ”arn:aws:s3:::s3.ykata.net/*”
   ]
  },
  {
   ”Action”: [
    ”s3:ListAllMyBuckets”,
    ”s3:ListBucket”,
    ”s3:GetBucketLocation”
   ],
   ”Resource”: [
    ”arn:aws:s3:::*”
   ],
   ”Effect”: “Allow”
  }
 ]
}

以下が表示されます。
12

続いて、S3に静的htmlを更新する試験用のwordpress環境を作ります。

とにかく時間と手間をかけないため、デジタルキューブさんのAMIMOTO AMIを利用させて頂きます。
手順は以下をご参照ください。

AMIMOTO AMIの使い方(デジタルキューブ さん)
http://ja.amimoto-ami.com/how-to-use/

13

先ず静的HTMLを出力するプラグイン、StaticPress を追加します。
14

追加後、有効化します。設定はデフォルトそのままで良いでしょう。
15

StaticPress で作成した静的htmlをS3にアップするためのプラグイン staticpress-s3 のZIPを先のURLより取得して追加します。
16

追加できると、以下のようになります。
17

先にIdentity & Access Management で設定した、Access Key ID と Secret Access Key  リージョンを設定します。
東京リージョンは ap-northeast-1 です。
18

つづいて、該当するBacketを選択し、変更を保存します。
19

拡張子をhtmlにするため、パーマリンクを以下に変更します。
%postname%.html
20

S3は以前のWeb Storageパターン で構築した環境をそのまま利用します。
21

早速構築をしてみましたが、、、エラー!で終わります。
=>数時間色々粘ってみましたが、GitHubのコード解析するには時間的に厳しく別方法を探す事にしました。
22

代替えとして s3cmd をwordpressのEC2内に設定して、sshのオペレーションで送ることにしました。
以下を参考に設定をすることにします。

[技術ブログVol.10] 最新のs3cmd (ver1.5.0) をyumでインストールする(ディーネット さん)
http://www.denet.ad.jp/technology/2014/03/vol10-s3cmd-ver150-yum.html

staticpress-s3 のプラグインを停止します。
30

以下のようにS3の設定がなくなります。
出力先ディレクトリィにファイルが出力されるだけになります。
31

構築をしてみます。
32

無事出力されました。
33

以降はsshで wordpress が稼働しているEC2のコマンドラインで実施します。
(ssh接続の詳細が不明な方は検索サイトで EC2 ssh などのキーワードで検索ください。)

以下、コマンドでの手順です。

sudo yum update

sudo yum -y –enablerepo epel install s3cmd

インストールが簡単に終わります。
先ず試しにバージョンを表示させようとするとエラーが発生します。

s3cmd –version

!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
An unexpected error has occurred.
Please try reproducing the error using
the latest s3cmd code from the git master
branch found at:
https://github.com/s3tools/s3cmd
If the error persists, please report the
following lines (removing any private
info as necessary) to:
s3tools-bugs@lists.sourceforge.net
Error loading some components of s3cmd (Import Error)
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Invoked as: /usr/bin/s3cmd ?-version
Problem: ImportError: No module named S3.ExitCodes
S3cmd: unknown version. Module import problem?
python: 2.7.9 (default, Apr 1 2015, 18:18:03)
(後略)

こちらのエラーは Amazon Linux の新しいAMIのPythonのバージョンが影響しているようです。
以下のForumの投稿が参考になりました。

AWS Discussion Forums
https://forums.aws.amazon.com/thread.jspa?threadID=174345

投稿の回答に従ってコマンドを実行します。

sudo yum-config-manager –enable epel/x86_64
sudo yum install ansible -y
sudo alternatives –set python /usr/bin/python2.6
sudo yum clean all
sudo yum install yum-python26 -y
sudo yum install python-boto -y
sudo yum update -y

s3cmd –version が以下のとおり表示されるようになりました。
34

以下のサイトの情報を参考に、s3cmdを設定、実際にS3にファイルを転送してみました。

Amazon S3編~s3cmdでS3を操作してみよう!~(ナレコムAWSレシピ さん)
http://recipe.kc-cloud.jp/archives/1059

s3cmd –configure

Enter new values or accept defaults in brackets with Enter.
Refer to user manual for detailed description of all options.

Access key and Secret key are your identifiers for Amazon S3. Leave them empty for using the env variables.
Access Key: <——- Access Key ———–>
Secret Key: <——- Secret Key ———–>
Default Region [US]: ap-northeast-1

Encryption password is used to protect your files from reading
by unauthorized persons while in transfer to S3
Encryption password:Enter
Path to GPG program [/usr/bin/gpg]:Enter

When using secure HTTPS protocol all communication with Amazon S3
servers is protected from 3rd party eavesdropping. This method is
slower than plain HTTP, and can only be proxied with Python 2.7 or newer
Use HTTPS protocol [No]:Enter

On some networks all internet access must go through a HTTP proxy.
Try setting it here if you can’t connect to S3 directly
HTTP Proxy server name:Enter

New settings:
Access Key: <——- Access Key ———–>
Secret Key: <——- Secret Key ———–>
Default Region: ap-northeast-1
Encryption password:
Path to GPG program: /usr/bin/gpg
Use HTTPS protocol: False
HTTP Proxy server name:
HTTP Proxy server port: 0

Test access with supplied credentials? [Y/n] y
Please wait, attempting to list all buckets…
Success. Your access key and secret key worked fine 🙂

Now verifying that encryption works…
Not configured. Never mind.

Save settings? [y/N] y
Configuration saved to ‘/home/ec2-user/.s3cfg’

s3cmd put -r /var/www/vhosts/i-e849991d/static s3://s3.ykata.net

上記コマンドでS3に転送した結果が以下です。
35

AWSのコンソールでS3にアップされた様子です。
36

wordpressのサイトです。
37

S3のサイトです。
38

一部CSSや、JavaScriptのファイルか、フォルダ構成に不備があるのか、wordpressのテーマなどの設定の影響か、レイアウトが崩れてしまっています。
=>今回はCDPの実践手順の確認なので、これでOK(妥協)にします。(汗)

JAWS-DAYS 2015 AWS麻雀体験企画 に戻る

AWS麻雀のCDP:Cache Distributionパターン

JAWS-DAYS 2015 AWS麻雀体験企画
– AWS麻雀のCDP役を理解する –

4.Cache Distributionパターンを実践・理解する

AWS麻雀CDP役(9Gpbs+4TB+1〜4ECU)

CDP4-00

今回のCache Distribution パターンは、動画などのコンテンツ配信では、遠方な場所への配信を行うと遅延などによる品質低下を避けるため、例えばオリジナルのコンテンツを世界のリージョン(データセンター)にキャッシュし配信する事で、高品質な配信サービスを実現できる。

CloudFrontは執筆時点東京リージョンで1GBの転送で20円弱です。世界のリージョンのキャッシュサーバー(エッジサーバー)を個人でも利用できますね!

よく利用するパターンで、S3に公開するコンテンツを保管し、CloudFrontで配信します。
S3に動画などのコンテンツを保管し配信する方法は、前回の AWS麻雀のCDP:Web Storageパターン を参照ください。
今回の説明は前回のS3に構築した環境を利用する前提で説明します。

前回構築したS3の環境。
CDP4-04

またログを保管するためのbacketもs3に準備しておきます。
CDP4-06

上記準備が終わったら、マネジメントコンソールで CloudFrontを選択します。
CDP4-01

以下の画面で Create Distribution を行います。
Distribution は一つのまとまりのように捉えると良いでしょう。
CDP4-02

今回はWeb Distribution を開始します。
RTMP については説明を省きますので こちら を参照してください。
CDP4-03

Origin Domain Name にS3で先に公開したドメインを入力か、自動で紹介される場合は選択します。
EC2のWebサイトや、外部で公開しているWebサイトなどのドメインも登録して、キャッシュ利用可能です。
Origin ID には任意に設定します。
CDP4-05

ログを保管したい場合は以下のように設定してください。
Bucket for Logs は先に設定したs3のbacketを指定します。
(注意:この設定ではログが保管されませんでした。)

Create Distribution します。
CDP4-07

以下の画面で、Statusが Enabled になるまで待ちます。
コーヒーを1杯飲める以上の時間(結構待ちます)がかかります。
CDP4-08

以上で出来上がりです。
指定された Domain Name でアクセスしてみます。
CDP4-09

しっかり表示されました。
現在は Disable にしていますので、アクセスできません。
CDP4-10

動画ファイルも直接表示されました。
CDP4-11

問題はS3に記録した筈のログがすぐには見えない事です。
最初これではまりましたが、1時間以上経過しないと保管されないようです。
=> 上記ではログも問題なく設定したつもりでしたが、保管されておらず設定の見直しが必要です。

EC2のWebコンテンツでも試してみましたが、Origin Domain Name 以外ほぼ同じ設定でした。

JAWS-DAYS 2015 AWS麻雀体験企画 に戻る