サポート サポート問い合わせ先 | システムステータス システムステータス
ページ内容

    ステップバイステップ: Player 運営

    このドキュメントでは、 Player Management API.

    賃貸システムの概要

    このステップバイステップドキュメントでは、次の作業を行います。

    • 作る player
    • 更新する player ビデオを自動再生する
    • カスタマイズする player プラグインを追加する
    • の構成を表示する player

    STARTED GET

    このステップバイステップのドキュメントが取るアプローチは、curlステートメントを使用して Player サービスAPI。 コマンドラインでcurlツールを使用して、URL構文でデータを転送します。 curlの詳細については、以下から入手できます。 http://curl.haxx.se.

    このステップバイステップの文書では、単純さのためにcurlを使用する必要はありません。 もちろん、あなたの好きな言語を使ってAPIと通信することができます。 チェックアウト セットアップ Player 管理サンプル これは、基本認証、AJAXおよびJavaScriptを使用して、 player、あなたのすべてを表示 players、削除 playerSなど

    APIの使用を開始する前に、いくつかの予備的な手順を実行する必要があります。 これらは:

    • Studioにログインします。 複数のアカウントがある場合は、ドロップダウンを使用して、新しいアカウントを作成するアカウントを選択します players。 資格情報システムが適切に機能するには、このアカウントの管理者権限が必要です。 ユーザーに管理者権限があるかどうかわからない場合は、[ユーザー設定]ページに移動して、ユーザーとその役割を一覧表示します。
    • Studioで選択したことを確認してください ホーム モジュールのリストから。 ページの左上隅には、アカウント名のすぐ下に、あなたの名前をコピーすることができます アカウントID.
      コピーするアカウントID
    • コマンドラインで次のように入力して、アカウントID値を環境変数に割り当てます。
              export ACCOUNT_ID=YourAccountID
              
              
    • 認証はcurlステートメントの一部としてアカウントの電子メールアドレスを指定することで処理され、APIはパスワードを要求します。 電子メールアドレスは頻繁に使用されるので、その値を環境変数に割り当てることもできます。
              export EMAIL=YourEmailAddress
              
              

    これで、APIの使用を開始できます。

    作る player

    これで、 player を呼び出して Player Management API。 このAPIコールの詳細は、 Player Management API 概要 資料。 次のcurlステートメントをコピーしてコマンドラインに貼り付けることをお勧めします。

    次の手順は、 player.

    1. 最初のcurlステートメントは、 player 名前と説明を割り当てます。 このステートメントをコマンドラインに貼り付けて、 入力しますパスワードを入力するよう求められます。
              curl \
                --header "Content-Type: application/json" \
                --user $EMAIL \
                --request POST \
                --data '{
                  "name": "My New Player Name v2",
                  "description": "My new player description"
                  }' \
                https://players.api.brightcove.com/v1/accounts/$ACCOUNT_ID/players
              

      サーバーから応答データがJSON形式で返されることがわかります。

              {
                "id": "S1qN4xeG7",
                "url": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html",
                "embed_code": "<iframe src='//players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>",
                "embed_in_page": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/in_page.embed",
                "preview_url": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html",
                "preview_embed_in_page": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/in_page.embed",
                "preview_embed_code": "<iframe src='//preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>"
              }
              
    2. あなたを見る player 次の値のXNUMXつ(またはすべて)を使用して(この時点では、ビデオはありません) player、ただし新しく作成した動画を使用して動画を公開できます player Studioを使用):

    Video Cloud ビデオ

    もちろん、 player あなたのビデオを使用して Video Cloud としょうかん。 を使用する代わりに media JSONデータのセクションでは、 video_cloud セクション。 以下のカールステートメントは、 player を使用した作成 Video Cloud 動画のID。

            curl \
              --header "Content-Type: application/json" \
              --user $EMAIL \
              --request POST \
              --data '{
                "name": "Video Cloud CURL 10 March",
                "configuration": {
                  "video_cloud": {
                    "video": "4093372393001"
                  }
                }
              }' \
            https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players
            

    応答は、作成時の応答と論理的に同等です。 player 使用して media / sources / src 上記のように。

            {
            "id": "HJyMlHiuZ",
            "url": "http://players.brightcove.net/1507807800001/HJyMlHiuZ_default/index.html",
            "embed_code": "<iframe src="//players.brightcove.net/1507807800001/HJyMlHiuZ_default/index.html" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen=""></iframe>",
            "embed_in_page": "http://players.brightcove.net/1507807800001/HJyMlHiuZ_default/in_page.embed",
            "preview_url": "http://preview-players.brightcove.net/v1/accounts/1507807800001/players/HJyMlHiuZ/preview/embeds/default/master/index.html",
            "preview_embed_code": "<iframe src="//preview-players.brightcove.net/v1/accounts/1507807800001/players/HJyMlHiuZ/preview/embeds/default/master/index.html" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen=""></iframe>"
            }
            
            

    あなたが見ることができます player返されたURL値を参照しての設定を変更し、 index.htmlを 〜へ config.json。 のために player 上記のcurlステートメントによって作成された場合、次のようになります。

            {
              "account_id": "1507807800001",
              "compatibility": true,
              "embed_id": "default",
              "player": {
                "template": {
                  "name": "single-video-template",
                  "version": "6.5.0"
                }
              },
              "player_id": "HJyMlHiuZ",
              "player_name": "Video Cloud CURL 10 March",
              "updated_at": "2017-08-23T17:48:55.622Z",
              "video_cloud": {
                "policy_key": "BCpkADawqM2FnBS3InxzDxU4bd4otJdHKvexlXfhs_XgSj3jmBHAsV2xANIvSPd4KiakMbiQM5oYJPopOcJD7vNnPWGPGsnXCO3_ZGdjPmur53WV_a4JUPWHCLt5oiyekN44i24jZzHMB6hT",
                "video": "4093372393001"
              }
            }
            

    policy_key に自動的に追加されます playerの設定。 これは、 Policy API、それはあなたに特別な制限を課すことを可能にします player 別のビデオにアクセスするため。 つまり、ポリシーキーは、どの動画をいつ表示できるかを制御します。

    更新します player

    これで、作成の基本が完了しました player。 次に、の簡単な更新方法を学びます player。 この場合は、 player でビデオを自動再生するには player(ブラウザで許可されている場合)。

    1. から返されたJSON player 作成と id 値が表示されました。 これをコピーして PLAYER_ID 環境変数。
              export PLAYER_ID=YourPlayerID
              
              
    2. を更新する player HTTPを使用します PATCH 方法。 更新するデータを送信します player。 設定します autoplay オプション true。 次のcurlステートメントをコピーアンドペーストして実行します。
              curl \
                --header "Content-Type: application/json" \
                --user $EMAIL \
                --request PATCH \
                --data '{
                  "autoplay": true
                }' \
              https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration
              
    3. サーバーがデータを含むかどうかを確認する id , preview_url preview_embed_code 次のJSON形式の値:
              {
                "id": "S1qN4xeG7",
                "preview_url": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html",
                "preview_embed_in_page": "http://preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/in_page.embed",
                "preview_embed_code": "<iframe src='//preview-players.brightcove.net/v2/accounts/1507807800001/players/S1qN4xeG7/preview/embeds/default/master/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>"
              }
              
    4. いずれかの preview_url or preview_embed_code 値の変化を確認する playerの設定。 自動再生が本当であることがわかります。
    5. 今、あなたは公開します player ユーザーが表示できる正しい場所にそれをプッシュします。 次のコマンドを入力します。
              curl \
              --header "Content-Type: application/json" \
              --user $EMAIL \
              --request POST \
              https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/publish
              
              

      一度 player 公開されます playerプレビュー版とは異なります。 公開バージョンは、次の点でプレビューバージョンと異なります。

      • JavaScriptとCSSは縮小され、連結されて、 player 直接。
      • 低解像度バージョンのポスター画像が生成され、ページにインライン化されて、要求セットアップ時間が長いネットワーク(すなわち、セルラーデータネットワーク)の知覚される負荷時間を改善する。
      • 以前のバージョンの player 更新が公開された後に問題が発見された場合に回復できるように保存されます。
    6. 公開からのJSON応答を確認します player 次のように表示されます。
              {
              "id": "S1qN4xeG7",
              "url": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html",
              "embed_code": "<iframe src='//players.brightcove.net/1507807800001/S1qN4xeG7_default/index.html' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>",
              "embed_in_page": "http://players.brightcove.net/1507807800001/S1qN4xeG7_default/in_page.embed"
              }
              
              
    7. のいずれかを使用します player 確実に公開するための実装 player 正常に機能しています。

    カスタマイズする player

    あなたは、あなたをカスタマイズすることができます player プラグインを使用します。 に既存のプラグインを含める方法を学ぶことができます player または自分で構築する ステップバイステップ:プラグイン開発.

    この場合、非常にシンプルな既存のプラグインを使用して、ビデオメッセージにテキストメッセージをオーバーレイします。 以下は、HTML段落タグを作成するプラグインのコードです。 注:クラス名とテキストが段落に割り当てられ、次に既存の player。 このプラグインはあなたの便宜のためにすでに存在し、次の場所にあります //solutions.brightcove.com/bcls/video-js/new-player/first-plugin.js.

            videojs.registerPlugin('firstPlugin', function() {
              var player = this,
              overlay = document.createElement('p');
              overlay.className = 'vjs-overlay';
              overlay.innerHTML = "First Plugin Working!";
              player.el().appendChild(overlay);
            });
            
            

    この特定の例では、黒色の背景上の黒色のテキストを防止するために段落のスタイルを設定する必要があります。 段落のクラス名に適用されるスタイルは次のとおりです。 このスタイルシートは、あなたの便宜のためにすでに存在しています。 //solutions.brightcove.com/bcls/video-js/new-player/first-plugin.css.

            .vjs-overlay {
              background-color: #333333;
              color: white;
              font-size: 2em;
              padding: 5px;
              position: absolute;
              top: 100px;
              left: 20px;
              width: 150px;
            }
            
            

    curlステートメントを使用してビデオソースとポスター画像を割り当てるのと同じように、curlステートメントを使用して player 以下

    • プラグインのコードを含むJavaScriptファイルの場所
    • スタイルシートの場所
    • で使用するプラグイン名 player
    1. プラグインを機能させるには、次のcurlステートメントを使用します。
              curl\
              --header "Content-Type: application/json"\
              --user $EMAIL\
              --request PATCH\
              --data '{
                "scripts": [
                  "//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.js"
                 ],
                 "stylesheets": [
                  "//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.css"
                 ],
                 "plugins": [{
                   "name": "firstPlugin"
                 }]
                }'\
              https: //players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration
              
    2. 次のcurlステートメントを使用して、更新された player。 これは、前のセクションで公開に使用した公開コードと同じです。 player.
              curl \
                --header "Content-Type: application/json" \
                --user $EMAIL \
                --request POST \
                https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/publish
              
    3. 返されたURLをコピーしてブラウズします。 プラグインが機能しており、プラグインのテキストが表示されていることがわかります。
      プラグインテキスト
      プラグインテキスト

    プラグインが追加されたとき player Player Management API、Brightcoveが提供するプラグインであっても、独自に作成したカスタムプラグインであっても、プラグインは player コード自体。

    表示設定

    行った作業をデバッグして確認するには、多くの場合、 playerの設定。

    1. これを行うには、 GET メソッドと configuration URL。
              curl \
                --header "Content-Type: application/json" \
                --user $EMAIL \
                --request GET \
                https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration
              
              
    2. JSON構成の応答が次のようになっていることを確認します。
              {
                "media": {
                  "poster": {
                    "highres": "//solutions.brightcove.com/bcls/assets/images/Tiger.jpg"
                  },
                  "sources": [{
                    "type": "application/x-mpegURL",
                    "src": "//solutions.brightcove.com/bcls/assets/videos/Tiger.m3u8"
                  }, {
                    "type": "video/mp4",
                    "src": "//solutions.brightcove.com/bcls/assets/videos/Tiger.mp4"
                  }]
                },
                "compatibility": true,
                "video_cloud": {
                  "video": "4093372393001",
                  "policy_key": "BCpkADawqM3ugPRAtcx48_C4FjXiEiJORcRFnXkeL9siQUpauO_o7SaIhSnYvM24nUCeD74UFG1LMW8vtmaftsO1vYeeOn2iglfvEbG-c0PYwJ_zQCQGsvkrbgrNyEDvbEKjyrsQVXj0DOco"
                },
                "player": {
                  "template": {
                    "name": "single-video-template",
                    "version": "6.7.0"
                  }
                },
                "scripts": ["//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.js"],
                "stylesheets": ["//solutions.brightcove.com/bcls/video-js/new-player/first-plugin.css"],
                "plugins": [{
                  "name": "firstPlugin"
                }]
              }
              

    を見る別の方法 playerの構成は、返されたURL値を参照して、 index.htmlを 〜へ config.json.

    配信システムAPI

    Delivery System API■リポジトリと呼ばれるファイルのグループを管理および配置できます。 これらのファイルはREST APIとgitを介して管理されます。 これらのAPIは、作成または編集するときにほとんどの人が必要とするべきではありません playerただし、他の目的で使用する非常に興味深いAPIのセットになる場合があります。 試してみたい場合は、 ここで行う。 実践的な紹介については、 ステップバイステップ:配送システム の資料をご参照ください。


    ページの最終更新日:12年2020月XNUMX日