サポート問い合わせ先| システムステータス
ページコンテンツ

    ライブSSAIとネイティブSDKを使用したクライアント側のプレロール広告

    このトピックでは、Brightcove Native SDKを使用して、サーバー側の広告挿入(SSAI)が有効になっているライブストリームでクライアント側のプレロール広告を再生する方法を学習します。

    概要

    サーバーサイド広告挿入(SSAI)でライブストリームを配信する場合、ライブモジュールを使用してミッドロール広告ブレイクをリクエストできます。詳細については、ネイティブ SDK でのライブ SSAI の使用に関するドキュメントを参照してください

    ライブ配信を開始する前に、プリロール広告を含めることもできます。これは、視聴者がエンゲージし、短い広告を通して座って喜んでいるときです。この機能を使用すると、クライアント側の IMA プリロール広告を挿入できます。

    要件

    この機能には、次の要件が必要です。

    Brightcoveのネイティブ SDK バージョン

    • Android 6.10.0以上用のネイティブSDK
    • iOS/tvOS 6.7.7以上用のネイティブ SDK

    プラットフォーム

    • アカウントで動的配信が有効になりました

    ライブSSAIでのIMAプリロール広告の実装

    ライブの SSAI ストリームで IMA プリロール広告を再生するには、次の手順に従います。

    1. サーバー側広告挿入(SSAI)を有効にしたライブイベントを作成します。詳細については、以下を参照してください。

    2. IMA プラグインを使用して、クライアント側のプリロール広告を有効にします。詳細については、「ネイティブ SDK を使用したクライアントサイド広告の実装」ドキュメントを参照してください。

    3. ストリーミングを開始します。

    Androidの実装

    この機能では、IMAプラグインとSSAIプラグインの両方を使用します。

    コードサンプル

    この機能を実装するには、次の例を参照してください。

    ライブ広告、SSAI、IMAプリロール広告を組み合わせたコード例を次に示します。

    /**
     * We start by adding some variables that are focused on the CSAI integration:
     * Also make the EventEmitter a global variable, it will be needed in the setupGoogleIMA method below
     */
    private EventEmitter eventEmitter;
    private GoogleIMAComponent googleIMAComponent;
    private String adRulesURL = "YOUR_AD_RULES_URL";
    
    private final String AD_CONFIG_ID_QUERY_PARAM_KEY = "ad_config_id";
    
    // Note that for live SSAI streams, the adConfigId will start with the string "live."
    // Ads will be injected into a live SSAI stream using the cue point API
    private final String AD_CONFIG_ID_QUERY_PARAM_VALUE = "YOUR_AD_CONFIG_ID";
    
    private SSAIComponent plugin;
    
    /**
     * The BasicSSAISampleApp's onCreateMethod, with the setupGoogleIMA method from the AdRulesImaSampleApp added
     */
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        setContentView(R.layout.ssai_activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
        super.onCreate(savedInstanceState);
    
        eventEmitter = brightcoveVideoView.getEventEmitter();
    
        // Here we use the same setupGoogleIMA method as found in the AdRulesImaSampleApp:
        setupGoogleIMA();
    
        final EventEmitter eventEmitter = brightcoveVideoView.getEventEmitter();
        Catalog catalog = new Catalog(eventEmitter, YOUR_ACCOUNT_ID, YOUR_POLICY_KEY);
    
        // Setup the error event handler for the SSAI plugin.
        registerErrorEventHandler();
        plugin = new SSAIComponent(this, brightcoveVideoView);
    
        View view = findViewById(R.id.ad_frame);
        if (view instanceof ViewGroup) {
            // Set the companion ad container,
            plugin.addCompanionContainer((ViewGroup) view);
        }
    
        // Set the HttpRequestConfig with the Ad Config Id configured in
        // your https://studio.brightcove.com account.
        HttpRequestConfig httpRequestConfig = new HttpRequestConfig.Builder()
                .addQueryParameter(AD_CONFIG_ID_QUERY_PARAM_KEY, AD_CONFIG_ID_QUERY_PARAM_VALUE)
                .build();
    
        catalog.findVideoByID("YOUR_VIDEO_ID", httpRequestConfig, new VideoListener() {
            @Override
            public void onVideo(Video video) {
                // The Video Sources will have a VMAP url which will be processed by the SSAI plugin,
                // If there is not a VMAP url, or if there are any requesting or parsing error,
                // an EventType.ERROR event will be emitted.
                plugin.processVideo(video);
            }
        });
    }
    
    // The setupGoogleIMA method, for reference:
    
    /**
     * Setup the Brightcove IMA Plugin.
     */
    private void setupGoogleIMA() {
        // Establish the Google IMA SDK factory instance.
        final ImaSdkFactory sdkFactory = ImaSdkFactory.getInstance();
    
        // Enable logging up ad start.
        eventEmitter.on(EventType.AD_STARTED, new EventListener() {
            @Override
            public void processEvent(Event event) {
                Log.v(TAG, event.getType());
            }
        });
    
        // Enable logging any failed attempts to play an ad.
        eventEmitter.on(GoogleIMAEventType.DID_FAIL_TO_PLAY_AD, new EventListener() {
            @Override
            public void processEvent(Event event) {
                Log.v(TAG, event.getType());
            }
        });
    
        // Enable Logging upon ad completion.
        eventEmitter.on(EventType.AD_COMPLETED, new EventListener() {
            @Override
            public void processEvent(Event event) {
                Log.v(TAG, event.getType());
            }
        });
    
        // Set up a listener for initializing AdsRequests. The Google
        // IMA plugin emits an ad request event as a result of
        // initializeAdsRequests() being called.
        eventEmitter.on(GoogleIMAEventType.ADS_REQUEST_FOR_VIDEO, new EventListener() {
            @Override
            public void processEvent(Event event) {
                // Create a container object for the ads to be presented.
                AdDisplayContainer container = sdkFactory.createAdDisplayContainer();
                container.setPlayer(googleIMAComponent.getVideoAdPlayer());
                container.setAdContainer(brightcoveVideoView);
    
                // Build an ads request object and point it to the ad
                // display container created above.
                AdsRequest adsRequest = sdkFactory.createAdsRequest();
                adsRequest.setAdTagUrl(adRulesURL);
                adsRequest.setAdDisplayContainer(container);
    
                ArrayList<AdsRequest> adsRequests = new ArrayList<AdsRequest>(1);
                adsRequests.add(adsRequest);
    
                // Respond to the event with the new ad requests.
                event.properties.put(GoogleIMAComponent.ADS_REQUESTS, adsRequests);
                eventEmitter.respond(event);
            }
        });
    
        // Create the Brightcove IMA Plugin and pass in the event
        // emitter so that the plugin can integrate with the SDK.
        googleIMAComponent = new GoogleIMAComponent(brightcoveVideoView, eventEmitter, true);
    }
    

    iOSの実装

    この機能では、IMAプラグインとSSAIプラグインの両方を使用します。

    コードサンプル

    この機能を実装するには、次の例を参照してください。


    ページの最終更新日04 Oct 2021