ホットプラグ可能な DRM の使用方法 (HTML)

[アーティクル]
02/12/2016

[ この記事は、Windows ランタイムアプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]

MediaProtectionManager を使って、JavaScript を使った Windows ランタイムアプリで、デジタル著作権管理 (DRM) で保護されたコンテンツを有効にできます。

このトピックは、JavaScript で基本的な Windows ランタイムアプリを作成できることを前提としています。初めてのアプリ作成の説明については、「JavaScript を使った初めての Windows ストアアプリの作成」をご覧ください。

以下の手順では、MediaProtectionManager API を使って、コンピューター上の保護されたコンテンツを再生する方法を説明します。

1. MediaProtectionManager オブジェクトを作ります。

このクラスを使うと、アプリケーションで、発生したイベントを受け取るリスナーをアタッチできます。

次のコードサンプルに、MediaProtectionManager オブジェクトの作成方法を示します。

    var mediaProtectionManager = new Windows.Media.Protection.MediaProtectionManager();

2. MediaProtectionManager.Properties プロパティを設定します。

Properties プロパティを使って、情報をメディア保護システムに提供します。現在、設定できるプロパティは 3 つあります。

Windows.Media.ContentProtection.VideoFrameAccessCertificate - フレームサーバーモードでフレームにアクセスするアプリケーションの証明書を表す UINT 8 配列。
Windows.Media.ContentProtection.ContentProtectionSystemId - 保護システム ID を表す GUID。この値により、WMDRM Advanced Streaming Format (ASF) ファイルの保護されたコンテンツを処理するのに使う必要があるサードパーティの保護システムが決まります。
Windows.Media.ContentProtection.ContentProtectionSystemContext - 現在のコンテンツ用にアプリケーションが保護システムに渡す追加のデータを表す UINT 8 配列。

この例は、Properties プロパティの設定方法を示しています。

    mediaProtectionManager.properties["Windows.Media.Protection.MediaProtectionSystemId"] =
        '{F4637010-03C3-42CD-B932-B48ADF3A6A54}';
        // Microsoft.Media.PlayReadyClient.PlayReadyStatics.mediaProtectionSystemId;

3. HTML Video タグまたは XAML MediaElement 上の MediaProtectionManager を設定します。

msSetMediaProtectionManager メソッドを video タグまたは audio タグのインスタンスに設定します。

次のコードサンプルは、ビデオプレーヤーの MediaProtectionManager を設定する方法を示しています。

    video.msSetMediaProtectionManager(mediaProtectionManager);

4. イベントを処理します。

イベントを処理するリスナーをアタッチし、委任を実装して保護タスクを処理します。

ComponentLoadFailed - バイナリデータの読み込みに失敗すると発生します。
RebootNeeded - コンポーネントの更新後に再起動が必要な場合に発生します。
ServiceRequested - コンテンツ保護システムに問題が発生し、アプリケーションによる支援が必要な場合に発生します。

この例は、イベントリスナーの追加方法を示しています。

    mediaProtectionManager.addEventListener("componentloadfailed", componentLoadFailed);
    mediaProtectionManager.addEventListener("servicerequested", serviceRequested);

例

次の例に、メディアファイルを再生するための MediaProtectionManager の設定方法を示します。

var mpmCompletionNotifier;

