メインコンテンツまでスキップ

モバイルアプリ内ウェブページ

Roktは、パートナーがRoktテクノロジーをウェブサイトやモバイルアプリケーションに統合するためのいくつかのSDK統合ソリューションを提供しています。これには、ブラウザベースの統合のためのRokt Web SDKと、ネイティブモバイル統合のためのRokt iOS SDKおよびRokt Android SDKが含まれます。しかし、ブラウザとモバイル技術が組み合わさる場合、考慮すべき特別な点があります。

モバイルアプリケーション内でウェブページがレンダリングされる場合、Web SDKが主要な統合ポイントとなります。このシナリオでは、Web SDKはモバイルまたはデスクトップブラウザ環境と同様に、ウェブページ上に適切なRoktプレースメントとオファーをレンダリングします。しかし、モバイルアプリ環境でのトラフィックリンクの開き方について、統合内で特別な考慮が必要です。

Rokt WebView SDKは、iOSおよびAndroidの一般的なWebView技術への小さな拡張機能であり、Web SDKと連携して、Roktプレースメントからのすべてのトラフィックリンクがデバイスのデフォルトブラウザで正常に開かれるようにします。これにより、顧客の期待されるナビゲーションフローが妨げられることはありません。WebView SDKは、トラフィックリンクの開き方の動作のみを調整し、ホストアプリケーションやウェブサイトの他の側面の動作には影響を与えません。これにより、アプリ内でシームレスな顧客フローが実現され、顧客はオファーにオプトインした後にリンクを正常に開くことができます。

Rokt WebView SDKはどのように機能しますか?

WebView SDKは、ブラウザのユーザーエージェントを変更することで機能し、Roktがモバイルアプリ内のウェブページに配置がレンダリングされたことを識別できるようにします。その後、Roktはリンクを開く動作を修正し、トラフィックリンクがデバイスのデフォルトブラウザで開かれるようにします。

Rokt WebView SDKは、主要なRokt統合ではなく、モバイルアプリケーション内で既に使用されているWebView技術への小さな更新です。Rokt Web SDKがRoktとの主要な統合であり、Rokt WebView SDKはアプリ内からトラフィックリンクが適切に開かれることを保証します。

WebView SDKは、以下の技術を使用しているモバイルアプリケーションに実装できます:

  • iOS用WKWebView
  • Android用Android WebView

Androidアプリケーション

この手順は、Android WebViewをRokt WebViewに置き換えることを前提としています。具体的なアプローチは、WebViewがプログラム的に初期化されているかどうかに依存します。

バージョン

システムバージョン
Rokt WebViewSDK1.0.0
Android バージョン/API レベル4.3+ (API レベル 18)
パッケージマネージャーMaven / Gradle
  1. プロジェクトの build.gradle ファイルのリポジトリ一覧に JitPack maven リポジトリを追加します。
 // ファイル => build.gradle (Project: ....)

allprojects {
repositories {
google()
maven { url "https://jitpack.io" }
}
}
  1. Rokt WebView SDK を追加します。

    アプリモジュールの build.gradle ファイルを開き、roktwebviewsdk ライブラリを dependencies セクションに追加します。x.x.x は最新の Rokt WebView SDK に置き換えてください。

dependencies {
``` implementation 'com.github.ROKT:rokt-webview-sdk-android:x.x.x' ```
}
  1. レイアウトに Rokt WebView SDK を追加します。

    レイアウトファイルで、webView の参照を roktWebView に置き換えます。

    置き換え前:

<?xml version="1.0" encoding="utf-8"?>
<WebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>

置き換え後:

<?xml version="1.0" encoding="utf-8"?>
<com.rokt.roktwebviewsdk.RoktWebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>

または、WebView SDK を onCreate() 内でプログラム的に追加することもできます。例:

WebView myWebView = new RoktWebView(activityContext);
setContentView(myWebView);
  1. ウェブページを読み込む

roktWebView でウェブページを読み込むには、loadUrl() を使用します。

WebView myWebView = (RoktWebView) findViewById(R.id.webview);
myWebView.loadUrl("https://www.rokt.com");

iOSアプリケーション

以下の手順は、iOS用のWKWebViewをRokt WebViewに置き換えることを前提としています。具体的なアプローチは、WebViewがプログラムで初期化されているかどうかに依存します。

バージョン

システムバージョン
Rokt WebViewSDK2.0.0
iOS14.0+
パッケージマネージャーCocoaPods
  1. RoktWebViewSDK ポッドをポッドファイルに追加します。
use_frameworks!
pod 'RoktWebViewSDK'
  1. Rokt WebView SDKをレイアウトに追加します。

    Storyboardで、WKWebViewをRoktWKWebViewカスタムクラスに置き換えます。

CustomClass

または、Rokt WebView SDKをコード内でプログラム的に追加することもできます。例:

import RoktWebViewSDK
...
var roktWKWebView = RoktWKWebView(frame: self.view.frame)
  1. ウェブページを読み込む。

RoktWKWebViewでウェブページを読み込むには、Swiftの場合はload()、Objective-Cの場合はloadRequest()を使用します。

roktWKWebView.load(URLRequest(url: URL(string: "https://www.rokt.com")!))

付録

iOS用のRokt WebViewSDKはCocoaPodsを使用してデプロイされます。CocoaPodsはiOSの依存関係マネージャーで、SwiftとObjective-Cをサポートしています。このステップバイステップガイドは、CocoaPodに精通しており、iOS開発のためにPodをインストールする方法を知っていることを前提としています。もしそうでない場合は、CocoaPodのドキュメントを参照してください。ワークスペースをセットアップするには、このチュートリアルを参照できます。

セキュリティとパフォーマンス

iOSおよびAndroid用のSDKは非常にシンプルで軽量であり、アプリケーション全体のパフォーマンスに与える影響は最小限です。さらに、WebView SDKの唯一の影響はユーザーエージェントを変更することだけなので、Roktプレースメントからのリンクオープン動作以外の動作に影響を与えることはありません。

質問や懸念を解消するために、iOSおよびAndroid用のWebView SDKはオープンソースです。

各SDKの詳細はGitHubで確認できます:

この記事は役に立ちましたか?