Troubleshooting Google SDK IMA + Shaka-Player Pre-Roll Ad Freezing Issue on iOS - Seeking Solutions

286 views

Skip to first unread message

Petrônio Amaral

unread,

Oct 31, 2023, 5:42:28 AM10/31/23

to Interactive Media Ads SDK

I'm implementing Google IMA + Shaka-Player to trigger an ADS (pre-roll) when I click play.

When I click play, the ad appears but it freezes after 1 or 2 seconds, if I click play again it runs until the end and then starts again and when it reaches the end the stream does not start.

I use this same logic without DRM for Android and Desktop and it is working perfectly, however on iOS it is having this problem, I believe I need to adjust something. I've read all the shaka-player and Google IMA documentation and haven't found any information about this error.

Do you have any suggestions to fix this and make the ads appear correctly before and after running the stream?

      var player,adManager;

    async  function initPlayer() {
 

  const video = document.getElementById('video');
  const ui = video['ui'];
  const controls = ui.getControls();
  player = controls.getPlayer();
  window.player = player;
  window.ui = ui;       

        container = ui.getControls().getClientSideAdContainer();
        adManager = await player.getAdManager();
        adManager.initClientSide(container, video);

        window.player = player;
        // Listen for error events.
        player.addEventListener("error", onErrorEvent);


        shaka.polyfill.PatchedMediaKeysApple.install();
        const FairPlayUtils = shaka.util.FairPlayUtils;
        player.getNetworkingEngine().registerRequestFilter(FairPlayUtils.ezdrmFairPlayRequest);
        player.getNetworkingEngine().registerResponseFilter(FairPlayUtils.commonFairPlayResponse);
        player.configure('drm.initDataTransform', FairPlayUtils.ezdrmInitDataTransform);

        await secondPart();


      }

      function onErrorEvent(event) {
        // Extract the shaka.util.Error object from the event.
        shakaOnError(event.detail);
      }

      function shakaOnError(error) {
        // alert(error);
        console.log(error);
        console.error("Error code", error.code, "object", error);
        if (window.player) {
          window.player.detach();
        }
      }

      async function secondPart() {

        adManager = await player.getAdManager();

          try {

            
            var ADS = "https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=&YYYY=";

            const adsRequest = new google.ima.AdsRequest();
            
            adsRequest.adTagUrl = ADS;
            adManager.requestClientSideAds(adsRequest);

              } catch (error) {
                console.debug(error);
                console.warn("Ads code has been prevented from running. " + "Proceeding without ads.");
              }

        /**********************************************************************/

        const response = await fetch(CERTIFICATE_PATH);
        if (!response.ok) {
          alert("Could not get certificate!");
          return;
        }
        // const certificate = await response.arrayBuffer();
        const cert = await response.arrayBuffer();

        player.configure({
          drm: {
            servers: {
              // "com.apple.fps.1_0": FAIRPLAY_STAGE
              "com.apple.fps": FAIRPLAY_STAGE
            },
            advanced: {
              // "com.apple.fps.1_0": {
              "com.apple.fps": {
                serverCertificate: new Uint8Array(cert)
              }
            }
          }
        });

        player.configure('drm.initDataTransform', function (initData) {
          const skdUri = shaka.util.StringUtils.fromBytesAutoDetect(initData);
          const contentId = skdUri;
          const cert = player.drmInfo().serverCertificate;
          return shaka.util.FairPlayUtils.initDataTransform(initData, contentId, cert);
        });


        player.getNetworkingEngine().registerRequestFilter((type, request, context) => {
          if (type != shaka.net.NetworkingEngine.RequestType.LICENSE) {
            return;
          }
          const uri = request.uris[0];
          const FairPlayUtils = shaka.util.FairPlayUtils;
          const contentId = FairPlayUtils.defaultGetContentId(request.initData);
          const newUri = uri.replace('^assetId^', contentId);
          request.uris = [newUri];
          request.headers['Content-Type'] = 'application/octet-stream'
        });


      



 // Listening To Ad Events 
  const eventsAdManager = [
    shaka.ads.AdManager.AD_PROGRESS,
    shaka.ads.AdManager.AD_RESUMED,
    shaka.ads.AdManager.AD_STARTED,
    shaka.ads.AdManager.AD_FIRST_QUARTILE,
    shaka.ads.AdManager.AD_MIDPOINT,
    shaka.ads.AdManager.AD_THIRD_QUARTILE,
    shaka.ads.AdManager.AD_COMPLETE,
    shaka.ads.AdManager.ALL_ADS_COMPLETED
  ];

  eventsAdManager.forEach((events) => {
    adManager.addEventListener(
      events,
      (e) => {
       console.debug(`EVENT: ${e.type}`);
      //all-ads-completed
       
      },
      false
    );
  });


        try {

          await player.load(manifestURI);          
          console.log("The video has now been loaded!");
        } catch (exception) {
          console.log(exception);
        }

        

      }

  
   
     function buttonPlay(){

      video.play();
       console.log("buttonPLAY clicked @@@@@ ");
     }
    


      document.addEventListener('shaka-ui-loaded', initPlayer);

IMA SDK

unread,

Nov 1, 2023, 9:58:49 AM11/1/23

to petr...@dv4.com, ima...@googlegroups.com

Hi Petronio,

Unfortunately the Shaka Player integration of the IMA SDK has been heavily customized by the Shaka player team, and as such, we recommend reaching out to the shaka player team via Github for these issues.

Thanks,

Greg Schoppe
IMA SDK Team