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
短縮 URL サービス 4分間クッキング - Amazon CloudFront KeyVa...
Search
@twingo_b
March 02, 2024
Technology
1
1.3k
短縮 URL サービス 4分間クッキング - Amazon CloudFront KeyValueStore, CloudFront Functions, AWS CDK で作成、CloudWatch Logs で簡易アクセス集計 -
JAWSDAYS 2024 B-11 恒例!ソリューションアーキテクト怒涛のLT
@twingo_b
March 02, 2024
Tweet
Share
More Decks by @twingo_b
See All by @twingo_b
20240713 Generative AI with AWS
twingob
6
660
Amazon RDS / Amazon Aurora パフォーマンスチューニングとモニタリング
twingob
9
2.9k
失敗知識から学ぶ!クラウドアプリ設計で避けるべき事例とその対策
twingob
11
5.7k
Amazon CodeCatalyst と Amazon CodeWhisperer で開発を加速しよう!
twingob
1
810
AWS Copilot with AWS CDK
twingob
1
550
Amazon Redshift Serverless with CDK
twingob
2
1.9k
Rapid Prototyping with AWS
twingob
0
500
Using cdk-remote-stack and AWS Edge Networking Services for cross-regional applications
twingob
0
380
Try Infrastructure as Code with AWS CDK!
twingob
1
430
Other Decks in Technology
See All in Technology
Telemetry APIから学ぶGoogle Cloud ObservabilityとOpenTelemetryの現在 / getting-started-telemetry-api-with-google-cloud
k6s4i53rx
0
160
[OCI Technical Deep Dive] OCIで生成AIを活用するためのソリューション解説(2025年8月5日開催)
oracle4engineer
PRO
0
120
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
oracle4engineer
PRO
2
6.4k
EKS Pod Identity における推移的な session tags
z63d
1
170
データモデリング通り #2オンライン勉強会 ~方法論の話をしよう~
datayokocho
0
190
2025新卒研修・Webアプリケーションセキュリティ #弁護士ドットコム
bengo4com
3
9.6k
結局QUICで通信は速くなるの?
kota_yata
9
7.5k
Backboneとしてのtimm2025
yu4u
2
460
プロダクトエンジニアリングで開発の楽しさを拡張する話
barometrica
0
210
いかにして命令の入れ替わりについて心配するのをやめ、メモリモデルを愛するようになったか(改)
nullpo_head
7
2.7k
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
18
52k
リモートワークで心掛けていること 〜AI活用編〜
naoki85
0
190
Featured
See All Featured
The Invisible Side of Design
smashingmag
301
51k
GraphQLとの向き合い方2022年版
quramy
49
14k
Unsuck your backbone
ammeep
671
58k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
BBQ
matthewcrist
89
9.8k
The Language of Interfaces
destraynor
160
25k
Code Review Best Practice
trishagee
69
19k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Transcript
© 2024, Amazon Web Services, Inc. or its affiliates. ©
2024, Amazon Web Services, Inc. or its affiliates. 短縮 URL サービス 4分間クッキング - Amazon CloudFront KeyValueStore, CloudFront Functions, AWS CDK で作成、CloudWatch Logs で簡易アクセス集計 - Yoshinori Fujiwara Sr. Solutions Architect Amazon Web Services Japan G.K. JAW S DAY S 2 0 2 4 B - 1 1 恒 例 ︕ ソ リ ュ ー シ ョ ン ア ー キ テ ク ト 怒 涛 の LT
© 2024, Amazon Web Services, Inc. or its affiliates. ⾃⼰紹介
藤原 吉規 🧑🚒 デジタルサービスソリューション部 シニア ソリューションアーキテクト デジタルネイティブビジネスのお客様に 技術⽀援しています。 好きな AWS サービス Amazon CloudFront AWS 技術サポート 2
© 2024, Amazon Web Services, Inc. or its affiliates. 作成済みの短縮
URL サービスに実際にアクセスしましょう 3 QR コードが読める 📸 カメラアプリ のご準備を︕
© 2024, Amazon Web Services, Inc. or its affiliates. JAWS
DAYS 2024 このあとの楽しみなセッションは︖ 4 🍻 懇親会 🍻 恒例︕ SA 怒涛の LT (本セッション)
© 2024, Amazon Web Services, Inc. or its affiliates. 短縮
URL サービス全体アーキテクチャ 5 クライアント (ビューワー) GET /sa-lt ビューワーリクエスト 302 Found Location: https://jawsdays2024.jaws-ug.jp/sessions/timetable/B-11 AWS Cloud Development Kit (AWS CDK) デプロイ Amazon CloudFront エッジロケーション CloudFront エッジ キャッシュ CloudFront Functions CloudFront KeyValueStore Amazon CloudWatch Logs トラッキング
© 2024, Amazon Web Services, Inc. or its affiliates. src/redirectconfig.json
{ "data": [ { "key": "sa-lt", "value": "https://jawsdays2024.jaws-ug.jp/sessions/timetable/B-11/" }, { "key": "in-house-development", "value": "https://jawsdays2024.jaws-ug.jp/sessions/timetable/D-12/" }, { "key": "social-gathering", "value": "https://jawsdays2024.jaws-ug.jp/sessions/timetable/SOCIAL/" } ] } 6
© 2024, Amazon Web Services, Inc. or its affiliates. src/viewer-request.js
import cf from "cloudfront"; const kvsId = "KEY_VALUE_STORE_ID_PLACEHOLDER"; // KeyValueStore Id はリプレースする const kvs = cf.kvs(kvsId); function response_generate(target) { return { statusCode: 302, statusDescription: "Found", headers: { location: { value: target }, }, }; } … 7 async function handler(event) { // マッチしなかったときのデフォルト URL let target = 'https://jawsdays2024.jaws-ug.jp/'; if (event.request.uri === "/") { return response_generate(target); } const key = event.request.uri.split("/")[1]; try { target = await kvs.get(key); // トラッキング⽤のログ console.log(`Match found: ${key} -> ${target}`); } catch (err) { console.log(`Error when fetching key ${key}: ${err}`); } // ターゲット URL にリダイレクト return response_generate(target); }
© 2024, Amazon Web Services, Inc. or its affiliates. CDK
TypeScript source const keyValueStore = new cdk.aws_cloudfront.KeyValueStore(this, 'KeyValueStore', { source: cdk.aws_cloudfront.ImportSource.fromAsset('src/re directconfig.json'), }); // CloudFront Functions を読み込んで、 KeyValueStore Id をリプレースする const functionCode = readFileSync("src/viewer- request.js", "utf8").replace( "KEY_VALUE_STORE_ID_PLACEHOLDER", keyValueStore.keyValueStoreId, ); … 8 const viewerRequestFunction = new cdk.aws_cloudfront.Function(this, "ViewerRequestFunction", { code: cdk.aws_cloudfront.FunctionCode.fromInline(functionCode), runtime: cdk.aws_cloudfront.FunctionRuntime.JS_2_0, keyValueStore: keyValueStore, }); const distribution = new cdk.aws_cloudfront.Distribution(this, "Distribution", { defaultBehavior: { origin: new cdk.aws_cloudfront_origins.HttpOrigin("never.referenced"), functionAssociations: [ { function: viewerRequestFunction, eventType: cdk.aws_cloudfront.FunctionEventType.VIEWER_REQUEST, }, ], }, }); new cdk.CfnOutput(this, 'DistributionURL', { value: distribution.distributionDomainName });
© 2024, Amazon Web Services, Inc. or its affiliates. CloudWatch
Logs Insights で簡易集計 fields @timestamp | filter @message like /Match found/ | parse @message /Match found: (?<@slug>.*?) ->/ | stats count(*) as count by @slug | sort count desc 9 ロググループ クエリ 可視化 /aws/cloudfront/function/<CloudFront Funcsion Name>
© 2024, Amazon Web Services, Inc. or its affiliates. 4
分 (実測) で短縮 URL サービスをデプロイできました︕ 10
© 2024, Amazon Web Services, Inc. or its affiliates. 集計結果は後ほど︕
11 https://twitter.com/twingo_b/status/1763840023819059580
© 2024, Amazon Web Services, Inc. or its affiliates. Thank
you! © 2024, Amazon Web Services, Inc. or its affiliates.