Workers Tech Talks #1 - Gyazo の素朴な Workers 2023-07-19 (Wed) 日比谷
15分 -> 20分
hiroshi.icon 右側の２つ目のアイコンから Start Presentation を選択するとスライド的に見えます
自己紹介
https://gyazo.com/34810c871e8e8dff6a2a2abfe698cac0
株式会社 Helpfeel
去年の10月ぐらいに Nota から社名変更
Gyazo, Scrapbox, Helpfeel の会社
齋藤 宏
Gyazo 開発チーム エンジニア
app バックエンド側、インフラ, etc
その昔はプレステ2でプラレールのゲーム作ったり
DHH による Rails 登場で web 系に
Gyazo と Cloudflare
Gyazo の origin server は GCP us-central1
半数以上のユーザーは北米
https://nota.gyazo.com/0b2d335925d705f7c0ff41c555378c48
Google Global HTTP Load Balancer だけだと高い
画像、動画、 assets (js, css など) を CDN でキャッシュ
さらに Partner Peering で GCP egress 料金が半額
Gyazo の素朴な workers
すごい簡単なことしかしてません
弊社CTOの秋山から話があったときは断ろうと思ったのですがが...
✌️akix.icon✌️
https://nota.gyazo.com/9307e06f24ebefa9a7b9b28eabcfac33
workers 触ったこと無いという方には参考になるかも?
DEMO
その場でキャプチャして画像リンクを別タブで開いて、アドレスバーを叩いてリロードさせると...
広告: Gyazo for macOS 最新版では status item が追加され、キーボードショートカットやタイマーなどの機能が実装されてます。
DEMO 失敗時
Gyazo 画像の例
https://gyazo.com/13e61bae9cccef6b8aa66001cd5c2b65 https://nota.gyazo.com/63858bb4a568cfd37e22d4ac3678a9c3
問題とアイデア
解決したい問題
画像直リンクだけシェアされると gyazo.com にたどり着けない
アイデア
Gyazo では画像配信用のサブドメインで CDN として Cloudflare proxy を利用
人間がブラウザで直リンク見てそうだったら画像バイナリのかわりに html を返す
歴史
2017 末ぐらいに弊社 CEO (rakusai) が直リンク開いたら html を返すという企みを思いつく
当初は cloudflare のサポートエンジニアに依頼して nginx 設定 (lua)を入れてもらう感じで進めようとしていた
https://nota.gyazo.com/04771ea04b438fc6a9717e6371c71d20
Cloudflare Workers GA!!
https://nota.gyazo.com/00cba10399468e7f81cb6f3460967e85 https://blog.cloudflare.com/cloudflare-workers-unleashed/
2018-05-17 ごろに運用開始? (5年前)
https://nota.gyazo.com/cd337a14fffb2ed641d07897ac0212d3
実装
https://nota.gyazo.com/332d360b074373113d6655eb762516aa
100行ぐらいの素朴な実装
以下の条件すべてに一致する場合は html を fetch して返す
A) Accept: の最初が text/html
B) User-Agent: がふつうのブラウザ
D) この worker が返す cookie を持ってるか?
そうでなければ、 event.request そのまま fetch して返す
response は画像バイナリ
運用
https://nota.gyazo.com/f39c3e334817334b04e81b8191d714db
当初は wrangler とか無かったので dash.cloudflare.com のエディタで preview して動いたら deploy
履歴管理できないので上記のような Makefile で
GET したコードを差分確認して git commit & git push
実は今でもそういう運用してます...
まとめ
すでに Cloudflare を proxy mode で使ってるなら workers 試すの簡単なのでみんなも素朴に使ってみましょう
Workers 感想
画像や動画のバイナリを扱っているのに遅延を感じないのはスゴイ
CDN, Reverse Proxy, Load Balancer の設定に自由を与えてくれる
Page rules などだけでは表現できないことがある
と思ったら、 Snippets というものが登場してたのでそっちでもいいかも?わからんけど
正直、ベンダロックされるのイヤなのでサービスのメインロジックは置きたくない
今回紹介した workers script も無くても Gyazo は動く
だけど、 KV, R2, D1 とかでアプリケーション実装可能になってきている
昔の Google App Engine みたいにアプリをさっと作れそう
株式会社 Helpfeel ではエンジニア募集しています
100% リモート, フレックス
100% 自社サービスの開発と運用
Helpfeel (サービス) チームのエンジニアを積極採用中
Gyazo, Scrapbox も応相談(だと思う)
エンジニアリングマネージャーもどうですか?
マシンよりヒトの気持ちがわかるあなた
Helpfeel Tech Conf 2023 Summer のお知らせ
テーマ: 一足先の未来を語ろう
生成AI ChatGPTのその後
モダンWeb技術
開催日: 2023/08/20(日)
もちろん参加費無料、懇親会もあります!!
helpfeel tech conf 2023 で検索すると出てくると思います!!
ちなみに過去開催で僕は Gyazo を GKE でどう運用してるかという話をしました
最後になりますが...
会場提供: クラスメソッドさんありがとうございます。
イベント開催: Cloudflare さんありがとうございます。