RM mini3(eRemote mini)+外部公開API+webflowでリモコンを作ってみる

背景

3年前に構築したGoogle HomeとIFTTTと自宅のサーバ(Rasberry Piでもok)で簡単家電操作　の続きです
スマホだけではなく　あらゆる端末から自宅家電を操作したくなりました

前提条件

Google HomeとIFTTTと自宅のサーバ(Rasberry Piでもok)で簡単家電操作の環境が構築されていること

材料

• webflow
• Google App Script

構成

おさらいですが前回までにこんな感じで自宅環境が構築されていると想定します

API

つまり下記のAPIができていると仮定します

アクション	API	実際のコマンド
tvの電源をつける	http://api.my.domain/[broadlinkのmacaddress]/tv	$ broadlinkjs-rm-cli [broadlinkのmacaddress] tv
tvのボリュームを上げる	http://api.my.domain/[broadlinkのmacaddress]/tv_vol_Pup	$ broadlinkjs-rm-cli [broadlinkのmacaddress] tv_vol_up
7チャンネルに切り替える	http://api.my.domain/[broadlinkのmacaddress]/tv_7	$ broadlinkjs-rm-cli [broadlinkのmacaddress] tv_7

などなど。。。

Google App Script

GASの具体的なはじめかたは省略しますが下記のように
api叩き先と叩いたあとredirectするようなかんたんなAPIを作成し　web appとして公開します

Code.gs

function doGet(e) {
  UrlFetchApp.fetch(e.parameter.get, {'method':'get'});
  return HtmlService.createHtmlOutput(
    "<script>window.top.location.href='"+e.parameter.redirect+"';</script>"
  );
}

パラメータ名	意味	例
get	API叩き先	http://api.my.domain/[broadlinkのmacaddress]/tv
redirect	get後の遷移先	https://www.google.com/

webflow

webflowを使ってボタンだらけのUIを作ります
もちろんボタンのリンクはこのような形になります

https://script.google.com/macros/s/[GAS Key]/exec?redirect=[publishしたあとのwebflowページのURL]&get=[URLエンコードしたAPIのURL]

実際の動き

こんな感じで　UI->GAS->API-リダイレクト->UI
となっていて　とても動きはもっさりしていますがなんとか実用に耐えられるレベルです
bubble.ioやadalo.com等試してみましたが挫折し、UIはwebflowに落ち着きました

注意事項

今の構成だと、セキュリティ的な防御はまったくなく、誰でも自宅の家電を操作出来てしまいますので
お気をつけください
引き続き、下記どちらも何か有りましたらpull requestでFBいただけると幸いです
- broadlinkjs-rm-cli
- altd

最後まで読んで頂きありがとうございました。