เพิ่มประสิทธิภาพพฤติกรรมการคลิก WKWebView

หาก iOS แอปใช้WKWebView เพื่อแสดงเนื้อหาเว็บ คุณอาจต้องพิจารณาเพิ่มประสิทธิภาพพฤติกรรมการคลิกเนื่องจากเหตุผลต่อไปนี้

• WKWebView ไม่รองรับ การคลิกโฆษณาที่พยายามเปิดแท็บใหม่จะไม่ทำอะไรเลยโดยค่าเริ่มต้น

• การคลิกโฆษณาที่เปิดในแท็บเดียวกันจะเป็นการโหลดหน้าเว็บซ้ำ คุณอาจต้องบังคับให้การคลิกโฆษณาเปิดภายนอก WKWebView เช่น หากคุณโฮสต์เกม H5 และต้องการรักษาสถานะของแต่ละเกม

• การป้อนอัตโนมัติไม่รองรับข้อมูลบัตรเครดิตใน WKWebView ซึ่งอาจทำให้ผู้ลงโฆษณาได้รับ Conversion ของอีคอมเมิร์ซน้อยลง และส่งผลเสียต่อการสร้างรายได้จากเนื้อหาเว็บ

• Google Sign-In ไม่มี การรองรับใน WKWebView

คู่มือนี้จะแสดงขั้นตอนที่แนะนำในการเพิ่มประสิทธิภาพพฤติกรรมการคลิกในการดูเว็บบนอุปกรณ์เคลื่อนที่โดยที่ยังเก็บเนื้อหาการดูเว็บไว้

ข้อกำหนดเบื้องต้น

• ทำตามคู่มือตั้งค่ามุมมองเว็บ

การใช้งาน

ลิงก์โฆษณาสามารถตั้งค่าแอตทริบิวต์เป้าหมาย href เป็น _blank, _top, _self หรือ _parent นอกจากนี้ ลิงก์โฆษณาอาจมีฟังก์ชัน JavaScript อย่างเช่น window.open(url, "_blank") ได้ด้วย

ตารางต่อไปนี้จะอธิบายว่าลิงก์เหล่านี้แต่ละลิงก์ทำงานอย่างไรในข้อมูลพร็อพเพอร์ตี้เว็บ

แอตทริบิวต์เป้าหมาย href รายการ	พฤติกรรมการคลิก WKWebView เริ่มต้น
target="_blank"	ลิงก์ที่ไม่ได้จัดการโดยข้อมูลพร็อพเพอร์ตี้เว็บ
target="_top"	โหลดลิงก์ซ้ำในมุมมองเว็บที่มีอยู่
target="_self"	โหลดลิงก์ซ้ำในมุมมองเว็บที่มีอยู่
target="_parent"	โหลดลิงก์ซ้ำในมุมมองเว็บที่มีอยู่
ฟังก์ชัน JavaScript	พฤติกรรมการคลิก WKWebView เริ่มต้น
window.open(url, "_blank")	ลิงก์ที่ไม่ได้จัดการโดยข้อมูลพร็อพเพอร์ตี้เว็บ

ทำตามขั้นตอนต่อไปนี้เพื่อเพิ่มประสิทธิภาพพฤติกรรมการคลิกในอินสแตนซ์WKWebView

1. ตั้งค่า WKUIDelegate บนอินสแตนซ์ WKWebView

   • นำ webView(_:createWebViewWith:for:windowFeatures:) ไปใช้

2. ตั้งค่า WKNavigationDelegate บนอินสแตนซ์ WKWebView ของคุณ

   • นำ webView(_:decidePolicyFor:decisionHandler:) ไปใช้
   สำคัญ: ต้องตั้งค่าผู้รับมอบสิทธิ์ทั้ง 2 รายให้บันทึกการคลิก href และ JavaScript

