Implementation when displaying advertisements with iOS WKWebView

Sample is a here. Below is an explanation of implementation by referring to the sample.

Note1

In order to have the advertisement display properly in WebView, you need to change App Transport Security settings.

Since some ads delivered are not compatible with HTTPS communication, all HTTP communication is permitted. Please add the following description in Info.plist of the application.

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

1
2
3
4
5

Note2

Starting with iOS14, IDFA requires explicit user permission to use it. (This support will be supported from the beginning of 2021 according to Apple's announcement. reference：Details for app privacy questions now available )

When you add AppTrackingTransparency permissions to your app, an alert will be added asking you to allow access to and use of IDFA, and you will be asked to allow or disallow it. Please add the following description to the Info.plist of the application to confirm the above permission.

<key>NSUserTrackingUsageDescription</key>
<string>The wording of the reason for using IDFA</string>

1
2

Description of key files in sample implementation

ViewController.m
- Class that displays WebView.
- This sample reads the local test.html.
AppData.m
- IDFA, LAT, bundle ID acquisition class.
test.html
- This is the page to display in WebView.

Editing the page displayed on WebView

We will place an ad tag in the page to display in WebView. Sample is in here.

Acquisition of application information

The items to be set for the parameter used in RTB are IDFA, LAT, bundle ID, carrier.

Please refer to the sample AppData.h / AppData.m for how to get the app informtion. To get IDFA and LAT, import AdSupport. and need to import CoreTelephony to get a career.

When using IDFA, it is necessary to declare the use of IDFA at the time of application review.

WebView control

The following are controlled within the WebView process.

Cooperation with JavaScript
Processing when advertisement is tapped

Please refer to the sample [ViewController.h] (https://github.com/geniee-ssp/Geniee-JavaScript-SDK/blob/master/iOS-Samples/WKWebViewSample/WKWebViewSample/ViewController.h) / [ViewController.m] (https://github.com/geniee-ssp/Geniee-JavaScript-SDK/blob/master/iOS-Samples/WKWebViewSample/WKWebViewSample/ViewController.m).

Cooperation with JavaScript

In WK Webbiew, JavaScript created on the native processing side can be executed in WebView. This function is used to pass values between JavaScript and native processing.

Prepare a template of JavaScript to be executed in WebView within native processing
Acquire various parameters and embed them in JavaScript template
Register to insert this JavaScript when loading WebView page

- (WKWebViewConfiguration *)createConfiguration {

    // Process of acquiring IDFA, LAT, bundle ID, carrier carefully natively and passing it to the HTML side
    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

Processing when an ad is tapped

There are cases where iFarme is used for the advertisement to be delivered. Taping on these ads will cause the page to transition within the framework of the iframe where the ad is shown or will not behave as expected.

When the ad is tapped it is reasonable to activate the browser application and display the transition destination page. In order to realize such behavior, we do as follows.

Edit the zone settings on the management tool and register any keywords to include in the ad URL
If you catch the URL containing the registered keyword with decidePolicyForNavigationAction, it is judged that it is due to tap of advertisement
Open the URL in the browser application

- (void)webView:(WKWebView *)webView
    decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction
                    decisionHandler:
                        (void (^)(WKNavigationActionPolicy))decisionHandler {
    NSURL *url = navigationAction.request.URL;
    NSString *urlString = [url absoluteString];

     // Processing to open in external browser if URL contains keyword for starting with external browser
     // (Keywords set on the advertisement screen are set, and when you tap on the advertisement, processing to open in the external browser is realized)
     // Rewrite @ "external browser activation keyword" in the example below to registered one.
    if (navigationAction.navigationType == WKNavigationTypeLinkActivated) {
        if ([urlString rangeOfString:@"Keyword for starting external browser"].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

Confirmation method after implementation

Even if an ad tag is placed and an ad is displayed in WebView RTB is not performed unless RTB parameters are set correctly.

There is a method to log output to confirm that the parameters are correct. Please set the following tag after parameter setting processing. Logs will be output to the console. In iOS, you can check the console log in the Web Inspector.

<script type='text/javascript' src='http://js.gsspcln.jp/l/jssdk_debug.js'></script>

Log when the parameter setting is successful

idfa=xxx　 (The value obtained from the application is displayed in xxx)
lat=xxx
bundle=xxx
carrier=xxx

1
2
3
4

Log when the parameter setting has failed

idfa=undifined
lat=undifined
bundle=undifined
carrier=undefined

1
2
3
4

Precautions when applying for application review

I have a question about using advertisement ID (IDFA) at app review. Please respond appropriately to use for ad delivery.

There is no problem with the following answers when introducing ad tags in WebView.

Does this app use the Advertising Identifier (IDFA)? - To check "Yes"
Serve advertisements within the app - To check
Attribute this app installation to a previously served advertisement - No check
Attribute an action taken within this app to a previously served advertisement - No Check
Linit Ad Tracking setting in iOS - To check

If you are using the ad ID for other purposes in the app, please check that as well.

← Implementation when displaying advertisement on WebView on Android Obtain a Zone ID →

# Implementation when displaying advertisements with iOS WKWebView

# Note1

# Note2

# Description of key files in sample implementation

# Editing the page displayed on WebView

# Acquisition of application information

# WebView control

# Cooperation with JavaScript

# Processing when an ad is tapped

# Confirmation method after implementation

# Precautions when applying for application review