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.6k
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
850
テキストエディタのブラウザ実装 / tokyo_study
oliver_diary
0
320
迫り来る絶望的状況からの脱却物語 / #CEDEC2021
oliver_diary
7
16k
PWAとクラウドゲーミングの現状そしてPWAとOOParts
oliver_diary
3
12k
OOPartsによるPWA事例紹介
oliver_diary
2
9.8k
クラウドゲーミング最新開発事例 - #CEDEC2020
oliver_diary
6
17k
クラウドゲーミング時代のPWA
oliver_diary
0
12k
OOPartsが切り開く クラウドゲーミング ✖︎ PWA
oliver_diary
4
16k
今日から始めるFirestoreのテスト
oliver_diary
2
11k
Other Decks in Technology
See All in Technology
神回のメカニズムと再現方法/Mechanisms and Playbook for Kamikai scrumat2025
moriyuya
4
520
自動テストのコストと向き合ってみた
qa
0
110
英語は話せません!それでも海外チームと信頼関係を作るため、対話を重ねた2ヶ月間のまなび
niioka_97
0
110
o11yで育てる、強い内製開発組織
_awache
3
120
AWSにおけるTrend Vision Oneの効果について
shimak
0
120
E2Eテスト設計_自動化のリアル___Playwrightでの実践とMCPの試み__AIによるテスト観点作成_.pdf
findy_eventslides
0
110
"複雑なデータ処理 × 静的サイト" を両立させる、楽をするRails運用 / A low-effort Rails workflow that combines “Complex Data Processing × Static Sites”
hogelog
3
1.9k
[2025-09-30] Databricks Genie を利用した分析基盤とデータモデリングの IVRy の現在地
wxyzzz
0
470
空間を設計する力を考える / 20251004 Naoki Takahashi
shift_evolve
PRO
3
330
VCC 2025 Write-up
bata_24
0
180
M5製品で作るポン置きセルラー対応カメラ
sayacom
0
150
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
2
5.4k
Featured
See All Featured
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Being A Developer After 40
akosma
91
590k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
A designer walks into a library…
pauljervisheath
209
24k
Side Projects
sachag
455
43k
Code Review Best Practice
trishagee
72
19k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
How GitHub (no longer) Works
holman
315
140k
Designing for humans not robots
tammielis
254
25k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
188
55k
Embracing the Ebb and Flow
colly
88
4.8k
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पΓͷ·ͨͲ͔͜Ͱ