もぎゃさんのCrieit記事を見て、TwitterでシェアするとURLバンされるらしい。。
URLを短縮すると回避できるらしく、Firebase Dynamic Linksを使ってURLを短縮してみたときの備忘録
Firebaseのダイナミックリンクとは
公式ドキュメントより
Firebase Dynamic Links は、アプリのインストールの有無にかかわらず、複数のプラットフォームで機能するリンクです。
Dynamic Links により、ユーザーがリンクを開いたプラットフォームで得られる最高のエクスペリエンスを提供できるようになります。
iOS または Android でダイナミックリンクを開くと、ネイティブアプリのリンク先のコンテンツに直接移動します。
デスクトップ ブラウザでダイナミック リンクを開くと、ウェブサイト上の同じコンテンツに移動します。
REST APIも用意されていて、動的に生成できるっぽい。
準備
流れ的にはこんな感じ
- Firebaseコンソールで「DynamicLinks」でURI接頭辞(短縮URLのドメイン)を追加する
- Firebaseコンソールで「プロジェクトの設定」から「ウェブAPIキー」をコピー
- URI接頭辞(短縮URLのドメイン)とウェブAPIキーを使ってAPIを呼ぶ
ソースコードはこんな感じ
APIクライアントはaxiosを使ってます。必要に応じてnpm i -S axios
。
import axios from "axios"; // Firebaseのコンソール「プロジェクトの設定」>「ウェブAPIキー」をコピー const WEB_API_KEY = process.env.FIREBASE_WEB_API_KEY || ""; // 短縮URLのドメイン。https://hogehoge.page.linkなど const DOMAIN_URI_PREFIX = process.env.DOMAIN_URI_PREFIX || ""; export default class FireaseDynamicLinksHelper { public async toShort(targetURL: string): Promise<string> { try { // Firebase Dynamic LinkのAPIエンドポイント const url = `https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=${WEB_API_KEY}`; // リクエストするパラメタ const params = { dynamicLinkInfo: { domainUriPrefix: DOMAIN_URI_PREFIX, link: targetURL }, suffix: { option: "SHORT" } }; // POSTでリクエスト const res: any = await axios.post(url, params); // shortLinkが短縮URL return res.data.shortLink; } catch (error) { // エラーが発生したら、短縮前のURLを返す return targetURL; } } }
パラメタはいろいろあるらしく、APIリファレンス)に書いてある。
以上!!
おすすめの書籍

改訂新版 Vue.jsとFirebaseで作るミニWebサービス (技術の泉シリーズ(NextPublishing))
- 作者: 渡邊達明
- 出版社/メーカー: インプレスR&D
- 発売日: 2018/10/05
- メディア: Kindle版
- この商品を含むブログを見る

Firebaseによるサーバーレスシングルページアプリケーション (技術の泉シリーズ(NextPublishing))
- 作者: 小島佑一
- 出版社/メーカー: インプレスR&D
- 発売日: 2019/05/24
- メディア: オンデマンド (ペーパーバック)
- この商品を含むブログを見る

実践TypeScript ~ BFFとNext.js&Nuxt.jsの型定義~
- 作者: 吉井健文
- 出版社/メーカー: マイナビ出版
- 発売日: 2019/06/26
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る

TypeScript実践プログラミング (Programmer's SELECTION)
- 作者: スティーブ・フェントン,鈴木幸敏,株式会社クイープ
- 出版社/メーカー: 翔泳社
- 発売日: 2015/01/23
- メディア: 大型本
- この商品を含むブログ (1件) を見る