あの短縮URLアプリが大幅アップデート！

2025/5/10(土)に開催された Global Azure 2025 ( https://jazug.connpass.com/event/348980/ ) に参加した時に懇親会飛び込みLTで発表した資料です。

Transcript

1. あの短縮URLアプリが ⼤幅アップデート 2025/05/10 Global Azure 2025 LT⼤会 NTTテクノクロス 中島進也（なかしょ）
2. ⾃⼰紹介 • なかしょ（中島進也） @nakasho_dev • 所属：NTTテクノクロス株式会社 デジタルトランスフォーメーション事業部 • 業務：MaaS関連のスマートフォンアプリ開発担当 • 趣味： Ø妻とモンハンデート ØIT関連の勉強会（主にモバイル系 or アジャイル系 or Microsoft系） Ø技術コミュニティの運営スタッフ üeXtreme Programming Japan User Group（XPJUG） 2019〜 üTDD BootCamp Online (TDDBC) 2020〜 ※本資料は私個⼈の意⾒であり、所属企業・部⾨⾒解を代表するものではありません。
3. https://confengine.com/conferences/scrummatsuri XP祭り2025 10/4(⼟)開催
4. とあるショッピングセンターで．．． 4 お店に誘導するためのQRコード をSC内の各所に掲⽰したいんだ けど作ってくれない？ OK。ちなみにどんなURL？
5. ⻑いURLからQRコードを⽣成 5 https://sugokunagaisubdomaindakedo.orematananikayacchaimashita.ex ample.com/kisetuno.oryouriwo.magokorokomete.teikyouitashimasu.do?s enimoto=iriguchinoyokoniaruuekibachinikazattearu.tanzaku&campaignc ode=koredeuriagebaizou.bokunokyuuyomobaizou&deeplink=omisenoyoy akujoukyou ※有効なURLではありません なげーよ！
6. 6 QRコードが細かすぎて印刷物から読み込 めないってクレームたくさん来ているんで すけど！！！！！ 情報詰めすぎたらQRコードも細か くなるよね。 紙媒体だと印刷の品質も影響ある。
7. ※有効なURLではありません 短いURLだとQRコードも読みやすい ※有効なURLではありません 例：https://example.com/nakasho.doc 前述のQRコード
8. 8 そこで短縮URL ですよ！ （ようやく本題かよ．．．）
9. 9 Azureの⾃社のテナントで 短縮URLが⼿軽に実現できる⽅法あ るかなぁ．．．
10. 10 そこで Azure Url Shortener ですよ！
11. Azure Url Shortener 11 • 特徴 Ø100%OSSの短縮URLサービス ØAzure Developer CLIから簡単デプロイ Øスケジュールに基づいてさまざまな宛先をリダイレクト Øクリックの統計を保存 ØAPI経由で短縮URLを追加可能 ØTiny Blazor Adminで管理画⾯を提供 Ø独⾃ドメインにも対応 • Frank Boucher⽒が開発 Ø個⼈のGithubリポジトリで開発していた Ø現在はMicrosoftの公式リポジトリに移⾏している ØAzure Communication ServicesのDocでも活⽤⽅法を紹介している https://github.com/microsoft/AzUrlShortener
12. 2年半ぶりに⼤幅アップデート 12 https://github.com/microsoft/AzUrlShortener
13. Previous Architecture 13 • Azure Function (API) • Azure Storage (Function Code) • Azure Static Web App (Blazor WebAssembly) • Azure Storage Table (Data) • Application Insights https://github.com/microsoft/AzUrlShortener
14. New Architecture 14 https://github.com/microsoft/AzUrlShortener • Container registry (Docker images) • Container Apps Environment • Container App/ Function: FunctionsLight Public redirect-only API • Container App: Internal API Protected management interface • Container App: TinyBlazorAdmin Secured Blazor website • Azure Storage Table (Data) • Managed Identity • Log Analytics
15. 導⼊はAzure Developer CLI 15 > azd init Initializing an app to run on Azure (azd init) ? Enter a new environment name: [? for help] azshort ? Enter a new environment name: azshort > azd config set alpha.aca.persistDomains on > azd up ? Select an Azure Subscription to use: 1. nakasho.xxxxx (xxxxxxxx-142a-46b0-xxxx-b84dc30axxxx) ? Enter a value for the 'CustomDomain' infrastructure parameter: https://s.ukky.org/ ? Enter a value for the 'DefaultRedirectUrl' infrastructure parameter: https://github.com/nakasho-dev ? Enter a value for the 'location' infrastructure parameter: 10. (Asia Pacific) Japan East (japaneast) Packaging services (azd package) Provisioning Azure resources (azd provision) Provisioning Azure resources can take some time. https://github.com/nakasho-dev/AzUrlShortener/blob/main/doc/how-to-deploy.md
16. 導⼊はとても楽 16 (✓) Done: Resource group: rg-azshort (1.751s) (✓) Done: Container Registry: acrcnsmin6ohkujw (9.177s) (✓) Done: Log Analytics workspace: law-cnsmin6ohkujw (16.675s) (✓) Done: Container Apps Environment: cae-cnsmin6ohkujw (2m8.033s) (✓) Done: Storage account: urldatacnsmin6ohkujw (25.394s) (✓) Done: Storage account: funcstoragea17cacnsmin6o (29.697s) Deploying services (azd deploy) (✓) Done: Deploying service admin - Endpoint: https://admin.niceflower-a6936d9c.japaneast.azurecontainerapps.io/ (✓) Done: Deploying service api - Endpoint: https://api.internal.niceflower-a6936d9c.japaneast.azurecontainerapps.io/ (✓) Done: Deploying service azfunc-light - Endpoint: https://azfunc-light.niceflower-a6936d9c.japaneast.azurecontainerapps.io/ Aspire Dashboard: https://aspire-dashboard.ext.niceflower-a6936d9c.japaneast.azurecontainerapps.io SUCCESS: Your up workflow to provision and deploy to Azure completed in 4 minutes 52 seconds. https://github.com/microsoft/AzUrlShortener
17. 構築完了 17
18. 管理画⾯の認証設定 18
19. 短縮URLのカスタムドメイン設定 19
20. Tiny Blazor AdminのTOPページ 20
21. URL ManagerでURLを登録 21
22. URL ManagerでURLを登録 22
23. 実際に短縮URLを叩いてみる 23 リダイレクト された！
24. みんな⼤好き？Aspire Dashboard 24
25. まとめ 25 • QRコードはデータ量が少ないほど読み取りやすい • ⻑いURLは短縮URLにしよう Øカスタムドメイン、カスタムVanityでブランディング戦略 • Azure で運⽤するならAzure URL Shortenerを使おう • Azure Developer CLIを使いこなして効率よく環境構築しよう
26. ご清聴ありがとうございました。 26 @nakasho_dev