javascript - Google Web Designer: initAd() の読み込みが完了したかどうかを確認する

Question

GWD で作成された広告ユニットの画像を動的に変更しようとしています。

handleWebComponentsReady() 関数で initAd() が呼び出された後に呼び出される JSON フィードがあります。

これはローカルで正常に動作し、広告が初期化されてから、アセットのリストを取得するために ajax 呼び出しが行われます。次に、jQuery を使用して画像 src を新しい画像に交換します。

ただし、ライブ サーバーにデプロイした後は機能しません。initAd() 関数の読み込みにかなりの時間がかかるようです。これは、jQuery が操作する img タグを見つけられないという影響があります。

広告が初期化された後、広告自体がレンダリングされる前に呼び出されることを意図した handleAdInitialized() イベント内に ajax 呼び出しを配置し​​ようとしましたが、そうではないようです。

また、機能するが理想的ではない変更を行う前に、ajax 呼び出しにタイムアウトを追加して数秒待機することも試みました。

これが私のフィードのサンプルです。非常にシンプルです

{
   image1: "assets/img1.jpg",
   image2: "assets/img2.png",
   image3: "assets/img3.png",
   image4: "assets/img4.png",
   image5: "assets/img5.png"
}

そしてイベントはこちら

function handleWebComponentsReady(event) {
    // Start the Ad lifecycle.

    setTimeout(function() {
      gwdAd.initAd();
    }, 0);


  }

  /**
   * Handles the event that is dispatched after the Ad has been
   * initialized and before the default page of the Ad is shown.
   */
  function handleAdInitialized(event) {
    $.ajax({
        url: "link-to-feed",
        jsonpCallback: "callback",
        dataType: "jsonp",
        async: false,
        success: function( response ) {
          console.log(response);

          $('#img1').css('background-image','url("' + response.image1 + '")');
          $('#img2').css('background-image','url("' + response.image2 + '")');
          $('#img3').css('background-image','url("' + response.image3 + '")');
          $('#img4').css('background-image','url("' + response.image4 + '")');
          $('#img5').css('background-image','url("' + response.image5 + '")');

        },
        error: function(response){
          console.log("error");
        }
    });
  }

initAd() が完全に終了したことを検出して ajax を呼び出す方法はありますか?

どんな助けでも大歓迎です。

ありがとう