3. พิจารณาว่าจะเพิ่มประสิทธิภาพลักษณะการทำงานของ URL การคลิกหรือไม่

   • ตรวจสอบว่าพร็อพเพอร์ตี้ navigationType ในออบเจ็กต์ WKNavigationAction เป็นประเภทคลิกที่คุณต้องการเพิ่มประสิทธิภาพหรือไม่ ข้อมูลโค้ดจะตรวจหา .linkActivated ซึ่งจะใช้กับการคลิกลิงก์ที่มีแอตทริบิวต์ href เท่านั้น

     หมายเหตุ: การคลิก JavaScript เช่น window.open(...) เป็นประเภท .other

   • ตรวจสอบพร็อพเพอร์ตี้ targetFrame ในออบเจ็กต์ WKNavigationAction หากแสดงผล nil หมายความว่าเป้าหมายของการนำทางคือหน้าต่างใหม่ เนื่องจาก WKWebView จัดการการคลิกดังกล่าวไม่ได้ จึงต้องจัดการคลิกเหล่านี้ด้วยตนเอง

4. เลือกว่าจะเปิด URL ในเบราว์เซอร์ภายนอก SFSafariViewController หรือมุมมองเว็บที่มีอยู่ ข้อมูลโค้ดแสดงวิธีเปิด URL ที่ออกไปจากเว็บไซต์โดยการแสดง SFSafariViewController

ตัวอย่างโค้ด

ข้อมูลโค้ดต่อไปนี้แสดงวิธีเพิ่มประสิทธิภาพพฤติกรรมการคลิกข้อมูลพร็อพเพอร์ตี้เว็บ ตัวอย่างเช่น ระบบจะตรวจสอบว่าโดเมนปัจจุบันแตกต่างจากโดเมนเป้าหมายหรือไม่ วิธีนี้เป็นเพียงวิธีการหนึ่งเนื่องจากเกณฑ์ที่คุณใช้อาจแตกต่างกันไป

Swift

import GoogleMobileAds
import SafariServices
import WebKit

class ViewController: UIViewController, WKNavigationDelegate, WKUIDelegate {

  override func viewDidLoad() {
    super.viewDidLoad()

    // ... Register the WKWebView.

    // 1. Set the WKUIDelegate on your WKWebView instance.
    webView.uiDelegate = self;
    // 2. Set the WKNavigationDelegate on your WKWebView instance.
    webView.navigationDelegate = self
  }

  // Implement the WKUIDelegate method.
  func webView(
      _ webView: WKWebView,
      createWebViewWith configuration: WKWebViewConfiguration,
      for navigationAction: WKNavigationAction,
      windowFeatures: WKWindowFeatures) -> WKWebView? {
    guard let url = navigationAction.request.url,
        let currentDomain = webView.url?.host,
        let targetDomain = url.host else { return nil }

    // 3. Determine whether to optimize the behavior of the click URL.
    if didHandleClickBehavior(
        url: url,
        currentDomain: currentDomain,
        targetDomain: targetDomain,
        navigationAction: navigationAction) {
      print("URL opened in SFSafariViewController.")
    }

    return nil
  }

  // Implement the WKNavigationDelegate method.
  func webView(
      _ webView: WKWebView,
      decidePolicyFor navigationAction: WKNavigationAction,
      decisionHandler: @escaping (WKNavigationActionPolicy) -> Void)
  {
    guard let url = navigationAction.request.url,
        let currentDomain = webView.url?.host,
        let targetDomain = url.host else { return decisionHandler(.cancel) }

    // 3. Determine whether to optimize the behavior of the click URL.
    if didHandleClickBehavior(
        url: url,
        currentDomain: currentDomain,
        targetDomain: targetDomain,
        navigationAction: navigationAction) {
      return decisionHandler(.cancel)
    }

    decisionHandler(.allow)
  }

  // Implement a helper method to handle click behavior.
  func didHandleClickBehavior(
      url: URL,
      currentDomain: String,
      targetDomain: String,
      navigationAction: WKNavigationAction) -> Bool {
    // Check if the navigationType is a link with an href attribute or
    // if the target of the navigation is a new window.
    guard navigationAction.navigationType == .linkActivated ||
      navigationAction.targetFrame == nil,
      // If the current domain does not equal the target domain,
      // the assumption is the user is navigating away from the site.
      currentDomain != targetDomain else { return false }

    // 4.  Open the URL in a SFSafariViewController.
    let safariViewController = SFSafariViewController(url: url)
    present(safariViewController, animated: true)
    return true
  }
}

