◆ 最近 localStorage に保存されてるチャットログなどが圧縮されるようになりました
◆ LZString.decompress という関数に通せば解凍できます  

Slack って最近流行ってるらしいチャットソフトがあります
ライトにですが使ってみて web でやるなら Skype より使いやすいと思います
個人とのチャットとグループチャット以外にチャンネルというこれまたグループチャットみたいなものもあってグループワークみたいのに向いてるようです


今回はこの Slack 関係です

webベースということもあって WebAPI が用意されています
ここでチャンネルのIDが必要になるのですが チャンネルのIDは普通に使っていて見えるものじゃないです
今のところ 9桁の英数字のようです

どうやって取得するのかわからなかったので 最初は websocket 通信を監視してそのデータから頑張ってチャンネルのIDを取り出してました

そのあとで localStorage にログが保存されてることに気づいたので ログのメッセージから判断するようにしました
最新のメッセージが一番最初にあるので Chrome の開発者ツールの一覧で見ていてわかりやすいです


ですが 最近になって localStorage のデータが圧縮されるようになりました
そのせいで 開発者ツールの一覧でみても文字化けしてるような文字が並んでるだけです

最初はブラウザのバージョン上げたせいで文字コードがおかしくなったのかなと思って SJIS → UTF8 などの変換を一通りかけてみたのですが 読める形式になるのがなかったので Slack の localStorage にアクセスしてるコード読んでいて 「compress」 という文字を見つけてちゃんと圧縮してるんだって気づきました

そこまでわかれば デコードする関数を見つけるだけです
LZString.decompress という関数がそれです
なので こんな風にすれば文字が読めます
LZString.decompress(localStorage.xxxxx)
xxxxx のところには localStorage のキーを入れます

全部をデコードして必要なのを探したいなら
for(var key in localStorage)
localStorage.hasOwnProperty(key) && console.log(key, localStorage[key].substr(0, 64))
全部出すとすごく長くなるので 64 文字だけ表示してます


これで 新しくチャンネルを作ってもIDがわかりますね




おまけ

localStorage への書き込みをどこのコードからしてるか どんな処理をしてから書き込んでるかを知りたいときに 大量の minify 済みコードからどうやってみつけるかについてです

JavaScript はコードが読めるし 基本は private なんてないですし ネイティブコードですら上書きできる便利仕様です

これを活かして localStorage.setItem を上書きします
上書きする関数の中身は なんでもいいですが debugger と書いておくと楽です
debugger と書いてない場合は 自分でそこに break point を付ける必要があります

これで localStorge.setItem が実行されると 一時中断になります
そのときの call stack を見ると どんな順番で関数が呼びだされて setItem まで来てるのかわかります
ここまでくれば setItem の引数に渡したデータがどうやって作られたのかを逆にたどっていくだけです


と まぁ コード読んで見つけたなんて言ってますが 実は読んだコードの行数なんて 100 行もあるかどうかです
さすがに minify されたコードを端から端まで読んで どこで圧縮されてるかを調べたりなんてしたくないですからね(笑