事前準備
・Firebaseにプロジェクトを作成しておくこと
・Google AdMobにアプリを追加しておくこと
(こちらに関しては目的によって不要かも知れませんが、本記事の目的はリリース済みのiOSアプリにAdMobを表示する過程で必要になったapp-ads.txtファイルの公開手順を記載しております。)
Firebase Hostingを構築する
1. Firebaseにログインする。
サイドメニューから「Hosting」を開き、「始める」をクリックする。
2. Firebase CLIのインストール
npmコマンドをコピーして実行する。
npm install -g firebase-toolsコマンド実行のディレクトリに決まりがあるかは不明だが、アプリのプロジェクト(xxx.xcodeproj)などを含むディレクトリで実行した。
3. プロジェクトの初期化
Googleへのログインのコマンドをコピーして実行する。(実行ディレクトリは同じ)
Googleへのログイン
firebase loginエラーになりました。
(node:66269) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
Already logged in as {メールアドレス}
いや、上2行は赤文字で表示されてますがエラーじゃなさそうです。
ログイン済みだよ！って書いてある。
ということでなんかログイン済みみたいです。
自覚なくログインされていてそのまま進めるのも嫌なので一旦ログアウトします。
Googleからログアウト
firebase logout
(node:66518) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
✔ Logged out from {メールアドレス}
相変わらず上2行は赤文字で表示されてますがログアウト成功しているっぽいので、もう一度Googleへのログインのコマンドを実行します。
firebase loginこのような質問が表示されます。
? Allow Firebase to collect CLI and Emulator Suite usage and error reporting information? (Y/n)
Firebaseがエラーレポートを収集することを許可するか？みたいな感じだと思うので Y/nでもどっちでもいいと思います。私は n で進めました。
すると、ブラウザにGoogleにログインのアカウントの選択画面が表示されるのでログインするアカウントを選択します。
この時に選択するアカウントがなんでもいいかは分からないです。
私はFirebaseプロジェクトを作成したアカウントを選択 → 次へ → 許可 で進めます。
コマンドラインに
✔ Success! Logged in as {メールアドレス}
が表示されます。
プロジェクトの開始
firebase init※ このコマンドはアプリのルート ディレクトリから実行してください。
上記については合ってるか分からないですが、他のコマンドと同様にアプリのプロジェクト(xxx.xcodeproj)をルートディレクトリとします。(こんなの気持ちの問題です！)
コマンドを実行すると下記の画像のように表示されます。
? Which Firebase features do you want to set up for this directory? Press Space to select features, then Enter to confirm your choices. (Press to select, to toggle all, to invert
selection, and to proceed)
目的の機能に該当するものを選べって感じのことが表示されているので、
上下の矢印キーで選択したい機能まで移動しスペースを押して機能を選択する。
エンターキーを押して選択を確定します。
Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys
私はHostingの使用が目的なのでこちらを選択しました。
? Please select an option: (Use arrow keys)
おそらく既存のプロジェクトとは、事前準備で作成したFirebaseプロジェクトのことだと思うので
Use an existing project
を選択しました。
? Select a default Firebase project for this directory: (Use arrow keys)
これは自分がHostingのために作成したFirebaseプロジェクトを選択します。
? Which connector do you want set up a generated SDK for? (Use arrow keys)
これはよく分からないですが１つしか選択肢なかったのでそれを選択しました。
? What do you want to use as your public directory? (public)
公開ディレクトリの名前を聞かれてるのかな？
ちょっとよく分からないけど何も入力せずエンターキーを押してpublicで作成されるようにした。
? Configure as a single-page app (rewrite all urls to /index.html)? (y/N)
今回は app-ads.txtファイルを公開したいだけなのでどっちでもいいですが Nで進めます。
? Set up automatic builds and deploys with GitHub?
自動デプロイの設定は必要ないので Nで進めます。
質問されることはこれで以上ですね。長すぎ！笑
4. app-ads.txtに記載する内容をAdMobで確認しよう
Google AdMobにログインします。
https://admob.google.com/v2/home
サイドメニューの「アプリ」をクリック→AdMobを表示したアプリをクリックする。
サイドメニューの「アプリの設定」をクリック→「Verify app」をクリックする。
下にスクロールして表示されているスニペットのコードをコピーします。
5. app-ads.txtを公開する
コマンドを実行していたディレクトリに「public」フォルダが作成されているので、publichフォルダの中に「app-ads.txt」という名前でファイルを作成します。
AdMobからコピーしてきたコードを「app-ads.txt」にコピペします。
これまでコマンドを実行してきたディレクトリで下記のコマンドを実行します。
firebase deploy --only hosting成功すると ✔ Deploy complete! と表示されます。
その下に HostingURLが下記のように表示されます。
Hosting URL: https://{プロジェクトID}.web.app
そしたら、「app-ads.txt」がアップロードされているかを確認するために HostingURLに /app-ads.txt をつけてブラウザで検索してみましょう。
https://{プロジェクトID}.web.app/app-ads.txt
app-ads.txtにコピペした内容が表示されればアップロードが成功しています。
まとめ
firebase init のコマンドのとこやたらと時間が掛かりましたがこちらもみながら進めればもうちょいスムーズに行けた気がします。
https://developers.google.com/admob/ios/app-ads?sjid=2817011129978340157-AP&hl=ja#firebase
でもHostingの画面の手順に従ってたら他に手順が載ってるとは思わなくないので仕方ないです。
ちょっと読みづらいから時間があったら整理しようかなって思います。