个人中心
gpt4 book ai didi

javascript - android webview 集成 google ima

转载 作者：行者123 更新时间：2023-12-03 04:54:24 27 4
gpt4 key购买 nike

我一直在尝试将我的应用程序与 webview 集成，webview 是 google 提供的 html5 sdk 的示例，该示例可以在网络中运行，但不能在 android webview Assets 中运行。错误是

"02-28 12:33:00.279: I/chromium(15835): [INFO:CONSOLE(124)] "Uncaught TypeError: Cannot read property 'initialize' of undefined", source: file:///android_asset/index2.html (124)"

我正在使用 eclipse 来开发我的应用程序。谢谢。

<html>
  <head>
    <title>IMA HTML5 Simple Demo</title>
    <!--link rel="stylesheet" type="text/css" href="file:///android_asset/style.css"-->
  <style>
    #mainContainer {
      position: relative;
      width: 640px;
      height: 360px;
	}

	#content, #adContainer {
	  position: absolute;
	  top: 0px;
	  left: 0px;
	  width: 640px;
	  height: 360px;
	}

	#contentElement {
	  width: 640px;
	  height: 360px;
	  overflow: hidden;
	}

	#playButton {
	  margin-top:10px;
	  vertical-align: top;
	  width: 350px;
	  height: 60px;
	  padding: 0;
	  font-size: 22px;
	  color: white;
	  text-align: center;
	  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
	  background: #2c3e50;
	  border: 0;
	  border-bottom: 2px solid #22303f;
	  cursor: pointer;
	  -webkit-box-shadow: inset 0 -2px #22303f;
	  box-shadow: inset 0 -2px #22303f;
	}
  </style>
  
  </head>

  <body>
    <div id="mainContainer">
      <div id="content">
        <video id="contentElement">
          <source src="http://rmcdn.2mdn.net/Demo/vast_inspector/android.mp4"></source>
          <source src="http://rmcdn.2mdn.net/Demo/vast_inspector/android.webm"></source>
        </video>
      </div>
      <div id="adContainer"></div>
    </div>
    <button id="playButton">Play</button>
    <script type="text/javascript" src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
    <!--script type="text/javascript" src="file:///android_asset/ads.js"></script-->
	<script>
  // Copyright 2013 Google Inc. All Rights Reserved.
// You may study, modify, and use this example for any purpose.
// Note that this example is provided "as is", WITHOUT WARRANTY
// of any kind either expressed or implied.

var adsManager;
var adsLoader;
var adDisplayContainer;
var intervalTimer;
var playButton;
var videoContent;

function init() {
  videoContent = document.getElementById('contentElement');
  playButton = document.getElementById('playButton');
  playButton.addEventListener('click', playAds);
  setUpIMA();
}

function setUpIMA() {
  // Create the ad display container.
  createAdDisplayContainer();
  // Create ads loader.
  adsLoader = new google.ima.AdsLoader(adDisplayContainer);
  // Listen and respond to ads loaded and error events.
  adsLoader.addEventListener(
      google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED,
      onAdsManagerLoaded,
      false);
  adsLoader.addEventListener(
      google.ima.AdErrorEvent.Type.AD_ERROR,
      onAdError,
      false);

  // Request video ads.
  var adsRequest = new google.ima.AdsRequest();
  adsRequest.adTagUrl = '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=';

  // Specify the linear and nonlinear slot sizes. This helps the SDK to
  // select the correct creative if multiple are returned.
  adsRequest.linearAdSlotWidth = 640;
  adsRequest.linearAdSlotHeight = 400;

  adsRequest.nonLinearAdSlotWidth = 640;
  adsRequest.nonLinearAdSlotHeight = 150;

  adsLoader.requestAds(adsRequest);
}


function createAdDisplayContainer() {
  // We assume the adContainer is the DOM id of the element that will house
  // the ads.
  adDisplayContainer = new google.ima.AdDisplayContainer(
      document.getElementById('adContainer'), videoContent);
}

