【Swift】iPhoneアプリにバナー広告を貼る方法（Firebase編）

こんにちは、コン（@pippi_kon）です。

SwiftでiPhoneアプリにバナー広告を貼るためには以下の3つのことをしなくてはいけません。

1. GoogleのFirebaseに登録する。
2. アプリIDと広告ユニットIDを取得する。
3. 広告を設置するプログラムを書く。

今回は①のGoogleのFirebaseに登録する方法をご紹介します。

設定する前に

本記事内容は、基本的なプロジェクトである「Simple View App」で作成した環境を基にしています。

環境の作成方法は以下の記事をご覧ください。

【Swift】基本的なプロジェクト（Single View App）の作成方法iPhoneアプリを作成する際にまず行う「基本的なプロジェクトの作成方法」についてご紹介します。...

 

Firebaseプロジェクトの作成

それではFirebaseの設定をしていきましょう。

まずはFirebaseのプロジェクトを作成します。

Firebase Console（https://console.firebase.google.com）にアクセスし、Googleアカウントでログインしてください。

ログインしたら以下の画面が表示されるので「プロジェクトを追加」を選択します。

すると以下の画面が表示されます。

「プロジェクト名」に任意のプロジェクト名を指定します。

「プロジェクトID」は自動で設定されるので気にしなくていいです。

「国/地域」は日本を選択しましょう。

「Firebase 向け Google アナリティクスのデータ共有にデフォルトの設定を使用する」にチェックを入れます。（すでにチェック済みかもしれません）

「測定管理者間のデータ保護条項に同意します」にチェックを入れます。

これらの設定が完了したら「プロジェクトを作成」ボタンを押します。

プロジェクトの作成が開始されます。

しばらく待つとプロジェクトの作成が完了しますので「次へ」ボタンを押します。

このような画面が表示されたらプロジェクトの作成は完了です。

 

アプリの追加

プロジェクトの作成が終わったら次にアプリの追加を行います。

アプリの追加といっても、ここではまだアプリの作成が完了してなくても大丈夫です。

Xcodeでアプリのプロジェクトさえ作っておけば問題ありません。

 

アプリの登録

Firabaseのプロジェクト画面から「iOSアプリにFirebaseを追加」を選択します。

すると以下のような画面が表示されます。

「iOSバンドルID」にはXcodeに設定したプロジェクトの「Bundle Identifier」を指定します。

「アプリのニックネーム」「App Store ID」は省略でOKです。

バンドルIDを入力後、「アプリを登録」ボタンを押します。

 

＜バンドルID確認方法＞

Xcodeのプロジェクトを開き、「ツリーのプロジェクト名」→「Generalタブ」→「TARGETSのプロジェクト名」→「Bundle Identifier」で確認できます。

 

設定ファイルのダウンロード

アプリの登録が終わったら以下のような画面が表示されます。

まず「GoogleService-Info.plistをダウンロード」ボタンを押します。

すると「GoogleService-Info.plist」というファイルがダウンロードフォルダにダウンロードされるので、Xcodeプロジェクトフォルダの任意の場所に移動させておきます。

（移動は必須ではありませんが誤ってファイル削除などがないように退避します）

移動を終えたら「次へ」ボタンを押します。

 

Firebase SDK の追加

こちらは後ほど設定するので今は気にしなくていいです。

「次へ」ボタンを押します。

 

初期化コードの追加

こちらは「広告を設置するプログラムを書く」の記事でご紹介しますので、今は気にしなくていいです。

「次へ」ボタンを押します。

 

アプリを実行してインストールを確認

こちらは特に何もせず「このステップをスキップ」を押します。

 

アプリ追加完了

このような画面が表示されればアプリの追加は完了です。

 

CocoaPodsの設定

先ほどのアプリの追加で後回しにした「Firebase SDK の追加」を行います。

 

CocoaPodsのインストール

「CocoaPods」をインストールします。

すでにインストール済みの場合はこの手順をスキップしてください。

 

CocoaPodsとは、iOS/Mac向けのアプリ作成に便利なライブラリ管理ツールです。

このCocoaPodsを利用して広告用のライブラリを制御します。

 

