Raspberry Pi3で赤外線リモコンを作る
よく耳にするけどラズパイを使ったことがなく、ふとラズパイで何か作ってみようと思い立ち。
そこそこ実用的であろう赤外線リモコンに挑戦してみました。
電子工作とは無縁な初心者向けの内容になります。
用意したもの
全てamazonで購入しました。
Raspberry Pi3 Model B ボード&ケースセット 3ple Decker対応 (Clear)-Physical Computing Lab
Samsung EVO Plus 32GB microSDHC UHS-I U1 95MB/s Full HD Nintendo Switch動作確認済 MB-MC32GA/ECO 国内正規保証品
よく分からなかったので、初心者向けの電子工作キットを購入していますが、最終的に以下があれば良かったです。
- ラズパイ3
- ラズパイ用電源
- microSDカード
- ブレッドボード
- ジャンパワイヤ
- 赤外線受信モジュール
- 赤外線LED
- 200 Ω 抵抗
赤外線受信をする
配線
工作キットの提供サイトの情報をそのまま利用します。
http://osoyoo.com/ja/2016/12/15/raspberrypi-ir-remote/
LIRCのインストール
LIRCとはLinuxで赤外線を操作可能にするパッケージです。
sudo apt-get install lirc
ラズパイでLIRCを利用するための設定
/boot/config.txtを以下のように修正します。
ラズパイが赤外線のデバイスを認識する為に必要なようです。
修正前
# dtoverlay=lirc-rpi
修正後
dtoverlay=lirc-rpi,gpio_in_pin=18,gpio_out_pin=17
GPIO18が赤外線受信PINになり、GPIO17が赤外線送信PINになります。
ラズパイを再起動します。
sudo reboot
LIRCの起動
/etc/lirc/lirc_options.confを以下のように修正します。
[lircd] nodaemon = False driver = default device = /dev/lirc0
lircdを再起動します。
lircdは赤外線の送受信を行うプログラムです。
sudo systemctl restart lircd.service
赤外線受信のテスト
以下のコマンドを実行することで、赤外線を受信できているかを確認できます。
受信モジュールに向かって赤外線を送信するとコンソール上にコードが出力されます。
mode2 -d /dev/lirc0 --driver default
赤外線受信内容の記録
以下のコマンドを実行することで赤外線受信の内容を記録することができます。
irrecord -f -d /dev/lirc0 --driver default ~/lircd.conf
プログラムの案内に従い、赤外線の内容を記録します。
何の操作なのか分かる名前を設定して、赤外線を受信させるということを繰り返します。
lircdの設定ファイルが作成されます。
設定ファイルをLIRCの設定に追加します。
sudo cp ~/lircd.conf /etc/lirc/lircd.conf
赤外線送信をする
配線
工作キットの提供サイトのLED点灯の配線を参考にして、赤外線LEDの配線をします。
http://osoyoo.com/ja/2016/04/07/use-led-to-test-gpio-pin/
GPIO17が赤外線送信のピンなので、そこだけ変更します。
赤外線送信をする
赤外線送信の設定を以下のコマンドで確認します。
$ irsend LIST "" "" TV
$ irsend LIST TV "" 0000000000000001 KEY_PLAY
赤外線の送信を以下のコマンドで行います。
irsend SEND_ONCE TV KEY_PLAY
感想
一連の流れを書くと何のことはない感じですが、systemdとか知らずにコマンド実行レベルで悪戦苦闘してました。
そこらへんが事前に分かっていれば、すんなり行ったはずです。
これでTVのON/OFFがリモートでできるようになりました。
本記事の内容を改良しました
参考情報
http://osoyoo.com/ja/2016/12/15/raspberrypi-ir-remote/
http://osoyoo.com/ja/2016/04/07/use-led-to-test-gpio-pin/
XP祭り2017に参加しました
XP祭り2017に初参加しました。
登壇者の方々、エクストリームでした。
2002年から開催されているイベントということで、XPの精神が根付いているんだなぁと感じました。
【基調対談】ワークスタイル改革を実践者する二人が、働き方の本質を語る (青野 慶久さん、倉貫 義人さん)
お二人ともパーカースタイルというラフな感じが印象的でした。
基調講演始まりました!#xpjug pic.twitter.com/JuwkG5um9M
— xpjug (@xpjug) 2017年9月16日
働いている人たちに本当に良いと思ったことをやっていたら、社員が活き活きと働く会社になっていたという話で、青野さんが言っていた社員が出ていくような会社は魅力がないので、会社をやめるということが印象的でした。
副業をしたり、コミュニティに参加したりして、自分の見聞を広げることが今の活動に繋がっているというのも印象的でした。外の世界には活き活きと仕事をしている人たちがいることを知れたことが良い経験になったということで、そういう人たちから学ぶことができると良い方向に向かっていくのだなぁと感じました。
また、IT活用が進んでいく中で、旧来の仕事のスタイルからの変革が起こっているという話も印象的で、例えば、事務をやっていた人がkintoneを使って自分たちの業務が楽になるシステムを作ってしまったという話がありました。
ITの世界だと今までできなかったことがアイデア次第ではできるようになってきているので、今までの仕事の価値がいつの間にかなくなることもあるんだろうなと感じました。
DevOps時代のプロジェクトマネジメントを考えよう (森實 繁樹さん)
プロジェクトマネージャーのあり方は今後変わっていくのだろうと確信する発表内容でした。
今までの決められたことを作るだけのプロジェクトから売れるものを作らないといけないプロジェクトになりつつあるというのがその背景で。
従来のプロジェクトマネージャーはプロダクトをマネージメントすることに注力する必要があるということでした。これは大きな変革だと思いました。求められるスキルも全然違うので。
その分、チームメンバーはお互いにセルフマネージメントが必要になるので、自分のような開発者の立場からするとマネージメントのスキルを身につけていく必要があるなぁと感じました。
全ては Fearless Change から学んだ,開発組織の変革を支えた実践的アプローチ (吉田 慶章さん)
軽快なトークで聞いていて面白いなぁと感じる発表でした。
組織変革には興味があるので、実践的な内容で非常に参考になりました。
「達人を味方に」のパターンは、あまり周りに達人っぽい人がいない環境なので、勇気が入るなと個人的には思いましたが、やれたらすごい効果的なんだろうなとも思いました。機会を作ってやってみたいと思いました。
前セッションの開発者の立場でもマネージメントが必要という中で、参考になる内容でした。
xUTPから学ぶ、記述性の高いユニットテスト (高橋 陽太郎さん)
日本語のメソッド名にしてテストケース名を分かりやすくするというテクニックは使ってましたが、データ初期化メソッドも日本語名にするというのは思いつきませんでした。テストコードの可読性を高めるには色々やり方があるなーと感じました。
JUnit5も出たので、これを機にテストコードを再考してみたいと思いました。
シンプルデザインについて (渋川 よしきさん)
最近、ソフトウェアパターンを学んでいるので、渋川さんのパターンに対する見解は興味深かったです。
パターンはそれ単体というより、組み合わせてランゲージにすることによって、より他者との共通理解を生むものなので、それを意識してパターン化できればと思いました。
フォースはその時の状況に左右されるので、一般化するには弊害があるという意見が斬新でした。そのパターンがどの文脈で使われるかを意識してパターン化できると良いのだなぁと思いました。
濃い質疑応答のススメ ~質問には質問で返してみよう~ (和田 憲明さん)
ワークショップ形式で体験しました。
質問を質問で返すことによって、質問者の気づきを促すことができるというのが本質だと思いました。
命令型のリーダーではなく、サーバントリーダーのような支援型のリーダーに有効なテクニックだなと思いました。
何かを伝える時にその人の納得感が得られる形で伝えられる良い方法だと思いました。
LT祭り&クロージング
LT祭りは面白かったに尽きます。これは現場にいないと分からないと思います。
XP祭りの名物コーナーということで、何か完成された盛り上がりがありました。
本当にエクストリームでした。
初参加枠ということで、XP祭りへの寄贈本をいただきました。
ありがとうございます。
Auth0 + Angularでの認証機能実装
Auth0を利用して、Angularで作成したアプリに認証機能を実装してみました。
Auth0のドキュメントにAngular向けのQuickStartがあるので、そのまま実装すればAuth0を利用できます。
Auth0 Angular 2+ SDK Quickstarts: Login
今回はAuth0で用意されているログイン画面の利用と認証後に扱うことが可能なユーザ情報の表示をやってみました。
ログイン
Auth0 Angular 2+ SDK Quickstarts: Login
つまずくポイントとしては、Auth0のログイン画面から戻ってきた場合にルートコンポーネントのコンストラクタが呼ばれることです。
ngOnInitメソッドは呼ばれないようです。
下記のようにルートコンポーネントで認証後の処理を行なっています。
import { Component } from '@angular/core'; import { AuthService } from './auth/auth.service'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { constructor(public auth: AuthService) { auth.handleAuthentication(); } }
ユーザ情報の利用
Auth0 Angular 2+ SDK Quickstarts: User Profile
QuickStartのコードの場合、認証後に別コンポーネント上でユーザの情報を表示するという作りになっています。
実用的なパターンとしては、認証済みであれば、ヘッダー部にユーザ情報を表示するというケースがあるかなと思いますので、それを実現するように作り変えてみました。
GitHub - hi1280/auth0-angular-samples
app.component.ts
で認証及びユーザ情報の表示を行なっています。
app.component.ts
import { Component, OnInit } from '@angular/core'; import { AuthService } from './auth/auth.service'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent implements OnInit{ profile: any; constructor(public auth: AuthService) { auth.handleAuthentication(() => { this.initProfile(); }); } ngOnInit() { this.initProfile(); } logout() { this.profile = undefined; this.auth.logout(); } initProfile() { if (this.auth.userProfile) { this.profile = this.auth.userProfile; } else { if (this.auth.isAuthenticated()) { this.auth.getProfile((err: any, profile: any) => { this.profile = profile; }); } } } }
auth.service.ts
import { Injectable } from '@angular/core'; import { AUTH_CONFIG } from './auth0-variables'; import { Router } from '@angular/router'; import 'rxjs/add/operator/filter'; import * as auth0 from 'auth0-js'; @Injectable() export class AuthService { auth0 = new auth0.WebAuth({ clientID: AUTH_CONFIG.clientID, domain: AUTH_CONFIG.domain, responseType: 'token id_token', audience: `https://${AUTH_CONFIG.domain}/userinfo`, redirectUri: AUTH_CONFIG.callbackURL, scope: 'openid profile' }); userProfile: any; constructor(public router: Router) {} public login(): void { this.auth0.authorize(); } public handleAuthentication(cb: any): void { this.auth0.parseHash((err, authResult) => { if (authResult && authResult.accessToken && authResult.idToken) { window.location.hash = ''; this.setSession(authResult); cb(); this.router.navigate(['/home']); } else if (err) { this.router.navigate(['/home']); console.log(err); alert(`Error: ${err.error}. Check the console for further details.`); } }); } public getProfile(cb): void { const accessToken = localStorage.getItem('access_token'); if (!accessToken) { throw new Error('Access token must exist to fetch profile'); } const self = this; this.auth0.client.userInfo(accessToken, (err, profile) => { if (profile) { self.userProfile = profile; } cb(err, profile); }); } private setSession(authResult): void { // Set the time that the access token will expire at const expiresAt = JSON.stringify((authResult.expiresIn * 1000) + new Date().getTime()); localStorage.setItem('access_token', authResult.accessToken); localStorage.setItem('id_token', authResult.idToken); localStorage.setItem('expires_at', expiresAt); } public logout(): void { this.userProfile = undefined; // Remove tokens and expiry time from localStorage localStorage.removeItem('access_token'); localStorage.removeItem('id_token'); localStorage.removeItem('expires_at'); // Go back to the home route this.router.navigate(['/']); } public isAuthenticated(): boolean { // Check whether the current time is past the // access token's expiry time const expiresAt = JSON.parse(localStorage.getItem('expires_at')); return new Date().getTime() < expiresAt; } }
handleAuthenticationメソッドにコールバック関数を渡して、認証後にユーザ情報の取得を行なっているのが修正のポイントです。
まとめ
Auth0を利用すれば、Google、FacebookやTwitterといったソーシャルな認証プロバイダーを利用して、ユーザ情報を取得できるため、面倒な認証処理の実装がショートカットできます。
APIの保護などもできるようなので、認証にまつわる面倒ごとを色々省くことができるようです。
- 作者: 山田祥寛
- 出版社/メーカー: 技術評論社
- 発売日: 2017/08/04
- メディア: 大型本
- この商品を含むブログを見る