デスクトップアプリ

RevIQは、Web技術でUIを描画するあらゆるデスクトップアプリで動作します。アプリがウィンドウ内でHTMLを表示していれば、RevIQで収益化できます。

対応フレームワーク

Electron：rev-utils ヘルパーによる公式サポート（下記参照）
Tauri
NW.js、CEF、Wails、Neutralino など、Chromiumまたはwebviewベースのフレームワーク
Webviewを組み込んだネイティブアプリ：WebView2（Windows）、WKWebView（macOS）、WebKitGTK（Linux）

Webサイトと同じ方法で、アプリが読み込むページにRevIQスクリプトを追加してください。フロントエンドを参照してください。そのうえで、アプリが以下の 2つのデスクトップ要件を満たしていることを確認してください。

デスクトップ要件

広告のクリックはユーザーのデフォルトブラウザで開く。 広告がクリックされたら、アプリのウィンドウを遷移させるのではなく、デフォルトブラウザでランディングページを開いてください。リンクは実際のクリックに応じた場合のみ開きます。ユーザーが操作していない遷移やポップアップ、広告が開始したファイルダウンロードはブロックしてください。
標準的なブラウザのUser Agentを送信する。 多くのフレームワークは、User Agent文字列にフレームワーク名やアプリ名（例：Electron/…、MyApp/…）を追加します。これらを削除し、通常のブラウザと同じ文字列にしてください。非標準のUser AgentはIVT（無効なトラフィック）としてフラグが立てられる可能性があります。

Electron

rev-utils が両方の要件を処理します。

インストール

rev-utilsライブラリをインストールして、Electronセットアップに広告の完全な互換性を追加します。パッケージは随時更新される場合があります。

npm i -D rev-utils@https://r2.reviq.app/rev-utils-v1.0.3.tgz

使い方

new BrowserWindow でウィンドウを作成した後、ウィンドウと electron グローバルを setupRevUtils に渡します。

main.js

const { setupRevUtils } = require("rev-utils");

// ここでグローバルのelectronをインポートしていることに注意！
const electron = require("electron"); 
// このモジュールオブジェクトからインポートを分割代入できます
const { BrowserWindow } = electron;

const myWindow = new BrowserWindow();

setupRevUtils(myWindow, electron);

内部的に、setupRevUtils はウィンドウに対して2つの関数を呼び出します

setupLinkHandler は広告を開き（悪意のある動作をブロックします！）
setUserAgent はUser Agent文字列から非標準の部分を削除します。これにより IVT（無効なトラフィック）としてフラグが立てられる可能性があります。

Tauri

RevIQスクリプトと広告枠を配置したページを自社ドメインに用意し（フロントエンドを参照）、標準的なUser Agentを送信し、広告のクリックをユーザーのブラウザで開く子webviewで表示します。

src-tauri/src/ads.rs

use tauri::webview::{NewWindowResponse, WebviewBuilder};
use tauri::{LogicalPosition, LogicalSize, WebviewUrl, Window};
use tauri_plugin_opener::OpenerExt;

// A standard Chrome User Agent. Ad providers don't recognize Tauri's default.
const ADS_USER_AGENT: &str = "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36";

pub fn add_ads_webview(window: &Window) -> tauri::Result<()> {
    let url = "https://your-domain.com/app-ads.html".parse().unwrap();
    let builder = WebviewBuilder::new("ads", WebviewUrl::External(url))
        // Ads render in iframes, so the click script must run in every frame.
        .initialization_script_for_all_frames(include_str!("ads-init.js"))
        .user_agent(ADS_USER_AGENT)
        // Ad clicks go through open_ad_link, never through new windows.
        .on_new_window(|_, _| NewWindowResponse::Deny);

    window.add_child(
        builder,
        LogicalPosition::new(0.0, 0.0),
        LogicalSize::new(300.0, 250.0),
    )?;
    Ok(())
}

#[tauri::command]
pub fn open_ad_link(app: tauri::AppHandle, url: String) {
    // Only web pages; never file:// or custom schemes.
    if url.starts_with("https://") || url.starts_with("http://") {
        let _ = app.opener().open_url(url, None::<String>);
    }
}