まず「ターミナル」を起動します。

ターミナルは「アプリケーション」の「ユーティリティ」フォルダにあります。

上記「ターミナル」を選択すると、以下のような画面が開きます。

ターミナルを起動できたら、以下のコマンドを入力し、Enterキーを押して実行してください。

以下のようなログが出力されればインストール完了です。

 

Profileの作成

CocoaPodsがインストールできたら、次にCocoaPodsを制御するための「Profile」というファイルを作成します。

ターミナルにて、Xcodeプロジェクトフォルダ内の拡張子が「.xcodeproj」のファイルがある場所まで移動します。

 

私が実施している簡単な移動方法をご紹介します。

① Xcodeプロジェクトフォルダの拡張子が「.xcodeproj」のファイルがある場所を開く。

② ターミナルに「cd△」（△は半角スペース）を入力する。

③ ターミナルに拡張子が「.xcodeproj」のファイルをドラッグ&ドロップする。

④ ターミナルにファイルパスが追記されるので最後のファイル名を削除する。

⑤ Enterキーを押す。（これで移動完了）

⑥ うまく移動できたか確認のために「ls」と入力してEnterキーを押す。

⑦ コマンド結果に「.xcodeproj」があればうまく移動できた。

移動できたら、次にターミナルに以下のコマンドを入力し、Enterキーを押して実行してください。

すると、Xcodeプロジェクトフォルダの拡張子が「.xcodeproj」のファイルがある場所に「Podfile」というファイルが作成されます。

これでPodfileの作成は完了です。

なお、先ほど「pod init」を入力したターミナル画面は閉じないでください。

また後ほど使用します。

 

Podfileの修正

Podfileの作成が終わったら、次にPodfileの内容を修正します。

Xcodeプロジェクトフォルダ内のPodfileをダブルクリックして開きます。

バージョンによって多少異なりますが、初期状態だとこのようになっています。（TestAppはプロジェクト名）

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'TestApp' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for TestApp

end

 

この内容を次のように変更します。（変更点は2箇所）

＜1箇所目＞

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'TestApp' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for TestApp

end

この行の先頭についてる「#△」（△は半角スペース）を削除します。

# Uncomment the next line to define a global platform for your project
platform :ios, '9.0'

target 'TestApp' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for TestApp
  pod 'Firebase/AdMob'

end

 

＜2箇所目＞

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'TestApp' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for TestApp

end

この行の下に「pod ‘Firebase/AdMob’」を追加します。

# Uncomment the next line to define a global platform for your project
platform :ios, '9.0'

target 'TestApp' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for TestApp
  pod 'Firebase/AdMob'

end

 

最終的にこのようになります。

# Uncomment the next line to define a global platform for your project
platform :ios, '9.0'

target 'TestApp' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for TestApp
  pod 'Firebase/AdMob'

end

 

修正が終わったら、テキストエディットのファイルメニューの保存を選択します。

これでPodfileの修正は完了です。

 

Podfileのインストール

Podfileの修正が終わったら、最後にPodfileのインストールを行います。

Podfileの作成で使用したターミナル画面に戻ります。

ターミナルに以下のコマンドを入力し、Enterキーを押して実行してください。

以下のようなログが表示されれば、Podfileのインストールは完了です。

 

最後に

今回は、iPhoneアプリへのバナー広告の貼り方（Firebase編）をご紹介しました。

広告を貼るためには以下の3つのことをしなくてはいけません。

1. GoogleのFirebaseに登録する。
2. アプリIDと広告ユニットIDを取得する。
3. 広告を設置するプログラムを書く。

この記事は（A）について記載したものです。

 

広告の設定は色々とやることがあって面倒ですよね。

でもアプリの収益化には必須の設定なので避けて通れません。

本記事では手順を細かくご紹介していますので少しでもご参考になれば幸いです。

【2020年版】初心者向け！Swift入門にオススメの参考書『Swift初心者にオススメしたいSwiftプログラミング参考書』をご紹介します。...

無料体験あり！初心者におすすめの人気プログラミングスクール3選『プログラミングを学ぶことができる人気のプログラミングスクール』についてご紹介します。...