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
Cacheable Presigned URL with Cloudflare Workers
Search
oliver
October 06, 2023
Technology
2
7.9k
Cacheable Presigned URL with Cloudflare Workers
2023年10月06日「Cloudflare Meetup Nagoya 第3回」にて発表した資料。
https://cfm-cts.connpass.com/event/294096/
oliver
October 06, 2023
Tweet
Share
More Decks by oliver
See All by oliver
comilioとCloudflare、そして未来へと向けて
oliver_diary
6
1k
テキストエディタのブラウザ実装 / tokyo_study
oliver_diary
0
320
迫り来る絶望的状況からの脱却物語 / #CEDEC2021
oliver_diary
7
16k
PWAとクラウドゲーミングの現状そしてPWAとOOParts
oliver_diary
3
12k
OOPartsによるPWA事例紹介
oliver_diary
2
10k
クラウドゲーミング最新開発事例 - #CEDEC2020
oliver_diary
6
17k
クラウドゲーミング時代のPWA
oliver_diary
0
13k
OOPartsが切り開く クラウドゲーミング ✖︎ PWA
oliver_diary
4
17k
今日から始めるFirestoreのテスト
oliver_diary
2
12k
Other Decks in Technology
See All in Technology
Axon Frameworkのイベントストアを独自拡張した話
zozotech
PRO
0
150
なぜThrottleではなくDebounceだったのか? 700並列リクエストと戦うサーバーサイド実装のすべて
yoshiori
13
4.7k
ステートレスなLLMでステートフルなAI agentを作る - YAPC::Fukuoka 2025
gfx
8
1.3k
JAWS-UG SRE支部 #14 LT
okaru
0
110
[mercari GEARS 2025] なぜメルカリはノーコードを選ばなかったのか? 社内問い合わせ工数を60%削減したLLM活用の裏側
mercari
PRO
0
120
Redux → Recoil → Zustand → useSyncExternalStore: 状態管理の10年とReact本来の姿
zozotech
PRO
16
8.6k
Black Hat USA 2025 Recap ~ クラウドセキュリティ編 ~
kyohmizu
0
550
大規模モノレポの秩序管理 失速しない多言語化フロントエンドの運用 / JSConf JP 2025
shoota
0
190
明日から真似してOk!NOT A HOTELで実践している入社手続きの自動化
nkajihara
1
800
re:Invent2025 事前勉強会 歴史と愉しみ方10分LT編
toshi_atsumi
0
140
JJUG CCC 2025 Fall バッチ性能!!劇的ビフォーアフター
hayashiyuu1
1
350
re:Invent完全攻略ガイド
junjikoide
1
370
Featured
See All Featured
Java REST API Framework Comparison - PWX 2021
mraible
34
9k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
118
20k
Git: the NoSQL Database
bkeepers
PRO
432
66k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
2.9k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
36
6.1k
Docker and Python
trallard
46
3.6k
What's in a price? How to price your products and services
michaelherold
246
12k
Writing Fast Ruby
sferik
630
62k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Transcript
Cloud fl are Meetup Nagoya ୈ3ճ Cacheable Presigned URL with
Cloudflare Workers 2023/10/06 oliver
ࣗݾհ • גࣜձࣾϢʔπʔςοΫʢද / ιϑτΣΞΤϯδχΞʣ • લલ৬ࠂ৴ɺલ৬Ϋϥυήʔϛϯά • Cloud fl
areલ͔Βͣͬͱ͔͚͍ͬͯΔ • ͱ͋ΔࣄͰେྔͷը૾৴ΛηΩϡΞͳঢ়ଶͰ৴͢Δٕज़͕ඞཁͱͳͬ ͍ͯΔʢͷͰɺࠓճͷLTͰݕূ݁ՌΛൃද͠Α͏ͱࢥͬͨʣ minakawadaiki.com
ը૾৴ʹCloudflareΛ બ͢Δ1൪ͷཧ༝
σʔλΤάϨεྉ͕ۚ 0ԁ͔ͩΒ https://www.cloud fl are.com/ja-jp/learning/cloud/what-are-data-egress-fees/
֎෦ʹஔ͔ΕͯΔը૾Λ CloudflareͰϓϩΩγ͢Δ
֎෦ʹஔ͔ΕͯΔը૾ΛCloudflareͰϓϩΩγ͢Δ • ύλʔϯ1ʢDNSΛCloud fl areͰཧͰ͖Δ߹ʣ • DNS ProxyΛઃఆͯ͋͛͠ΕOK • Ωϟογϡͤͨ͘͞ͳ͍ͷ·ͰΩϟογϡͤ͞ͳ͍Α͏ʹҙ
https://developers.cloud fl are.com/support/third-party-software/others/con fi guring-an-amazon-web-services-static-site-to-use-cloud fl are/
֎෦ʹஔ͔ΕͯΔը૾ΛCloudflareͰϓϩΩγ͢Δ • ύλʔϯ2ʢDNSΛCloud fl areͰཧͰ͖ͳ͍߹ʣ • Cloud fl are WorkersͰΩϟογϡͯ͋͛͠Δ
• Workersͷݺͼग़͠ྉ͕͔͔ۚΔͷͰҙ • 1͋ͨΓ10ສ݅ͷϦΫΤετ·Ͱແྉʢ202310݄6࣌ʣ • ϦΫΤετ100ສ݅͋ͨΓֹ݄0.15υϧʢ202310݄6࣌ʣ https://developers.cloud fl are.com/workers/examples/cache-api/
DNSΛCloudflareͰཧͰ͖ͳ͍߹ https://<workers-path>/image?src=https://<image-path>
Cloudflare্͚ͩͰը૾৴͢Δ
Cloudflare্͚ͩͰը૾৴͢Δ • ύλʔϯ̍ʢCloud fl are ImagesΛ͏ʣ • ը૾֨ೲ10ສ͋ͨΓ$5ʢ202310݄6࣌ʣ • ը૾৴10ສ͋ͨΓ$1ʢ202310݄6࣌ʣ
• ༷ʑͳը૾ૢ࡞ʢϦαΠζͳͲͷฤूʣ͕URLͰՄೳ • Workers + R2ͱൺͯগׂ͠ߴͳҹ https://www.cloud fl are.com/ja-jp/developer-platform/cloud fl are-images/
Cloudflare্͚ͩͰը૾৴͢Δ • ύλʔϯ̎ʢCloud fl are Workers + R2Λ͏ʣ • R2ͷྉۚʢಡΈऔΓʹ͔͔Δ෦͚ͩهࡌʣ
• ετϨʔδ: $0.015 / GB ετϨʔδ • ΫϥεBૢ࡞ɿطଘͷঢ়ଶΛಡΈऔΔ: $0.36 / 100ສ • ը૾ૢ࡞WorkersͰผ్՝ۚ͢ΕՄೳ https://developers.cloud fl are.com/r2/api/workers/workers-api-usage/
Cloudflare Workers + R2Λ͏ https://<workers-path>/< fi le-name>/with-cache ͜͜ͰΩϟογϡ͍ͤͯ͞Δ
ॺ໊͖URLͰը૾ΛकΔ
ॺ໊͖URLͰը૾ΛकΔ • Ϣʔεέʔε • ಛఆͷ৫ʹॴଐ͍ͯ͠Δਓ͚͔ͩ͠ݟΕͳ͍ը૾ • Notionͷը૾ͱ͔GitHubͷը૾ͱ͔ • ອըͳͲΛߪೖͯ͠ઐ༻ͷReaderͳͲͰಡΉ߹ •
kindleͱ͔ͦͷଞອըΞϓϦͱ͔ https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/userguide/ShareObjectPreSignedURL.html
ॺ໊͖URLͰը૾ΛकΔ ᶃ ݖݶʹج͍ͮͯॺ໊͖URLΛൃߦ͢Δ ᶄ ॺ໊Λݕূ͠ը૾ΛϨεϙϯε ॺ໊͖URLൃߦαʔόʔ ը૾ετϨʔδ https://<domain>/<image-path>/verify?mac=<MAC>&expiry=<number>
WorkersͰ࣮͢Δ
WorkersͰ࣮͢ΔʢURLੜʣ https://developers.cloud fl are.com/workers/examples/signing-requests/ • `/:image/generate` ͰΞΫηεΛͪड͚Δ • generateSignedUrlؔͰ࡞ͨ͠ॺ໊͖URLΛΫϥΠΞϯτʹϨεϙϯε
WorkersͰ࣮͢ΔʢURLੜʣ https://developers.cloud fl are.com/workers/examples/signing-requests/ • Web Crypto API ͰΩʔΛੜ •
ΞϧΰϦζϜॺ໊͖URLͰΑ͘༻͍ΒΕΔ HMAC-SHA256Λ࠾༻ • HMACڞ௨伴҉߸ํࣜͳͷͰ ॺ໊ଆͱݕূଆͰಉ͡ΩʔΛ༻͍Δ • ॺ໊URLʹ࠷ݶඞཁͳใɺͦͷURLͷ༗ޮظݶͱΞΫ ηεൣғʢ ࠓճͰ͍͏ͱ `url.pathname` ʣͰ͋ΓɺͦΕΒ ΛؚΊͯॺ໊͍ͯ͠Δ • ॺ໊ͯ͠ੜ͞ΕͨMACΛURLʹؚΊΔͨΊBase64ʹม • `+`จࣈURLʹؚΊΔͱόάΛੜΉͨΊɺ `-` ʹม • URLͷQuery ParamsʹMACͱ༗ޮظݶʢexpiryʣΛ༩
WorkersͰ࣮͢Δʢը૾ΞΫηεʣ • ॺ໊͖URLʹ༩͞Ε͍ͯΔMAC ͱexpiryΛ༻͍ͯɺ`verifySignedUrl` ؔΛ࣮ߦʢৄࡉ࣍ϖʔδʣ • ʮॺ໊͕ਖ਼͍͠ʯ͔ͭʮͦͷॺ໊͕ ༗ޮظݶʯͰ͋Δ͔ΛνΣοΫ • R2͔Βը૾Λऔಘ͠ɺϨεϙϯε
https://developers.cloud fl are.com/workers/examples/signing-requests/
WorkersͰ࣮͢Δʢը૾ΞΫηεʣ • ݕূ༻ͷڞ௨伴Λ࡞͢Δ • URLͰड͚औͬͨMACΛBase64͔Βม • ॺ໊ʹར༻ͨ͠ ʮ`${url.pathname}@${expiry}`ʯΛੜ • ॺ໊Λݕূ
https://developers.cloud fl are.com/workers/examples/signing-requests/
Ωϟογϡ༗ແͰͷΛൺֱ͢Δ
R2 from Workers with no cache ntimes 10 -- curl
‘https://<worker-domain>/<image-path>/no-cache’ --compressed -o /dev/null -w "%{time_total}\n" -s | percentile
Presigned URL With R2 ntimes 10 -- curl ‘https://<r2-domain>.r2.cloud fl
arestorage.com/images/<image-name>?X-Amz-Expires=3600&X-Amz-Date=20231005T200233Z &X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=<credential> &X-Amz-SignedHeaders=host&X-Amz-Signature=<sig>’ --compressed -o /dev/null -w "%{time_total}\n" -s | percentile
R2 from Workers with cache ntimes 10 -- curl ‘https://<workers-domain>/<image-path>/with-cache’
--compressed -o /dev/null -w "%{time_total}\n" -s | percentile
Public bucket on R2 ntimes 10 -- curl ‘https://<public-r2-domain>/images/<image-name>’ --compressed
-o /dev/null -w "%{time_total}\n" -s | percentile
Λൺֱ͢Δʢ20MBͷը૾ʣ Workers with no cache Presigned URL Workers with cache
Public bucket 0 0.3 0.6 0.9 1.2 S S S S S
ຊ
Cacheable Presigned URL with Cloudflare Workers
ΩϟογϡՄೳͳॺ໊͖URL • ͳͥඞཁ͔ • R2ͱ͍͑ɺΩϟογϡ͞Εͯͳ͍ը૾Ϩεϙϯε͕͍ • R2ͷಡΈऔΓΑΓWorkersͷݺͼग़͠ͷํ͕ίετ • Βͳ͚Ε͍͚ͳ͍͜ͱ •
ॺ໊͖URLͷϩδοΫʹΩϟογϡॲཧΛՃ • ॺ໊͖URLΛ࡞͢ΔࡍͷexpireΛௐ͢Δ
ॺ໊͖URLͷϩδοΫʹΩϟογϡॲཧΛՃ • ॺ໊ͷݕূʹޭͨ࣌͠ʹΩϟογϡ͔ Βऔಘ͢ΔίʔυΛՃ • Ωϟογϡ͕ͳ͍߹R2͔Βը૾Λऔ ಘ͠Ϩεϙϯε͢Δ
ॺ໊͖URLΛ࡞͢ΔࡍͷexpireΛௐ͢Δ https://advancedweb.hu/cacheable-s3-signed-urls/
ॺ໊͖URLΛ࡞͢ΔࡍͷexpireΛௐ͢Δ • ࠓճ؆қతʹʮ࣍ͷX࣌0 + 10sʯ Λ༗ޮظݶͱͨ͠ॺ໊͖URLΛ ࡞͍ͯ͠Δ • ཁ͢Δʹ13࣌15ʹੜ͞ΕΔॺ໊URL ͱ13࣌59ʹੜ͞ΕΔॺ໊͖URL͕
ಉҰʹͳΔ͜ͱͰΩϟογϡ͞ΕΔΑ͏ ʹͳΔ
UploadपΓͷ·ͨͲ͔͜Ͱ