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
Cloudflare CDN + S3の静的Webホスティングをやってみた
Search
Kento Suzuki
March 18, 2023
Technology
0
240
Cloudflare CDN + S3の静的Webホスティングをやってみた
Cloudflare Meetup Fukuoka Kick Off!
https://cfm-cts.connpass.com/event/272936/
登壇資料
Kento Suzuki
March 18, 2023
Tweet
Share
More Decks by Kento Suzuki
See All by Kento Suzuki
上流工程に挑戦!「俺の考えた最強サーバレス構成」が一瞬で敗北した件
kentosuzuki
2
230
S3から始めるAWS 〜S3の簡単なユースケースの紹介〜
kentosuzuki
1
270
AWS のポリシー言語 “Cedar” で実現するアクセス制御
kentosuzuki
0
120
探せぇ!お薦めAWSセキュリティワークショップ!!〜 怒涛のワークショップ 48 連戦 〜
kentosuzuki
1
510
SIEM って何?〜 Amazon OpenSearch で始める SIEM 〜
kentosuzuki
0
480
Verified Accessから始めるゼロトラストセキュリティ
kentosuzuki
1
510
復活のAWS DeepComposer 〜 古代兵器から始める生成系AI 〜
kentosuzuki
0
230
新卒入社が考える『AWSではじめるクラウドセキュリティ』を読むタイミング
kentosuzuki
0
510
Cloudflare Pages使ってみた- ついでにAWS Amplifyもワカル -
kentosuzuki
3
770
Other Decks in Technology
See All in Technology
cgroup v2 で何が変わったのか / TechFeed Experts Night #28
tenforward
2
160
OpenID Foundation updates
fujie
0
110
1Q86
kawaguti
PRO
2
190
「できる!」を増やすGitHub Copilot活用法 / How to use GitHub Copilot to expand your possibilities
sansan_randd
1
240
kcp: Kubernetes APIs Are All You Need #techfeed_live / TechFeed Experts Night 28th
ytaka23
1
190
AWS CLIの起動が重くてつらいので aws-sdk-client-go を書いた / kamakura.go#6
fujiwara3
6
3.3k
Google Cloudを組織(企業)で運用する時のベストプラクティス × 健康の環境分離戦略 #まるクラ勉強会
yasumuusan
0
170
ハードウェアを動かすTypeScriptの世界
9wick
3
1.2k
PHP 9 に備えよ - 動的プロパティ、どうすればいぃ?
taisukearase
0
340
Google Cloud Next '24 Recap in ZOZO AIにより変わる開発 運用/Development and operation changed by AI
gachimuchiengineer
0
200
Autonomous Database Cloud 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
15
36k
LINEヤフーのウェブアクセシビリティ
lycorptech_jp
PRO
2
180
Featured
See All Featured
Designing the Hi-DPI Web
ddemaree
276
33k
Designing on Purpose - Digital PM Summit 2013
jponch
111
6.5k
How GitHub (no longer) Works
holman
305
140k
GraphQLの誤解/rethinking-graphql
sonatard
56
9.3k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
20
1.8k
Typedesign – Prime Four
hannesfritz
36
2.1k
Designing with Data
zakiwarfel
96
4.8k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
358
22k
Code Reviewing Like a Champion
maltzj
515
39k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
22
1.4k
Imperfection Machines: The Place of Print at Facebook
scottboms
261
12k
Transcript
Cloudflare CDN + S3の 静的Webホスティングを やってみた 2023-03-17 (Fri) Cloudflare Meetup
Fukuoka Kick Off!
n 鈴⽊健⽃ 所属 アイレット株式会社(東京オフィス) 経歴 • 新卒 3 年⽬(エンジニア歴 =
社会⼈歴) → 今⽉で終わり Cloudflare歴 • LTのために初めて触る @k_suzuki_pnx 自己紹介
やりたいこと ブラウザ経由でアクセス
前提条件 • ドメインは Route53 で取得 • Cloudflare の アカウントは作成済み
静的Webホスティング用S3の準備 1. ドメイン名と同じ名前のS3を作成 2. ブロックパブリックアクセスの無効化 3. バケットポリシーの追加
ホストゾーンの作成(Route53) 1. ホストゾーンの作成 2. 以下のパラメータでレコードを作成 ・レコードタイプ Aレコード(エイリアス) ・ルーティング先 S3ウェブサイトエンドポイントへのエイリアス
Cloudflareのコンソールでサイトを追加 1. 「サイトを追加」で⾃⾝のドメインを⼊⼒ 2. フリープランを選ぶ 3. 指⽰に従って進めていくと Cloudflareのネームサーバが2つ表⽰されるので控えておく
ネームサーバの変更 (Route53) 1. ドメインの既存ネームサーバを削除 2. Cloudflareのネームサーバに変更する
結果(Cloudflareの「分析」の画面) メトリクス取れた(全然キャッシュされてないけどw)
ハマったポイント Route53のホストゾーンのNSレコードを書き換えていて いつまで経ってもCloudflare経由にならなかった
まとめ CloudFrontを Cloudflareに 置き換えるのは簡単