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.2k
短縮 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
640
Amazon RDS / Amazon Aurora パフォーマンスチューニングとモニタリング
twingob
9
2.8k
失敗知識から学ぶ!クラウドアプリ設計で避けるべき事例とその対策
twingob
11
5.6k
Amazon CodeCatalyst と Amazon CodeWhisperer で開発を加速しよう!
twingob
1
800
AWS Copilot with AWS CDK
twingob
1
540
Amazon Redshift Serverless with CDK
twingob
1
1.8k
Rapid Prototyping with AWS
twingob
0
490
Using cdk-remote-stack and AWS Edge Networking Services for cross-regional applications
twingob
0
370
Try Infrastructure as Code with AWS CDK!
twingob
1
420
Other Decks in Technology
See All in Technology
MobileActOsaka_250704.pdf
akaitadaaki
0
110
Tech-Verse 2025 Global CTO Session
lycorptech_jp
PRO
0
1.7k
Lambda Web Adapterについて自分なりに理解してみた
smt7174
6
160
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
180
Delegating the chores of authenticating users to Keycloak
ahus1
0
140
生成AI活用の組織格差を解消する 〜ビジネス職のCursor導入が開発効率に与えた好循環〜 / Closing the Organizational Gap in AI Adoption
upamune
7
5.1k
ドメイン特化なCLIPモデルとデータセットの紹介
tattaka
2
580
品質と速度の両立:生成AI時代の品質保証アプローチ
odasho
1
220
AI導入の理想と現実~コストと浸透〜
oprstchn
0
190
AWS Organizations 新機能!マルチパーティ承認の紹介
yhana
1
270
ゼロからはじめる採用広報
yutadayo
2
510
モバイル界のMCPを考える
naoto33
0
420
Featured
See All Featured
Agile that works and the tools we love
rasmusluckow
329
21k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
281
13k
Become a Pro
speakerdeck
PRO
28
5.4k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Code Review Best Practice
trishagee
69
18k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
48
5.4k
Into the Great Unknown - MozCon
thekraken
39
1.9k
Navigating Team Friction
lara
187
15k
Raft: Consensus for Rubyists
vanstee
140
7k
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.