カスタム実装

SDK の raw API を使用し、広告の呼び出しやレンダリングなどを任意のタイミングで行うことも可能です。以下に説明する API を用いて、媒体様による追加の実装が必要になります。

インスタンスの作成

広告を管理するコントローラークラスのインスタンスを作成します。コンストラクタには広告枠 ID の指定が必須です。

var ad_controller = new RFP.InFeed.AdController({ adspot_id: 'MjQzOjIw' });

広告リクエストの送信

loadAds() メソッドで広告案件のリクエストを発行し、案件情報取得します。引数として完了後に呼び出されるコールバック関数を指定します。

コールバック関数の第一引数にはエラーオブジェクトが返されます。成功時には null となります。

var on_ad_loaded = function(error) {
    if (error) {
        // エラー処理
    }

    // ...
};

ad_controller.loadAds(on_ad_loaded);

広告案件情報の取り出し

loadAds() でサーバより取得した案件情報は getLoadedAds() メソッドで取り出すことができます。

var ads = ad_controller.getLoadedAds();

getLoadedAds() の返り値は次のような配列です。

[
  {
    "title": "testAd",
    "description": "テスト広告です。",
    "click_url": "https://...",
    "main_image_url": "https://...",
    "ad_id": "123",
    "displayed_advertiser": "テスト広告主提供",
    "optout_click": "onClick=...",
    "cta_text": "インストール"
  },
  ...
]

各パラメータの詳細は広告パラメータの節を参照してください。

広告の表示

getLoadedAds() で取り出した案件情報をもとに、広告を表示させます。表示処理は媒体様で実装していただく必要があります。

インプレッションの送信

広告の表示後、必ず notifyImp() でインプレッションの通知をする必要があります。引数として表示した ad_id を渡します。

var ad_id = ads[0].ad_id;
ad_controller.notifyImp(ad_id);

追加ロード

フィードをさらに読み込んだ場合など、追加で広告をロードする場合について。

loadAd() メソッドを呼び出すごとに、あたらしい広告案件を取得することができます。getLoadedAds() は表示済の案件も含め、これまでに取得した案件をすべて返します。

始めにインスタンス化したコントローラーのインスタンスを使いまわす必要があります。ひとつのインスタンスを使い続けると、重複した案件が返されることはありません。

ここまでの流れを踏まえた実装例

var ad_controller = new RFP.InFeed.AdController({ adspot_id: 'MjQzOjIw' });

var on_ad_loaded = function(error) {
  if (error) {
    // エラー処理
  }

  // 案件の取得
  var ads = ad_controller.getLoadedAds();

  ads.forEach(function(ad) {
    // 広告案件情報をもとに広告を表示 (媒体様実装)
    showAd(ad);

    // インプレッションの通知
    var ad_id = ad.ad_id;
    ad_controller.notifyImp(ad_id);
  });
};

ad_controller.loadAds(on_ad_loaded);

注意事項

サーバから広告情報を取得はページの読み込みごとに行ってください。事前に取得したものをキャッシュし使いまわすことはご遠慮ください。
サーバから取得できる広告案件は、より効果が高いと期待される順に並んでいます。上位の案件は画面上の上位に表示することを推奨します。