YOUR ACCELERATOR

CLICK TO SELECT HYPER DRIVE

WEB DESIGNER'S BLOG

Facebookの「いいね!」が押されると光るランプを製作してみよう!

2017年5月09日

haino

こんにちは。デザイナーの灰野です。最近はすっかり電子工作にハマっておりまして、今日もまたまたラズパイ関係の投稿です。

とはいえ、Web制作会社のブログで仕事中にWebとは全く関係ないエントリーを書くのもまずいので、電子工作とはいってもWebと絡めた内容でお送りします。

今日は、会社のウェブサイトの「いいね!」ボタンが押されるとLEDがしばし点灯するというそんな電子工作ネタをご披露いたします。これぞまさにフィジカル・コンピューティング!!

<ラズパイなど必要なものを準備しよう>

[必要なもの]
・Raspberry Pi
・小さなブレッドボード
・LED(何色でもいいですが、Facebookっぽいブルーがいいですね!)
・カーボン抵抗(330オーム等)

[必要な条件]
・NOOBS 1.5.0以上
・インターネット環境

[配線図]
下記を参考に配線してください。一般的なLチカと変わらないんで簡単ですよ。

<まずは、いいね!ボタンの設置から>

サイトに「いいね!」ボタンがなくてはダメなんで、まずは「いいね!」ボタンを設置します。

Facebook for Developers
いいね!ボタン(ウェブ用)
https://developers.facebook.com/docs/plugins/like-button?locale=ja_JP

上記URLの「いいね!ボタン構成ツーツ」で「いいね!」ボタンを作っちゃいましょう。iframeなら設置も簡単ですね。…ちなみにですが、Facebook for Developersを使うのが全く初めての場合は、この作業の前にアプリの作成をしなければなりません。「コードを取得」する前に自分が作成したアプリを選択しなければならないからです。ですが、ここではアプリ作成の仕方に関する説明は省略しますので、具体的なやり方はググってみてくださいね。

ボタンを設置したら、早速「いいね!」してみましょう。「いいね!」が1になりましたよね?

<これから書くプログラムの仕組み>

ここまでできたら、次はコードを書いていくわけですが、まずは今回作ろうとしているプログラムの仕組みをざっと説明しておきます。

プログラムの流れは下記の通りです。

1. 「いいね!」ボタンを設置したページのjsonコードを取得
2. 前回取得した「いいね!」の数を開いて取り出す
3. jsonから最新の「いいね!」の数を取り出し次回のために保存する
4. 前回取得した「いいね!」の数と比べて、もし増えていたらLEDを点灯させる
5. このプログラムをcronに設定して定期的に実行する

ところで、jsonの取得方法ですが、下記のurlから取得できます。

https://graph.facebook.com/?id=※「いいね!」ボタンを設置したページのURL

うちの会社の場合はこんな感じです。
https://graph.facebook.com/?id=http://axel.co.jp

<Pythonでコードを書く>

それでは、Pythonでコードを書いていきましょう。プログラムは「/home/pi/」内の適当なところに設置してください。

vi fb-like-light.py
# -*- coding: utf-8 -*-
import urllib2
import json
import RPi.GPIO as GPIO
from time import sleep

# GPIOの設定
GPIO.setmode(GPIO.BCM)
GPIO.setup(25, GPIO.OUT)

# json取得
req = urllib2.Request('https://graph.facebook.com/?id=http://axel.co.jp')
res = urllib2.urlopen(req)
cur = res.read()

# 取得したjsonをパースして「いいね!」の値を取得
cur_json = json.loads(cur)
now_count = format(cur_json['share']['share_count'])

# 前回取得した「いいね!」の値を参照
r = open('/home/pi/raspi-test/share_count.txt', 'r')
for row in r:
	old_count = row

# 今回取得した「いいね!」の値を保存
w = open('/home/pi/raspi-test/share_count.txt', 'w')
w.write(now_count)
w.close()

try:
	# 前回と今回の「いいね!」の値を比較して増えていればLEDを点灯
	if old_count < now_count:
		print 'LED ON!!'
		GPIO.output(25, GPIO.HIGH)
		sleep(30)
		GPIO.output(25, GPIO.LOW)
		sleep(1)
	else:
		print 'No Reaction'

finally:
	GPIO.cleanup()

上記を参考にコードが書けましたか?

ちなみに、「share_count.txt」のパスは、cronから実行する場合はフルパスで指定しないと実行できないので注意してください。

書けたらZZで保存してくださいね。

またviを使って同じディレクトリに「share_count.txt」を作成しておいてください。内容は「0」で作成してください。

vi share_count.txt

iを押して0を入力してZZで保存ですね!

それでは、試しにプログラムを実行してみましょう。

python fb-like-light.py

どうでしょう?sshのコンソールに「LED ON!!」と出力されLEDが30秒間点灯しましたか?

<cronに設定する>

テストが完了したらいよいよcronを設定しましょう。

crontab -e
*/2 * * * * python /home/pi/raspi-test/fb-like-light.py 2>>/home/pi/raspi-test/error.log
sudo /etc/init.d/cron restart

上記は2分おきにプログラムが実行される設定ですが適宜調整してください。

注意点ですが、パスが異なる場合は適宜変更してください。それと、上記のようにエラーログを吐くようにしておくと問題があった時にデバッグしやすくなるのでオススメです。

いかがでしたか?フィジカル・コンピューティングを堪能できたでしょうか?

今回は必要最低限のことしかしてませんが、例えば、3Dプリンターでランプの筐体をデザインしたり、LEDのカバーを作成してかぶせたりするとちゃんとした電子工作作品になりますよね。

皆さんもいろいろ工夫してみてください!!

いつも画面の中でお仕事が完結してしまう我々にとって、時には画面の中から飛び出してみるのもいいもんです。

さぁ、ビットからアトムの世界に羽ばたこう。

Category

Recent Posts

Tag Cloud