Raspberry Pi + Picamera でIoT体験を isaax でやってみよう

XSHELLが開発しているIoTデバイス向けのデプロイツール「isaax」を使ってみます。

今回は、RaspberryPiにカメラを接続し、サンプルアプリケーションを動かします。
isaaxを使ってインストール・ストリーミングで動作確認・プログラム修正して画像認識までを楽しく体験しましょう。

## XSHELLでは誰でもWelcomeの勉強会を行っています

この記事はこちら
「Raspberry Pi + カメラで画像認識IoTをやってみよう with おいしいものパーティ」
https://atnd.org/events/93063
のワークショップテキストとして作成しました。

## こんな感じ
IoTっぽく、ヘッドレス（キーボード、マウス、ディスプレイは繋がない）でやっていきます。
![IMG_20171213_141340.jpg](https://qiita-image-store.s3.amazonaws.com/0/208108/ff3b50d1-12d8-0246-7ff7-898c436db038.jpeg)


Raspberry Pi にはカメラ、電源、ネットワークだけを接続します。ワークショップでは有線LANを使いますが、無線LANを使う場合は電源とカメラだけでOKですね！


## 基本的な流れ

isaaxを使うための基本的な流れは以下の通りです。

1. isaaxのダッシュボードでプロジェクトを作成します(GitHubまたはBitbucketのリポジトリが必要となります)。
2. 母艦PCからコマンドラインツールを使うか、デバイス上で動作するエージェントを手動でインストールすることでデバイスを登録します。デバイスのIPアドレス、SSHログインするための情報が必要となります。
3. デバイスの登録が成功した時点でリポジトリにある最新のアプリケーションがインストール、実行されます。
4. 母艦PCでアプリケーションに修正を加え、`git push`を行うことでプロジェクトに登録したデバイス全てに更新を行うことができます。



# はじめよう

## 必要なもの

### Raspberry Pi 環境
- Raspberry Pi 2 または 3
- SDカード
- Picameraモジュール (v1またはv2)
- 電源 (PCからの給電も可)
- インターネット接続(ワークショップでは有線LANを使います)

### 母艦PC環境
- ssh 、gitコマンドをインストール
- GitHubまたはBitbucketアカウント
- isaaxアカウント（後述）
- インターネット接続


## 環境設定

## Isaax概要

![isaax.png](https://qiita-image-store.s3.amazonaws.com/0/208108/9c2e8015-b24e-c0c2-d397-5a631a69a297.png)


### Raspberry Pi

Raspbian を microSDカードにインストールし、ネットワークにつなぎます（ワークショップでは、LANケーブルを使ってRaspberry Piをネットワークに接続します）。ワークショップではあらかじめ必要な環境は構築済みのSDカードを使用しました。同じ環境の作成方法はこちら：「Raspberry Pi で OpenCV を使う環境を整える」https://qiita.com/xshell/items/025f0024e896a189c8c3

### 母艦PC

PCはsshとgitコマンド、適当なエディタが使えたら何でもいいです。MS-Windows/Mac/LinuxどれでもOKです。

#### ex,Ubuntu Linuxの場合

gitが入って無ければインストールします。

```

$ sudo apt-get update
$ sudo apt-get insall git
```

#### ex, MS-Windowsの場合

使い慣れたsshやgitコマンドが特に無い場合は、cygwinを使ってインストールします。

1. cygwinの「setup-x86」または「setup-x86_64」を実行中、「Select Package」で以下を選ぶ
1. Devel - 「git」
1. Net - 「openssh」

#### Raspberry PiのIPアドレスを調べる

下のリンクを参考にRaspberry PiのIPアドレスを調べます。
[同じLAN内に接続したRaspberry PiのIPアドレスを調べる](https://qiita.com/xshell/items/af4e2ef8d804cd29e38e)

#### GitHubまたはBitbucketアカウント

isaaxはgitにプログラムコードをpushすると、自動的にIoTデバイスにプログラムが配信・自動実行されるようになっています。gitのレポジトリは今のところGitHubとBitbucketに対応しています。
GitHub 、Bitbucket にアカウントをお持ちでない場合は、あらかじめisaaxと連携するアカウントをご用意下さい。


#### isaaxアカウント

こちら
https://isaax.io/
より、isaaxの無料アカウントを登録しておきます。
GitHubあるいはBitbucketのアカウントを連動設定しておいてください。

# サンプルプログラムを動かしてみよう

## プロジェクトの作成

デバイスにデプロイするアプリケーションをGitHubまたはBitbucketに作成します。今回は、あらかじめ用意したサンプルコードをフォークまたはクローンして作成します。

_※以前勉強会に参加した方ですでにプロジェクトを作成されている方は、[フォーク元のリポジトリ](https://github.com/xshellinc/study-group)に加えられた変更を反映するか、新しくプロジェクトを作り直す必要があります。_

### フォークする場合(GitHubのみ)
[サンプルコードのリポジトリ](https://github.com/xshellinc/study-group)を開き、右上のForkボタンを押してリポジトリを自分のアカウントにフォークします。

フォークしたリポジトリを母艦PCにクローンします。

```:local
git clone https://github.com/<your github name>/study-group.git
```

isaaxのダッシュボードを開き、[+]ボタンからプロジェクトを作成します。

<img width="892" alt="スクリーンショット 2018-02-01 15.54.30.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/05c1bbbc-c69b-aac4-be02-5d0f9c0e9979.png">


モーダルが開くので、下図のように詳細情報を入力します(プロジェクト名、 説明は任意)。

<img width="600" alt="スクリーンショット 2018-02-01 16.02.07.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/505a6b0c-053c-3dae-5d57-ec9055baab92.png">



[保存]ボタンを押してプロジェクトの作成は終了です。

### クローンする場合(GitHub, Bitbucket)

_※ こちらではGitHubを使った方法について説明していますが、Bitbucketでも同様の方法でプロジェクトを作成できます。_

自分のGitHubアカウントにリポジトリを作成します。このとき、`README.md`や`.gitignore`は追加しません。

<img width="737" alt="スクリーンショット 2017-12-12 18.28.25.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/85ded1af-c1ae-3979-f97d-5850e44770da.png">


[サンプルコードのリポジトリ](https://github.com/xshellinc/study-group)を開き、右側緑色のボタン[Clone or download]で表示されるURLをコピーし、母艦PCにリポジトリをクローンします。

```:local
git clone https://github.com/xshellinc/study-group.git
```

クローンしたローカルリポジトリに移動します。最初に作成した空のリポジトリをリモートに追加し、ソースコードを反映します (緑マーカーの部分を実行。originをisaaxなど別の名前に置き換える)。

<img width="867" alt="スクリーンショット 2017-12-12 19.15.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/9577453d-94f4-30f4-0360-34ad64dd8c1e.png">


```:local
cd study-group/
git remote add isaax https://github.com/<your github name>/picamera-app.git
git push isaax master
```

isaaxのダッシュボードを開き、[+]ボタンからプロジェクトを作成します。

<img width="892" alt="スクリーンショット 2018-02-01 15.54.30.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/377efe8a-6f96-a75e-4f7a-b9d06ee042ae.png">


モーダルが開くので、下図のように詳細情報を入力します(プロジェクト名、 説明は任意)。

<img width="600" alt="スクリーンショット 2018-02-01 16.02.07.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/bcb176c1-4379-f88f-497b-f87440cf32fb.png">



[保存]ボタンを押してプロジェクトの作成は終了です。

## デバイスの登録

さて、実際にプログラムが動作するIoTデバイスをプロジェクトに登録します。登録にはいくつか方法があります。

1.コマンドラインツールを使って母艦PCからRaspberry PiのIPアドレス、ユーザ名、パスワードを入力してデバイスを登録する方法

2.Raspberry Piにログインし、isaax-agentをプログラムをインストール、実行してプロジェクトに登録する方法

今回は、2.の方法を使います。

### isaax-agentのインストール

Raspberry PiにSSH接続します。

```:local
ssh pi@<ip address>
```

isaaxのダッシュボードを開き、作成したプロジェクトを選び、クラスターから「default」を選択します。
環境変数のタブを選び、一番上の「ISAAX_AGENT_RELEASE」のトグルボタンを右に寄せて黒色にします。

<img width="892" alt="スクリーンショット 2018-02-01 16.33.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/d8d4d293-0b78-c157-009c-2f3992223d36.png">


isaaxのダッシュボードを開き、「プロジェクトの名前」 > 「詳細」をクリックします。
<img width="906" alt="スクリーンショット 2018-02-01 16.38.38.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/53795439-9c1f-71c1-c57e-3a400eccdfb8.png">

右下の[プロジェクトトークン]をクリックするとモーダルが表示されるので、バックが黒い文字列をコピーします。
<img width="598" alt="スクリーンショット 2018-02-01 16.06.09.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/007060f8-5ae9-f0e0-e553-c754f9466f95.png">

コピーした文字列をraspberry piのターミナルで実行します。

```:raspberry
curl -fsSL get.isaax.io | sudo bash -s stable "プロジェクトトークン"
```


<img width="336" alt="スクリーンショット 2018-02-01 16.16.20.png" src="https://qiita-image-store.s3.amazonaws.com/0/208108/2a9dbb10-cf47-b072-04cd-530369894857.png">



上記画像のように[ISAAX Agent installation finished]が出力されればインストール成功です。この時点でデバイスにリポジトリの最新のコードが配信されます。

## 動作を確認しよう

ブラウザからRaspberry Piの`<IPアドレス>:5000`にアクセスするとPicameraの映像が確認できます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/208108/e1938633-c072-f2df-028c-812dc734c1ed.png)

サンプルは、motionJPGでWebストリーミングするプログラムです。

インストールがうまく実行されない場合は、`/var/log/isaax-agent.log`を確認します。

## アプリケーションの更新

最後に、母艦PC上でアプリケーションを修正して`git push`することでデバイスにアプリケーションの変更を反映します。

`camera/main.py`を編集します。2行目をコメントアウトし、4行目コメントを外します。ここでは、OpenCVを使った動体検知の処理を読み込んでいます。

```python:local(camera/main.py)
1 from flask import Flask, render_template, Response
2 # from processor.simple_streamer import SimpleStreamer as VideoCamera
3 # from processor.pedestrian_detector import PedestrianDetector as VideoCamera
4 from processor.motion_detector import MotionDetector as VideoCamera
```
変更を終えたら、リモートリポジトリに反映します。

```bash
git commit -am "Enable motion detection"
git push origin master # フォークした場合はoriginを正しい名前に変更
```
数秒待ったのち、`<IPアドレス>:5000`をリロードして変更が反映されていれば更新成功です。

## 補足

### isaax.jsonについて

`isaax.json`にはデバイス上でユーザーアプリケーションを実行する際に必要な情報が含まれています。例えば、`name`はデバイス上で常駐化する際のアプリケーション名となります。

サンプルコードのリポジトリには`isaax.json`があらかじめ配置されていて、今回は新たに作成しなくてもそのまま使えるようになっています。

```:(isaax.json)
{
   "name": "pifeed",
   "version": "",
   "description": "",
   "main": "main.py",
   "author": "",
   "license": "",
   "language":"python",
   "scripts": {
      start |  "python -u camera/main.py"
   },
   "dependency": null
}
```