コモノポリタン

コモノ、デジモノが好きなKomonopolitan住民 （はてなダイアリーからの引っ越しです）

【Home Assistant(Hass.io)でホームオートメーション】NFCタグで機器管理

SmartHome

NFCタグで機器を管理しましょう

スマートホームを実現するためには、Google HomeやらBroadlink RM mini3やら同じものを複数個買って使う必要が出てきます。電池を入れ替えたり、設定を確認したりで場所を動かした時も、間違えずに元の場所に戻す必要があります。まあ、マジックで名前を書いておいてもよいのですが、そこは「スマート」ホームですから、スマートにNFCタグでピッとやって管理しましょう。

1. 準備

名前 型番 備考
NFCタグ NTAG213 Amazonで12枚690～790円で売っています。サンワサプライ（互換？）との記載のある円形の白無地で記憶容量144byteのタグです。
f:id:maky_Ba:20200124003741j:plain:w300
まだ一枚60～70円ですね。
スマホ or タブレット Android, iOS (iPhone6以降) NFCが使えること。Androidの方が読み書ききちんとできてよいかな。iPhoneでも最近のものは大丈夫でしょう。

1.1.タグの準備

べたっと貼って剥がさないであれば気にしなくてよいのですが、NFCタグを貼りたいBroadink RM mini 3の裏面は紙ラベルなので、剥がして貼りなおせる様に、ちょっと細工を。
そのまま貼るときはここはスキップで。

  1. 購入したタグはちょうどクオーター硬貨と同じぐらい（つまり、まあ10円玉と同じぐらいということですね）なので、硬貨を何らかの紙（写真ではポストイット）に置いてちょっと大きめにぐるっと円を描く
  2. NFCタグの剥離紙を剥がして、書いた円に収まるように貼る（まあこのタグの粘着シートでも剥がせそうですけどね）。
  3. 弱い両面テープ（写真のはKOKUYO 両面テープラクハリT-RM2015。ちょっと癖があって使いづらい…）をタグの白い面に貼る。全面に貼らずに一部残しておくと剥がしやすい（と思う。写真で黒い点を打っているところが糊なし（＝剥がすところ））。
  4. ちょきちょき書いた円に沿って切って出来上がり。
    外側になる紙(今回はポストイット黄色)｜NFCタグの粘着面｜NFCタグ本体｜両面テープ、と4層構造に。

f:id:maky_Ba:20200123235815j:plain:w300:left f:id:maky_Ba:20200124000102j:plain:w170

1.2. NFCタグ書き込みアプリの準備

NFCタグの書き込みアプリはいろいろあって、おおよその違いは「タグをかざした時に出来ること」が違いだと思います。そもそもの話なりますが、アプリを入れなくても、NFCリーダー搭載のスマホやタブレット（Android携帯やタブレットなど）にNFCをかざすと簡単なことならできます。例えばURLを開く、メールを送る、などなど。

NFCタグのアプリを入れておくと、タグを読み込んだ時にさらに色々できるようになります。が、しかし「そのアプリ」がNFCを読み取るスマホなどにインストールされてる必要があります。

今回はブラウザで情報を表示したいだけなので、URLをタグに書き込んで、かざしてURLをオープンできれば十分です。つまり、どのNFCタグアプリでもさほど違いはありません、ということ。ここで評判のよさそうな「NFCタグマティック」を使います。

f:id:maky_Ba:20200124001459p:plain:w200
（評判良くて評価が3.9なのか、というところは突っ込まないでください）

1.3. Home Assistant (Hass.io)側で準備

今回はスマホをかざすとそのデバイスの情報が書かれたWebページが表示される、というようにしたいと考えています。そのWebページをHome Assistantサーバで表示させるための準備です。と言っても簡単です。

  1. 左側から「File Editor」を選んで、エディタを立ち上げる。
  2. エディタ画面の左上のフォルダのアイコンをクリックする
  3. デフォルトで表示されているフォルダ（config/）の下にwwwをつくります。`config/‘フォルダが表示されている状態で、フォルダに＋マークの「New Folder」をクリックしてwwwを指定。それだけです。
    f:id:maky_Ba:20200621043339j:plain:w450
  4. Home Assistantサーバを再起動。

これでwwwフォルダに置かれたhtmlファイル（例えばA.html）には、https://<あなたのHome Assistant URL>/local/A.htmlでアクセスできるようになっているはず。
htmlファイルの作成もFile Editorを使えば良いですね。らくちん。

2. NFCタグの設定

2.1. 表示する情報の準備

Home AssistantのFile Editorを使って、先ほど作成したwwwに表示用のファイル（例えばここでは　ir_remote_broadlink_rm3_04.html）を作ります。フォルダが選ばれている状態で、「New File」（ファイルに＋のアイコン）して下記を入力します。これはHTMLで好きに編集してくださいね。
（注意追記：外部からアクセスできるファイルなのであまり色々書かない方が良いです。セキュリティ上…）

<html lang="ja">
    <head>
    </head>
    <body>
        <h1>Broadlink RM mini 3 - #4</h1>
        <table border=1>
            <tr>
                <td>WiFi MAC Address</td>
                <td>C8:F7:42:xx:xx:xx</td>
            </tr>
            <tr>
                <td>Purchase Date</td>
                <td>2019/9/3</td>
            </tr>
            <tr>
                <td>Status</td>
                <td>Active</td>
            </tr>
        </table>
    </body>
</html>

2.2. タグの書き込み

それではNFCタグにURLを書き込んでいきましょう。
NFCタグマティックを起動して、画面を横にスワイプして、「オープンタスクを新規作成」をタップ。「ブラウザでwebページ表示」をタップ。
f:id:maky_Ba:20200620213427p:plain:w200:left f:id:maky_Ba:20200620213700p:plain:w200

先ほど作ったHTMLファイルのURLhttps://<あなたのHome Assistant URL>/local/ir_remote_broadlink_rm3_04.htmlを記入して「OK」。NFCタグをスマホ/タブレットのNFC書き込みエリアの下に置いて「書き込む」をタップ。
f:id:maky_Ba:20200620215437p:plain:w200:left f:id:maky_Ba:20200620215955p:plain:w200

書き込みエリアから外れているなら、少し前後左右に動かして書き込む。
f:id:maky_Ba:20200620220413p:plain:w200:left f:id:maky_Ba:20200620221002p:plain:w200

3. おしまい

NFC読み取り機能のあるスマホ/タブレットでNFCタグに触れる(近づける)と、ブラウザが自動的に立ち上がって、こんな感じで表示されます。
f:id:maky_Ba:20200621051229j:plain:w200:left f:id:maky_Ba:20200621051424j:plain:w200
ちょっと表示が小さいかな、そこはHTMLでなんとでもなりますので、お好みで調整を。

これで「え、これどこのだっけ」が解消されます。また情報のアップデートはいちいちNFCの書き込みをしなくても、Home Assistant側だけで完結。ちょっと便利になりました。

次こそは、エアコンを汎用赤外線リモコンで操作したいと思います。