iOS WKWebViewで広告を表示する場合の実装

サンプルはこちらにあります。 以下ではサンプルを参考に実装の説明をしています。

注意事項1

正常にWebView内に広告を表示させるため、App Transport Securityの設定を変更する必要があります。

配信される広告の中にはHTTPSによる通信に対応していないものもあるため、全てのHTTP通信を許可します。 アプリの Info.plist に以下の記述を追記してください。

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>
1
2
3
4
5

注意事項2

iOS14より、IDFA を使用するにはユーザーの明示的な許可が必要となります。 (本対応はAppleの発表では2021年のはじめ頃より対応となります。 参考:Details for app privacy questions now available ) AppTrackingTransparencyの権限をアプリに追加すると、IDFAへのアクセスと使用を許可するよう求めるアラートが追加され、ユーザーより許諾可否を指定していただく事になります。 上記許諾確認を行うため、アプリの Info.plist に以下の記述を追記してください。

<key>NSUserTrackingUsageDescription</key>
<string>IDFAを使用する理由の文言</string>
1
2

サンプル実装内の主要なファイルの説明

  • ViewController.m
    • WebViewを表示するクラスです。
    • このサンプルではローカルのtest.htmlを読み込んでいます。
  • AppData.m
    • IDFAやLAT、バンドルIDの取得を行っているクラスです。
  • test.html
    • WebViewで表示させるページです。

WebViewで表示させるページの編集

WebViewで表示させるページ内に広告タグを設置します。 サンプルのこちらを参考にしてください。

アプリ情報の取得

RTBで使用するパラメータに設定する項目はIDFA、LAT、バンドルID、キャリアです。

アプリ情報の取得方法は、サンプルのAppData.h / AppData.mを参考にしてください。 IDFAおよびLATを取得するにはAdSupportを、キャリアを取得するにはCoreTelephonyをインポートする必要があります。

またIDFAを使用する場合は、アプリ審査する際にIDFAの使用を申告する必要があります。 詳細はこちらをご覧ください。

WebViewの制御

WebViewの処理内で

  • JavaScriptとの連携
  • 広告がタップされた際の処理 を制御します。

サンプルのViewController.h / ViewController.mファイルを参考にしてください。

JavaScriptとの連携

WKWebViewではネイティブ処理側で作成したJavaScriptをWebView内で実行可能です。 この機能を利用して、JavaScriptとネイティブの処理間で値の受け渡しを行います。

  1. ネイティブ処理内でWebViewで実行するJavaScriptの雛形を用意
  2. 各種パラメータを取得してJavaScriptの雛形に埋め込む
  3. WebViewページ読み込み時にこのJavaScriptを差し込むように登録
- (WKWebViewConfiguration *)createConfiguration {

    // ネイティブでIDFAやLAT、バンドルID、キャリアを取得し、HTML側に渡す処理
    NSString *setParams =
        [NSString stringWithFormat:@"var geparams = window.geparams || {}; "
                                   @"geparams.lat = %@; geparams.idfa = '%@'; geparams.bundle = '%@';",
                                   ![AppData canTracking] ? @(true) : @(false), [AppData idfa], [AppData bundleId]];
    if ([AppData carrierCode].length) {
        setParams = [setParams stringByAppendingFormat:@"geparams.carrier = '%@';", [AppData carrierCode]];
    }
    
    WKUserScript *userScriptSetParams = [[WKUserScript alloc] initWithSource:setParams
                                                               injectionTime:WKUserScriptInjectionTimeAtDocumentStart
                                                            forMainFrameOnly:YES];

    WKUserContentController *userContentController = [[WKUserContentController alloc] init];
    [userContentController addUserScript:userScriptSetParams];

    WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
    configuration.userContentController = userContentController;
    return configuration;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

広告がタップされた際の処理

配信される広告はiFarmeを利用するケースがあります。 こうした広告をタップすると広告が表示されているiFrameの枠内でページが遷移されたり、期待する挙動になりません。

広告がタップされたらブラウザアプリを起動させて遷移先のページを表示させるのが妥当です。 こうした挙動を実現するには、下記のようにします。

  1. 管理ツール上でゾーンの設定を編集し、広告URLに含める任意のキーワードを登録
  2. decidePolicyForNavigationActionで登録キーワードを含むURLを捉えたら、広告のタップによるものと判断
  3. そのURLをブラウザアプリで開く
- (void)webView:(WKWebView *)webView
    decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction
                    decisionHandler:
                        (void (^)(WKNavigationActionPolicy))decisionHandler {
    NSURL *url = navigationAction.request.URL;
    NSString *urlString = [url absoluteString];

    // URLに外部ブラウザで起動するためのキーワードが含まれていたら外部ブラウザで開く処理
    // (広告に管理画面で設定したキーワードが設定され、広告をタップすると外部ブラウザで開く処理を実現する)
    // 下の例の、@"外部ブラウザ起動用キーワード"を登録済みのものに書き換える。
    if (navigationAction.navigationType == WKNavigationTypeLinkActivated) {
        if ([urlString rangeOfString:@"外部ブラウザ起動用キーワード"].location != NSNotFound) {
            [[UIApplication sharedApplication] openURL:url];
            decisionHandler(WKNavigationActionPolicyCancel);
            return;
        }
    }
    decisionHandler(WKNavigationActionPolicyAllow);
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

実装後の確認方法

広告タグを設置して、WebView内に広告が表示されていても RTBのパラメータが正しく設定されていなければRTBは行われません。

パラメータが正しくされているか確認するためにログ出力する方法が用意されています。 下記のタグをパラメータ設定処理の後に設置してください。 コンソールにログが出力されるようになります。 iOSではWebインスペクターでコンソールのログを確認できます。

<script type='text/javascript' src='http://js.gsspcln.jp/l/jssdk_debug.js'></script>
1
  • パラメータの設定に成功している場合のログ
idfa=xxx  (xxxにはアプリから取得した値が表示される)
lat=xxx
bundle=xxx
carrier=xxx
1
2
3
4
  • パラメータの設定に失敗している場合のログ
idfa=undifined
lat=undifined
bundle=undifined
carrier=undefined
1
2
3
4

アプリ審査に申し込む際の注意

アプリの審査時に広告ID(IDFA)の使用に関する質問があります。広告配信に使用するため、適切に回答してください。 WebView内の広告タグの導入では下記の回答で問題ありません。

  • この App は広告ID (IDFA) を使用しますか? - はいにチェックする
  • App 内で広告を出す - チェックする
  • この App のインストールを前に提供した広告と関連付ける - チェック不要
  • この App 内で行われたアクションを前に提供した広告と関連付ける -チェック不要
  • iOS の「追跡型広告を制限」設定 - チェックする

アプリ内で広告IDを他の用途にも使用している場合はそちらも考慮の上、チェックしてください。

Last Updated: 2020/9/18 14:12:12