Objective-C

@import GoogleMobileAds;
@import SafariServices;
@import WebKit;

@interface ViewController () <WKNavigationDelegate, WKUIDelegate>

@property(nonatomic, strong) WKWebView *webView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  // ... Register the WKWebView.

  // 1. Set the WKUIDelegate on your WKWebView instance.
  self.webView.uiDelegate = self;
  // 2. Set the WKNavigationDelegate on your WKWebView instance.
  self.webView.navigationDelegate = self;
}

// Implement the WKUIDelegate method.
- (WKWebView *)webView:(WKWebView *)webView
  createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration
             forNavigationAction:(WKNavigationAction *)navigationAction
                  windowFeatures:(WKWindowFeatures *)windowFeatures {
  NSURL *url = navigationAction.request.URL;
  NSString *currentDomain = webView.URL.host;
  NSString *targetDomain = navigationAction.request.URL.host;

  // 3. Determine whether to optimize the behavior of the click URL.
  if ([self didHandleClickBehaviorForURL: url
      currentDomain: currentDomain
      targetDomain: targetDomain
      navigationAction: navigationAction]) {
    NSLog(@"URL opened in SFSafariViewController.");
  }

  return nil;
}

// Implement the WKNavigationDelegate method.
- (void)webView:(WKWebView *)webView
    decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction
                    decisionHandler:
                        (void (^)(WKNavigationActionPolicy))decisionHandler {
  NSURL *url = navigationAction.request.URL;
  NSString *currentDomain = webView.URL.host;
  NSString *targetDomain = navigationAction.request.URL.host;

  // 3. Determine whether to optimize the behavior of the click URL.
  if ([self didHandleClickBehaviorForURL: url
      currentDomain: currentDomain
      targetDomain: targetDomain
      navigationAction: navigationAction]) {

    decisionHandler(WKNavigationActionPolicyCancel);
    return;
  }

  decisionHandler(WKNavigationActionPolicyAllow);
}

// Implement a helper method to handle click behavior.
- (BOOL)didHandleClickBehaviorForURL:(NSURL *)url
                       currentDomain:(NSString *)currentDomain
                        targetDomain:(NSString *)targetDomain
                    navigationAction:(WKNavigationAction *)navigationAction {
  if (!url || !currentDomain || !targetDomain) {
    return NO;
  }

  // Check if the navigationType is a link with an href attribute or
  // if the target of the navigation is a new window.
  if ((navigationAction.navigationType == WKNavigationTypeLinkActivated
      || !navigationAction.targetFrame)
      // If the current domain does not equal the target domain,
      // the assumption is the user is navigating away from the site.
      && ![currentDomain isEqualToString: targetDomain]) {

     // 4.  Open the URL in a SFSafariViewController.
    SFSafariViewController *safariViewController =
        [[SFSafariViewController alloc] initWithURL:url];
    [self presentViewController:safariViewController animated:YES
        completion:nil];
    return YES;
  }

  return NO;
}

ทดสอบการนำทางหน้าเว็บ

หากต้องการทดสอบการเปลี่ยนแปลงการนำทางหน้าเว็บ ให้โหลด

https://webview-api-for-ads-test.glitch.me#click-behavior-tests

ลงในมุมมองเว็บของคุณ คลิกลิงก์แต่ละประเภทเพื่อดูลักษณะการทำงานในแอป

โปรดตรวจสอบสิ่งต่อไปนี้

• แต่ละลิงก์จะเปิด URL ที่ต้องการ
• เมื่อกลับไปที่แอป ตัวนับของหน้าทดสอบจะไม่รีเซ็ตเป็น 0 เพื่อตรวจสอบว่ายังมีการรักษาสถานะหน้าเว็บไว้