function playAds() {
  // Initialize the container. Must be done via a user action on mobile devices.
  videoContent.load();
  adDisplayContainer.initialize();

  try {
    // Initialize the ads manager. Ad rules playlist will start at this time.
    adsManager.init(640, 360, google.ima.ViewMode.NORMAL);
    // Call play to start showing the ad. Single video and overlay ads will
    // start at this time; the call will be ignored for ad rules.
    adsManager.start();
  } catch (adError) {
    // An error may be thrown if there was a problem with the VAST response.
    videoContent.play();
  }
}

function onAdsManagerLoaded(adsManagerLoadedEvent) {
  // Get the ads manager.
  var adsRenderingSettings = new google.ima.AdsRenderingSettings();
  adsRenderingSettings.restoreCustomPlaybackStateOnAdBreakComplete = true;
  // videoContent should be set to the content video element.
  adsManager = adsManagerLoadedEvent.getAdsManager(
      videoContent, adsRenderingSettings);

  // Add listeners to the required events.
  adsManager.addEventListener(
      google.ima.AdErrorEvent.Type.AD_ERROR,
      onAdError);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED,
      onContentPauseRequested);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
      onContentResumeRequested);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.ALL_ADS_COMPLETED,
      onAdEvent);

  // Listen to any additional events, if necessary.
  adsManager.addEventListener(
      google.ima.AdEvent.Type.LOADED,
      onAdEvent);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.STARTED,
      onAdEvent);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.COMPLETE,
      onAdEvent);
}

function onAdEvent(adEvent) {
  // Retrieve the ad from the event. Some events (e.g. ALL_ADS_COMPLETED)
  // don't have ad object associated.
  var ad = adEvent.getAd();
  switch (adEvent.type) {
    case google.ima.AdEvent.Type.LOADED:
      // This is the first event sent for an ad - it is possible to
      // determine whether the ad is a video ad or an overlay.
      if (!ad.isLinear()) {
        // Position AdDisplayContainer correctly for overlay.
        // Use ad.width and ad.height.
        videoContent.play();
      }
      break;
    case google.ima.AdEvent.Type.STARTED:
      // This event indicates the ad has started - the video player
      // can adjust the UI, for example display a pause button and
      // remaining time.
      if (ad.isLinear()) {
        // For a linear ad, a timer can be started to poll for
        // the remaining time.
        intervalTimer = setInterval(
            function() {
              var remainingTime = adsManager.getRemainingTime();
            },
            300); // every 300ms
      }
      break;
    case google.ima.AdEvent.Type.COMPLETE:
      // This event indicates the ad has finished - the video player
      // can perform appropriate UI actions, such as removing the timer for
      // remaining time detection.
      if (ad.isLinear()) {
        clearInterval(intervalTimer);
      }
      break;
  }
}

function onAdError(adErrorEvent) {
  // Handle the error logging.
  console.log(adErrorEvent.getError());
  adsManager.destroy();
}

function onContentPauseRequested() {
  videoContent.pause();
  // This function is where you should setup UI for showing ads (e.g.
  // display ad timer countdown, disable seeking etc.)
  // setupUIForAds();
}

function onContentResumeRequested() {
  videoContent.play();
  // This function is where you should ensure that your UI is ready
  // to play content. It is the responsibility of the Publisher to
  // implement this function when necessary.
  // setupUIForContent();

}

// Wire UI element references and UI event listeners.
init();

  </script>
  </body>
</html>

最佳答案

对于网络，IMA SDK 仅支持桌面网络(在成熟的浏览器中)或移动网络(Android 上的 Chrome 或 iOS 上的 Safari)。在 WebView 对象内构建的实现可能会引发错误，因为 WebView 不是成熟的浏览器，并且可能不具备 IMA 工作所需的所有功能。

有关兼容性，请检查 this page 。

关于javascript - android webview 集成 google ima，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42500356/

27 4 0
文章推荐： javascript - JavaScript 中的重构模式
文章推荐： javascript - ChartJS onclick填充区域(雷达图)
文章推荐： javascript - 为什么这个数组原型(prototype)不起作用？
文章推荐： javascript - 序列化查询以选择匹配或部分匹配的名称
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com