Window::add_child はTauriの unstable 機能に含まれます。src-tauri/Cargo.toml の tauri で有効にしてください: tauri = { version = "2", features = ["unstable"] }。

このスクリプトはwebviewのすべてのフレームで実行されます。広告はiframe内に描画されるため、各フレームがクリックを通知してリンクを自社ページに渡し、自社ページは実際のクリック直後に限りそれを開きます。

src-tauri/src/ads-init.js

// Runs in every frame of the ads webview.
const AD_PAGE_ORIGIN = "https://your-domain.com";
// How long after a click an ad may open its landing page.
const CLICK_WINDOW_MS = 1000;

// Your page (the top frame) opens a landing page only right after a real click.
if (window.top === window) {
  let lastClick = -Infinity;
  window.addEventListener("message", (event) => {
    if (event.data?.adClick) lastClick = performance.now();
    if (
      event.data?.adOpenUrl &&
      performance.now() - lastClick < CLICK_WINDOW_MS
    ) {
      lastClick = -Infinity;
      window.__TAURI_INTERNALS__?.invoke("open_ad_link", {
        url: event.data.adOpenUrl,
      });
    }
  });
}

// Every frame, ad iframes included, reports clicks and hands links to the
// top frame instead of navigating.
document.addEventListener(
  "click",
  (event) => {
    window.top.postMessage({ adClick: true }, AD_PAGE_ORIGIN);
    const link = event.target.closest?.("a");
    if (link?.href) {
      event.preventDefault();
      window.top.postMessage({ adOpenUrl: link.href }, AD_PAGE_ORIGIN);
    }
  },
  true,
);

window.open = (url) => {
  if (url) window.top.postMessage({ adOpenUrl: String(url) }, AD_PAGE_ORIGIN);
  return null;
};

openerプラグインとコマンドを登録します。

src-tauri/src/main.rs

tauri::Builder::default()
    .plugin(tauri_plugin_opener::init())
    .invoke_handler(tauri::generate_handler![ads::open_ad_link])

広告ページは自社ドメインから読み込まれる（リモートコンテンツ）ため、capability でそのオリジンを許可しない限り、Tauriはコマンドの呼び出しをブロックします。ads webviewに必要な1つのコマンドだけを許可します:

src-tauri/capabilities/ads.json

{
  "$schema": "../gen/schemas/remote-schema.json",
  "identifier": "ads",
  "webviews": ["ads"],
  "remote": { "urls": ["https://your-domain.com"] },
  "permissions": ["core:default", "allow-open-ad-link"]
}

そのコマンド用の権限を定義します:

src-tauri/permissions/open-ad-link.toml

[[permission]]
identifier = "allow-open-ad-link"
description = "Allow the ads webview to open an ad's landing page in the browser."
commands.allow = ["open_ad_link"]

Windowsでは、広告webviewのトラッキング防止レベルをなしに設定してください。with_webview から ICoreWebView2Profile3::SetPreferredTrackingPreventionLevel を COREWEBVIEW2_TRACKING_PREVENTION_LEVEL_NONE で呼び出します。設定しない場合、WebView2は入札者がリピーターを識別するためのCookieをブロックし、入札額が下がります。

その他のフレームワーク

各フレームワークのAPIで2つの要件を満たしてください。webviewに標準的なブラウザのUser Agentを設定し、広告フレームからのリンククリックと window.open を、実際のクリック直後に限りシステムブラウザで開きます。完全なパターンは上記のTauriの例を参照してください。

ここに記載されていないフレームワークをお使いですか？Webコンテンツを描画できれば動作します。セットアップでお困りの場合は、RevIQの担当者までお問い合わせください。

はじめに

クイックスタート

デスクトップアプリ

対応フレームワーク

デスクトップ要件

Electron

インストール

使い方

Tauri

その他のフレームワーク

​対応フレームワーク

​デスクトップ要件

​Electron

​インストール

​使い方

​Tauri

​その他のフレームワーク

対応フレームワーク

デスクトップ要件

Electron

インストール

使い方

Tauri

その他のフレームワーク