pixivFANBOX「見せない」技術 / Technology to keep contents private

2019.03.05 pixiv TECH SALONのLTとして発表した内容です。

pixivFANBOXのサービスでプライベートコンテンツ配信をいかに実現しているかについてサーバーの構成例を挙げて話しました。

Transcript

1. 「見せない」技術 pixiv TECH SALON lightning talk pixiv Inc.
2. 2 • 2016年4月 ピクシブ新卒入社 • pixivFANBOX立ち上げメンバー 主にコンテンツ管理・国際化など開発 • PHP・TypeScript中心にあちこち触ってます 趣味 プリキュア / 料理・スイーツ / アロマテラピー 園芸 / 温泉めぐり / 音楽 (ピアノ・ギター・歌) 北野貴章
3. • pixivFANBOXについて • コンテンツを「一部 ユーザー以外に見せない」話 • 動的画像変換プロキシ・キャッシング 機構を組み合わせる場合 注意点 詳細なコード 話 ほとんどしません 3 今回話すこと
4. 4 について https://www.pixiv.net/fanbox • ピクシブ 運営する クリエイター支援プラットフォーム • クリエイターに毎月一定額を支援して創作活動を支える • 2016年初期リリース後、 2018年4月に今 サービスに生まれ変わる • クリエイター 収入源 ひとつ ◦ 2019年2月現在クリエイター数 5万人突破 ◦ 支援金還元額5億円突破
5. 5 クリエイターに対して支援をしている一部 人だけにアクセスできる 、という 限定 コミュニティを提供することが重要 「URLをシェアすれ 誰でもアクセスできる」 サービスへ 不信につながる なぜ「見せない」ことが重要か
6. 6 • 保護するほど体験が下がる ◦ 専用ハードやソフトウェア 使用、など • ブラウザにダウンロードされている以上コピー 防げない DRMやコピーガード 技術 Webと相性が悪い 「URLを知り得たユーザーにアクセスさせない」程度 保護レベルを達成する 「コンテンツ保護」 いたちごっこ
7. 7 1. アクセス可能なネットワークを制限する (ex. 社内イントラ) 2. ワンタイムURLを認証後都度発行する (ex. S3 Presigned URL) ◦ URL 認証ごとに都度生成 ◦ 期限内であれ URL コンテンツ 誰でもアクセス可能 3. リソース URLごとに対して認証をかける ◦ URL リソース単位で一定 ◦ Webページと同じ方法（ブラウザセッションやトークンなど）が使える 画像・ファイルリソースに対して アクセス制御 で 初期要件で を一定にしたかったため、 を採用
8. 8 リクエストをアプリケーション(AP)で受けて、Sessionを用いて認証をかける APにコンテンツをプロキシさせると、 コンテンツを返し終わるまでIOがブロックされうる アプリケーション 認証機能 みに専念させたい アプリケーションを用いた都度認証 <?php echo file_get_contents(...);
9. 9 Nginxで、リクエスト後に内部リダイレクトを実現する仕組み。 特殊なヘッダをアプリケーションからレスポンスすることによって、内部的に設定されたパスに Nginxによってプロキシさせることが可能 HTTPに対応していれ バックエンド サービスによらず使える 200 OK Content-Type: image/jpeg X-Accel-Redirect: /_protected/image.jpeg
10. 10 ユーザー リクエスト 流れ
11. 11 略図
12. 12 location /_internal/fanbox/ { internal; proxy_pass http://...; } Nginx設定
13. 13 session リクエスト開始 認証処理
14. 14 認証失敗
15. 15 認証成功 200 OK Content-Type: image/jpeg X-Accel-Redirect: /_internal/fanbox/xxx.jpeg
16. 16 内部リダイレクト AP レスポンス 既に終了
17. 17 動的画像変換・キャッシング
18. 18 • サイト デザインにあわせて最適なサイズ 画像を効率よく返すため 画像変換プロキシを使っている • ピクシブ製 画像変換サービス「 ImageFlux」で使っている 画像変換サーバーを社内ネットワーク用に設定 し運用 オブジェクトストレージ レスポンス 遅いため、 できるかぎりキャッシュしたい 画像 動的変換・キャッシュサーバー
19. 19 縮小画像 リクエスト
20. 20 認証成功 200 OK Content-Type: image/jpeg X-Accel-Redirect: /_internal/fanbox/c/400/xxx.jpeg
21. 21 キャッシュ 探索 ヒットなし
22. 22 動的画像変換 キャッシュ生成
23. 23 次回アクセス時 ヒット
24. 24 Cache-Control ヘッダに注意
25. 25 • pixivFANBOXで ユーザー アップロードしたコンテンツに対するアクセス制限 を紹介 • Nginx X-Accel機能を使っており、バックエンド サービスによらず 使える • 動的画像変換プロキシを使う場合も対応できる • キャッシングを用いる場合 Cache-Controlヘッダ 制御について 注意が必要 まとめ