TOTPソフトウェアトークンなブックマークレット

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

TOTPがマイブームだ BookMarkletで任意のドメインに設定できないかやってみるのも一興ではないか64KB以内に収められれば俺様大勝利！

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

github.com/cozmo/jsQR/blo… うーんでけぇなぁ ってソース見てたら中にSJISコード表が全部入って居るのか・・・そりゃでかいわな。 SJIS外したら結構小さくなるんちゃうんちゃうん。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

素直にJSONにしたら97.6kb バイナリBASE64Urlにしたら37.6kb うーんもっと小さくならないかな。 1byte目:81(129)-FC(252)=123=7bit幅 2byte目:40(64)-FC(252)=188=8bit幅 うーん無理だなぁ。 表のサイズは28148byteなので 画像ファイルRGBA84x84ドットで表現は可能でPNG圧縮したらええんかな？

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

というわけで、pngにしたらbase64でも10kbも減ってて草。 1kbの投資で10kb減るならやってもええんとちゃうんちゃうん。容量は64kbしかないからね。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

あー忘れてたわ…アルファチャンネルを255にしないと丸められてしまうやつ… 4じゃなくて3だわ・・・rgbaでええんよな？ って、rgbaだったわ。 おかげでなんとかなったが、問題はあるなぁ・・・ 圧縮したブラウザがsRGBのカラープロファイルに対応するかどうかで挙動が変わる…

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

ちまちまやっているが82kbまで来た 残り20kb行ければブックマークレットに乗る。 正直SJISのサポートやめたら37kb一気に消えるのでそれで良いんちゃうんちゃうん？QRコードでバイナリを使えるのに今どきSJISとか使わんやろ！？という本質問題。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

要するにjsQRのオリジン版（webpack梱包版256.7kb） で、ESmodule版（ESmoduleとしてブラウザで動くよ107kb） 手でminifyしたよ版(82kb※改行とtabを消せば70kb) にKanjiサポートやめたよ版(約32kb)があれば良いのか。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

Kanjiサポートやめたよ版(33.7kb) Kanjiサポートやめたよ版の改行とタブ取ったよ版(28.7kb) やったぜ！

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

あとはBase32とTOTPをちょろっと書いておしまいか。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

base32は出来た。 totpも出来た。ここまでで9kb ここに、Dom操作基盤、暗号化、圧縮ロジックも乗っけてと。 developer.mozilla.org/ja/docs/Web/AP… これで画面キャプチャ機能を付けてQRコードを読めればOKか。 で、bookmarkletとして64kb以内になればOKOKと。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

ブックマークレットはまあ簡単やな。 で画面のQRコードを取る方法や！ はこの例を見たほうが早そうやな・・・ ※公式ドキュメントはまずは動くにたどり着くのがなかなかハードルが高い。特にユースケースが複数のAPIをまたがる場合にはあっちみてほいほいこっちみてほいと crunchtimer.jp/blog/18169

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

すごく精神力を使う・・・ うーむ。出来てるんだがあと少し出来ない。 今週中には完成できるか！？

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

QRコード読めるか確認だ！ とかqrcode.jsをいじっていたら、どうもQRコードに出来ない文字列長さが存在するっぽくて、軽量化で手動マングリングが悪いのかで切り分けに時間がかかってしまった… これは罠だよなぁ。内容によっては何でPaddingするか変わるから例外投げるのは分かる。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

191~216byteあたりが正常に生成出来ないっぽいな。1344byte以降も駄目と。 ※エラー訂正レベル最高での数値 まあわかっていれば回避できるのでコレでいいや。 あとjsQRも全部のQRコードを解釈できる訳じゃないしなぁ…なかなか完全性が低い

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

まあ基本は出来た。 次はExport機能か。 愚かしい人類への迎合として何処までも利便性に振り切った危険ツールを作れるゾイ！ （TotpのシークレットExport機能って何だよ！？感あるよねｗｗｗ、お前、それ秘密って言うｗｗｗ）

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

画面キャプチャ API developer.mozilla.org/ja/docs/Web/AP… ・Video要素に流し込める ・しかし最初のワンショットしか取れない ・動画を流す方法が不明※このサイト内では作動するのでなにかに引っかかている。 ・可能性としては動的Video要素が駄目？→HTMLに入れても駄目 ・ボタン押す前にVideo要素必要？→駄目

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

調べた結果 autoplayプロパティが無いだけだった・・・ なんなんや・・・

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

スキャン、スキャンができるぞ・・・！ これってぇ もしかしてぇ Bookmarkletでぇ GAS鯖経由でシグナリングしてぇ 画面の中継ができちゃうってぇ ことぉ？ これはスマホでお手軽な監視カメラが作れるニャー。 GASへのシグナリング基礎データはQRコードでええやろ。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

うむ。微調整は有るにせよ、あとはSVGなQRコードファイルの読み込み機能だけやな…一回読み込んだファイルは画像にして保管しておけばいいし。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

SVGってFileAPIでDataSchemeURI形式で読み込んだらそのままCanvasで表示できるのな… 当然と言えばそうだけど、なんかsvg要素から読み込みが云々を見てもやもやしていた。が、そんな事はどうでも良かった・・・ じゃああとは表示部分を整形、各種ブラウザでテストしたら終了か。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

これだけカジュアルにQRコードを使えるなら 1000円ジャンクスマホかラズパイZERO＋カメラでドアスコープ越しにTOTP認証を使ったスマートロックを作れるんじゃなかろうか もちろん、一回オンラインにしたあとはずっとオフラインでいいし。手入力しないからTOTPの桁数をMAXにしたらえんちゃうんちゃうん

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

まあ、だいたい出来た。 WinAuthの半分ぐらいは動くと期待してよいのではないか。 github.com/ryunosinfx/Boo… あとはドキュメントを整備してGithubPagesで公開したらオシマイやな。 あー時間がかかるのう。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

Firefoxのブックマーク、62452byteが限界やったぞ・・・3kbも想定より少ないのだが何が原因なのだろうか。あと、ユニコード文字が交じるとまずいということでBase64URL化はしたのだが、そうじゃなかった。 一方で無駄にBASE64URLの文字列だけ追加すると65536byteまで行ける。謎い。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

あとはグローバルスコープに無名でない関数定義して呼ぶ場合を考えると何度でも変数宣言できるvarがよい（varの使いみち！） うーんでも、既に先客が居たら起動できないし、起動先がぶっ壊れちゃうね…やっぱり無名関数にするか。

汝、翼を与える＠ばってん先に翼ばくれんね イベント・・（parody） @ryunosinfx

neoblog.itniti.net/firefox-bookma… ブックマークレットもCSPで設定したらパージが可能なのは知っている。 しかし、クライアントの紳士協定であるCSPを殺してしまえばいいし、そのために専用に別プロファイルで起動してしてしまえばいい。 なお、かなりガチガチのXでも起動できたので夢はひろがリング