이 가이드에서는 IMA HTML5 SDK를 사용하여 동영상을 오버레이하는 방법을 보여줍니다.
포스터 이미지가 재생될 수 있습니다. 이것은
ad_type=audio_video
가 VAST URL 요청에 설정되어 있습니다. 이렇게 하면
오디오 및 동영상 광고가 모두 적합하며 완전하므로 광고 수익 창출이 개선되었습니다.
지정할 수 있습니다. ad_type
문서
및 오디오 인비디오
콘텐츠
를 참조하세요.
이 가이드에 따라 기본 IMA 통합하거나 동영상 샘플 앱의 오디오 를 참조하세요.
기본 요건
- 동영상 광고용 IMA HTML5 SDK를 구현하는 앱 자세한 내용은 IMA HTML5 시작 가이드 를 참조하세요.
- 오디오 광고가 재생될 때 동영상 플레이어 위에 오버레이되는 기본 포스터 이미지입니다. 게재되지 않도록 할 수 있습니다. 이미지가 다음 위치에 맞추려면 동영상 플레이어의 너비는 동영상의 너비보다 작거나 같아야 합니다. 동영상 플레이어의 높이가 동영상 크기의 최소 75픽셀보다 작아야 합니다. 있습니다.
포스터 이미지 기능 사용 설정
오디오 및 동영상 광고 요청을 하기 전에 audioPosterImageEnabled
를 설정하세요.
기능 플래그를 true
로, audioPosterImageDefaultUrl
기능 플래그를
기본 포스터 이미지 URL을 입력합니다. 이렇게 하려면
ImaSdkSettings.setFeatureFlags()
드림
API를 사용하여 AdDisplayContainer
를 만듭니다. 이 값이 설정되고 오디오 광고가
광고가 재생되는 동안 IMA는 광고와 관련된 이미지를 동영상 플레이어의
있습니다. IMA는 화면에 맞는 가장 큰 컴패니언 광고 이미지를 선택합니다.
동영상 플레이어 내에 있어야 하고 동영상 플레이어보다 최소 75픽셀 짧습니다.
광고의 VAST에 IMA가 오버레이로 사용할 수 있는 이미지가 포함되지 않은 경우,
는 지정된 기본 이미지를 오버레이로 사용합니다.
function initializeIMA() {
console.log('initializing IMA');
adContainer = document.getElementById('ad-container');
google.ima.settings.setFeatureFlags(
{
'audioPosterImageEnabled': true,
'audioPosterImageDefaultUrl':'http://your-ad-overlay/image.png'
});
adDisplayContainer = new google.ima.AdDisplayContainer(adContainer, videoElement);
adsLoader = new google.ima.AdsLoader(adDisplayContainer);
// Let the AdsLoader know when the video has ended
videoElement.addEventListener('ended', function() {
adsLoader.contentComplete();
});
var adsRequest = new google.ima.AdsRequest();
adsRequest.adTagUrl = 'http://your-audio-video-ad-tag';
...
// Pass the request to the adsLoader to request ads
adsLoader.requestAds(adsRequest);
}