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
1k
短縮 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
590
Amazon RDS / Amazon Aurora パフォーマンスチューニングとモニタリング
twingob
8
2.3k
失敗知識から学ぶ!クラウドアプリ設計で避けるべき事例とその対策
twingob
11
5.3k
Amazon CodeCatalyst と Amazon CodeWhisperer で開発を加速しよう!
twingob
1
750
AWS Copilot with AWS CDK
twingob
1
500
Amazon Redshift Serverless with CDK
twingob
1
1.7k
Rapid Prototyping with AWS
twingob
0
450
Using cdk-remote-stack and AWS Edge Networking Services for cross-regional applications
twingob
0
330
Try Infrastructure as Code with AWS CDK!
twingob
1
400
Other Decks in Technology
See All in Technology
手を動かしてレベルアップしよう!
maruto
0
220
RayでPHPのデバッグをちょっと快適にする
muno92
PRO
0
190
ExaDB-XSで利用されているExadata Exascaleについて
oracle4engineer
PRO
3
260
30→150人のエンジニア組織拡大に伴うアジャイル文化を醸成する役割と取り組みの変化
nagata03
0
180
OPENLOGI Company Profile for engineer
hr01
1
20k
わたしがEMとして入社した「最初の100日」の過ごし方 / EMConfJp2025
daiksy
14
5.1k
クラウド関連のインシデントケースを収集して見えてきたもの
lhazy
8
1.2k
Fraxinus00tw assembly manual
fukumay
0
110
Snowflake ML モデルを dbt データパイプラインに組み込む
estie
0
100
Active Directory攻防
cryptopeg
PRO
8
5.5k
【内製開発Summit 2025】イオンスマートテクノロジーの内製化組織の作り方/In-house-development-summit-AST
aeonpeople
2
690
脳波を用いた嗜好マッチングシステム
hokkey621
0
290
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Making Projects Easy
brettharned
116
6k
Practical Orchestrator
shlominoach
186
10k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
Documentation Writing (for coders)
carmenintech
67
4.6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
GraphQLとの向き合い方2022年版
quramy
44
14k
Code Reviewing Like a Champion
maltzj
521
39k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
Automating Front-end Workflow
addyosmani
1368
200k
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.