Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
半自動で写真をアップロードしたい俺達は
Search
Yoshihiro WADA
July 15, 2018
Programming
0
2.4k
半自動で写真をアップロードしたい俺達は
2018/7/15に開催された高専カンファレンス in 東京 2018にて発表した「半自動で写真をアップロードしたい俺達は」のスライドになります
Yoshihiro WADA
July 15, 2018
Tweet
Share
More Decks by Yoshihiro WADA
See All by Yoshihiro WADA
Gradleの実行環境設定を見直す
e10dokup
0
700
Firebase App Distributionのテストアプリ配信を試しやすくする
e10dokup
0
490
アプリに署名する 〜GitHub ActionsでのCIも見据えて〜
e10dokup
0
1k
Profileable buildでより正確なパフォーマンスを掴む
e10dokup
0
670
[DroidKaigi 2021] メディアアクセス古今東西 / Now and Future of Media Access
e10dokup
0
3.2k
今更「dp」を考える / Let's think about "dp" now
e10dokup
0
5.3k
1から学ぶAndroidアプリデバッグ - アプリの動作を追いかけよう / Learn Android application debugging from the scratch - track apps' behaviors
e10dokup
10
3k
Guide to background processingを読んでみる / Reading "Guide to background processing"
e10dokup
0
250
よしなに頑張る画像ロードの話 / image load mettya tsurai
e10dokup
2
460
Other Decks in Programming
See All in Programming
PLoP 2024: The evolution of the microservice architecture pattern language
cer
PRO
0
1.7k
[PyCon Korea 2024 Keynote] 커뮤니티와 파이썬, 그리고 우리
beomi
0
110
カラム追加で増えるActiveRecordのメモリサイズ イメージできますか?
asayamakk
4
1.6k
JaSST 24 九州:ワークショップ(は除く)実践!マインドマップを活用したソフトウェアテスト+活用事例
satohiroyuki
0
260
僕がつくった48個のWebサービス達
yusukebe
18
17k
RailsのPull requestsのレビューの時に私が考えていること
yahonda
5
1.7k
PagerDuty を軸にした On-Call 構築と運用課題の解決 / PagerDuty Japan Community Meetup 4
horimislime
1
110
Outline View in SwiftUI
1024jp
1
160
PHP でアセンブリ言語のように書く技術
memory1994
PRO
1
150
Importmapを使ったJavaScriptの 読み込みとブラウザアドオンの影響
swamp09
4
1.2k
Content Security Policy入門 セキュリティ設定と 違反レポートのはじめ方 / Introduction to Content Security Policy Getting Started with Security Configuration and Violation Reporting
uskey512
1
430
Java ジェネリクス入門 2024
nagise
0
610
Featured
See All Featured
Speed Design
sergeychernyshev
24
570
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
GraphQLの誤解/rethinking-graphql
sonatard
66
9.9k
[RailsConf 2023] Rails as a piece of cake
palkan
51
4.9k
Building an army of robots
kneath
302
42k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
107
49k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
7.9k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.1k
The Invisible Side of Design
smashingmag
297
50k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
4 Signs Your Business is Dying
shpigford
180
21k
Why You Should Never Use an ORM
jnunemaker
PRO
53
9k
Transcript
半⾃動で写真をアップロード したい俺たちは どくぴー @e10dokup ⾼専カンファレンス in 東京 2018 (2018/7/15) @
DMM.com
突然ですが本⽇1時頃の画像を御覧ください
突然ですが本⽇1時頃の画像を御覧ください 時間がな…⾜りなかったんや…
• 和⽥ 佳⼤ / どくぴー / @e10dokup • みぎの へんなのが
めじるしだ ! • 明⽯⾼専 → 神⼾⼤学 → サイバーエージェント(今) • kosen10s っていう変な集団にいます • イベント運営巻き込まれおじさん • DroidKaigi • 情報科学若⼿の会 • etc. • 趣味:カメラ、ガジェット、レース観戦、レースゲーム ⾃⼰紹介 ʗΒʔΜʘ
• 和⽥ 佳⼤ / どくぴー / @e10dokup • みぎの へんなのが
めじるしだ ! • 明⽯⾼専 → 神⼾⼤学 → サイバーエージェント(今) • kosen10s っていう変な集団にいます • イベント運営巻き込まれおじさん • DroidKaigi • 情報科学若⼿の会 • etc. • 趣味:カメラ、ガジェット、レース観戦、レースゲーム ⾃⼰紹介 ʗΒʔΜʘ
None
カメラ
• PENTAX K-S2を買っただけだと思っていた2年前 • 気付いたらレンズが3本増え • Sony α7IIが増えレンズの価格に震えおののき • 社内では広報なの?って⾔われるように
沼にハマった
不注意で機材が 多様化してしまった
None
楽しい!!
でもいろいろやっていると問題も… よ〜〜〜し、いっぱい撮ったし アップロードしちゃうぞ〜〜
でもいろいろやっていると問題も… よ〜〜〜し、いっぱい撮ったし アップロードしちゃうぞ〜〜
でもいろいろやっていると問題も… おおん
アップロード 割とダルい問題
• いっぱい撮った写真のアップロード⽅法 • (厳選する) • 今回はここには⽬をつむることとする • Google PhotosやFlickrにD&Dして上がるのを待つ •
稀によく途中で失敗して悲しい気持ちになる • イベントなんかで写真をとる⼈になるとその⽇のうちに上げ ろ!とか⾔われる • 正直帰ってきたら眠くてそれどころではない アップロード割とダルい問題
我々は半⾃動で アップロードを したいのだ
考えていきましょう
• SDカードからPC等のデバイスに持っていきたい • カメラについてきているWi-Fi機能を使う • カメラがアクセスポイントにしかならないやつもあるので なんか微妙 • そもそも各社の連携アプリが… :thinking_face:
• PCにマウントしたら撮った写真を捜索するスクリプトを書く • えっ、PC⽴ち上げるの…? 撮影写真取得の部
今回は…
• みんな「使える!!」「これは遊べる!!」って思って買った もののあまり使っていないおもちゃ個⼈的第1位 今回思いついた作戦
• みんな「使える!!」「これは遊べる!!」って思って買った もののあまり使っていないおもちゃ個⼈的第1位 今回思いついた作戦 東芝 FlashAir
• Wi-Fiにつながったり、Luaでスクリプトを組めたり、GPIOが 喋れたりする不思議なSDカード • 今だと64GBが6000円くらい • ⼦機としてルータにぶら下げられるので、FlashAirから写真を 取得する端末はネットに繋がったままにしていられる • FlashAirの死活管理(?)的なことをしつつ、LAN内にFlashAir
が⾒つかったらFlashAirから写真をもらってくると⾏けそう FlashAir is
• 取得した写真を即座にアップロードしたい • 可能ならばPCを起動させずに • そこらへんの⼩型端末を使うのが⼀番良さそう • Android端末 • どうせ古い端末がいっぱい余っている
• Raspberry Pi • みんな買ったけど積んでいるのがありそう 撮影写真アップロードの部
• ではどこにアップロードしよう…? • Google Photos • API経由でのオリジナル画質でのアップロードが不能 • Picassa Web
APIで圧縮画質なら上げられはするが… • Flickr • APIはちゃんとある、オリジナル画質でも⼤丈夫 • JavaのWrapperがあるにはあるが最終更新が2014年… 撮影写真アップロードの部 ところが
きちゃった♡
• Google I/O 2018でロンチ • Google OAuth2によるユーザ認証 • AndroidならTokenがスパッともらえる、楽 •
Picasa APIでは出来なかったオリジナル画質アップロードに ようやく対応 • もはや個⼈的にこれを使いたい • 使いたいドリブン • 割とみんなGoogle Photosだし… Google Photos API爆誕
APIも多様化 するのだ
• FlashAirがLAN内で⾒つかったらファイル⼀覧を取得 • ファイル⼀覧をたどってFlashAirから端末にファイルを取得 • 取得したファイルをGoogle PhotosにAPI経由でアップロード というわけで作戦 ϧʔλ
FlashAir ↓ 端末
• FlashAirのIPアドレス以降にパスをつなげてHTTP GETすること でファイルを取得できる • ファイル⼀覧は…? • FlashAirにはデフォルトで command.cgi というCGIが装備さ
れており、このCGIにリクエストを送ることでいろいろな情報 が得られる • ファイル⼀覧が欲しい場合はクエリパラメータとして op=100 を、参照ディレクトリに dir=<ディレクトリ> を与える FlashAirからファイルを取得する
• 例:FlashAir直下のDCIMの中が⾒たい •/command.cgi?op=100&DIR=/DCIM FlashAirからファイルを取得する WLANSD_FILELIST /DCIM,100__TSB,0,16,19636,32038 /DCIM,101_0520,0,16,19636,32409 /DCIM,102_0521,0,16,19637,691 /DCIM,103_0523,0,16,19639,18575 /DCIM,104_0524,0,16,19640,35744
/DCIM,105_0525,0,16,19641,23418 /DCIM,106_0715,0,16,19695,2351
• 例:FlashAir直下のDCIMの中が⾒たい •/command.cgi?op=100&DIR=/DCIM FlashAirからファイルを取得する WLANSD_FILELIST /DCIM,100__TSB,0,16,19636,32038 /DCIM,101_0520,0,16,19636,32409 /DCIM,102_0521,0,16,19637,691 /DCIM,103_0523,0,16,19639,18575 /DCIM,104_0524,0,16,19640,35744
/DCIM,105_0525,0,16,19641,23418 /DCIM,106_0715,0,16,19695,2351 QBUI pMFEJS EBUF UJNF
• ファイル⼀覧が取得できたらレスポンスからパスとファイル名 を組み合わせればそのまま画像が取得できる • 「ここまではすでに取得したし…」みたいなことをやるには • dateとtimeがあるので⼀番最後に取得したファイルについて これを保持して、古いと判断できるものは無視する • 詳しくはFlashAir
Developersに書いてあるので検索だ! FlashAirからファイルを取得する
端末 ↓ Google Photos
• Google Photos APIはGoogle APIの1つなのでGoogle Cloud Consoleから有効にする必要がある • AndroidアプリかWebアプリかでOAuthのやり⽅が違うので 注意
• 今回はAndroidなのでGoogle Play Servicesで楽にやったよ • ただしAccess Tokenを引き出す処理を追加で書く必要あり Google APIを使えるようにする
• https://photoslibrary.googleapis.com/v1/uploads にPOSTで 次のデータを送りつける • Authorization: Bearer <Token> • Content-Type:
application/octet-stream •X-Goog-Upload-File-Name: <ファイル名> •画像のバイナリ(body) • 成功するとアップロードトークンがもらえる • この時点でアップロードは未完了 取得した写真をアップロードする
• https://photoslibrary.googleapis.com/v1/ mediaItems:batchCreate に次のデータをPOST • Authorization: Bearer <Token> • Content-Type:
application/json •先程のアップロードトークンを含めた次のJSON 取得した写真をアップロードする {“newMediaItems”:[ { “simpleMediaItem":{ “uploadToken":"CAIS6QIApKFirX....." } } ]}
アップロードできているか確認する ඇѹॖ &9*'ͬͯΔ
• いっぱい画像があるとキューイングとかしないと⾏けない • たくさんダウンロードしてメモリにいっぱい展開して端末が 爆発して死んでいってしまう • 結論スマホになってしまっている • ちゃんとアプリ開発してビューアにするなら良いが… •
⾃動アップロード中は煌々と画⾯が光る。邪魔。 抱えた問題点
そこで
Android Things
• AndroidベースのIoTプラットフォーム • Raspberry Pi 3やNXP i.MXシリーズで動作する • 新品フルキットだと199USDくらい •
Google I/O 2018の前⽇に突如stableになった • 普段のAndroid開発とほぼ同じ⽂脈で開発できる • RPiならNetwork ADBでAPKをインストール • i.MXならUSB-CでADB Android Things
• 画⾯が存在しない状態にできる! • GPIOが読める! • FlashAirのGPIOの出⼒をトリガにActivityに通知して FlashAirの画像を取得できる! • どこのご家庭にでもある! •
iなんとかPhoneしか持たないそこの貴⽅も きっと⼀台はRPiを持っているハズ Android Thingsならば…! ʘͲʁʗ
• Android Thingsは「単⼀Activity」のアプリのみ許容するはず • そもそもOAuthさせる時点で別のActivityが起動する… • OAuth認証で失敗しそう • Access Tokenをよそから流し込まないといけない
• ダサい • とはいえAndroidと同じ雰囲気で開発できるのは Android開発者としては嬉しい Android Things特有の制限があります ʘ͢·Μͷʗ
• ついにGoogle Photosに⾮圧縮で画像をAPI経由でぶん投げられ るようになりました • FlashAirと組み合わせてラクラク半⾃動アップロードマシン • ただなんとなく仕組みを⽤意しただけなのでちゃんと使えるも のにしたい •
現状のコードと仕組みを⾒たければこの後のお時間で… • FlashAirの設定がめんどくさいのでデモはつらい • 忙しさの⽬測を⾒誤った結果地獄になったので気をつけよう まとめに
おわり