function btnPlayOnClick()
{
    try
    {
        clearLog();

        var videoPlayer;
        var mediaProtectionManager;
        var mediaFilename;

        logMsg( 'Beginning playback attempt...' );

        videoPlayer = document.getElementById( 'video' );

        logMsg( '--- Setting up video player object' );
        videoPlayer.addEventListener.addEventListener( 'canplay', onCanPlay, false);
        videoPlayer.addEventListener( 'error', onPlayError, false);

        logMsg( '--- Creating new Windows.Media.Protection.MediaProtectionManager' );
        mediaProtectionManager = new Windows.Media.Protection.MediaProtectionManager();

        logMsg( '--- Setting up MediaProtectionManager' );
        mediaProtectionManager.addEventListener( "componentloadfailed", componentLoadFailed, false);
        mediaProtectionManager.addEventListener( "servicerequested", serviceRequested, false);
        mediaProtectionManager.properties["Windows.Media.Protection.MediaProtectionSystemId"] =
            '{F4637010-03C3-42CD-B932-B48ADF3A6A54}'; 
            // Microsoft.Media.PlayReadyClient.PlayReadyStatics.mediaProtectionSystemId;
       
        var registrar = new Windows.Media.MediaExtensionManager();

        registrar.registerByteStreamHandler('Microsoft.Media.PlayReadyClient.PlayReadyByteStreamHandler', '.asf', null);
        registrar.registerByteStreamHandler('Microsoft.Media.PlayReadyClient.PlayReadyByteStreamHandler', '.pyv', null);

        logMsg( '--- Setting MediaProtectionManager to video player' );
        videoPlayer.msSetMediaProtectionManager( mediaProtectionManager );
        
        //playback PR content which has been renamed to .asf
        //media content has been packed with application for now
        logMsg( '--- Setting player source' );
        mediaFilename = 'pr_006_1_01_v4_0_wmv.pyv.asf';
        videoPlayer.src = mediaFilename;
    }
    catch ( e )
    {
        // handle the error.
        logWarning( e, 'btnPlayOnClick' );       
    }
}

function onCanPlay()
{
    var videoPlayer = document.getElementById( 'video' );

    logMsg( 'Attempting to start playback' );

    try
    {
        videoPlayer.play();
    }
    catch ( e )
    {
        logWarning( e, 'onCanPlay' );
        // Handle the error.  
    }
}

function componentLoadFailed( e )
{
    try
    {
        logMsg( e.information.items.size + " failed components!" );
        logMsg( "Components:" );

        //  List the failing components
        for ( var i = 0; i < e.information.items.size; i++ )
        {
            logMsg( e.information.items[i].name + "\nReasons=0x" + e.information.items[i].reasons + '\n'
                                                + "Renewal Id=" + e.information.items[i].renewalId  );
        }

        e.completion.complete( false );
        logMsg( "Resumed source (false)" );
    }
    catch ( e )
    {
        logWarning( e, 'componentLoadFailed' );
        // Handle the error. 
    }
}

function serviceRequested( e )
{
    try
    {
        logMsg( "Service request required before playback can happen, service request type: " + getSRType( e.request ) );

        var serviceRequestOperation = e.request.operation;
        mpmCompletionNotifier = e.completion;
        logMsg( "--- Request type: " + getSRType( e.request )  );

        serviceRequestOperation.enablingActionRequired = function ( sender, enabler ){ onEnablingActionRequired( sender, enabler ); };

        if ( g_fUsePromises )
        {
            logMsg( '--- using promises model ( e.request.then(..) )' );        
            e.request.then( onPlaySRCompleted, onPlaySRError );
        }
        else
        {
            serviceRequestOperation.completed = function ( asyncOp ){ onPlaySRCompleted( asyncOp ); };
            serviceRequestOperation.start();
        }
    }
    catch ( e )
    {
        logWarning( e, 'serviceRequested' );
        // Handle error.  
    }
}

function onPlaySRCompleted( asyncOp )
{
    try
    {
        logMsg( 'Service Request completed with status: ' + getAsyncStatus( asyncOp )  );
        mpmCompletionNotifier.complete( true );
        logMsg( 'after mpmCompletionNotifier.complete( true )' );
    }
    catch ( e )
    {
        logWarning( e, 'onPlaySRCompleted' );
        taef_testFailed( e, 'onPlaySRCompleted', 'playback' );          
    }
}

function onPlaySRError( sender, e )
{
    logWarning( e, 'onPlaySRError' );      
}

function onPlayError( )
{
    logMsg( 'Play back failed' );     
}

ホット プラグ可能な DRM の使用方法 (HTML)

例

その他のリソース

ホットプラグ可能な DRM の使用方法 (HTML)