1,000人だと1時間20,000円で、Live中継

インターネットでの生中継はUSTなんかを見ていると、せいぜい2-3時間が多いかと思います。そのためにせっせと機材を用意してもいいのですが、もっと手軽に出来ないかというのがこのアイディアです。
せっかくAzureに”Elevated Privilege + スタートアップ タスク”がついたのですから、フルに活用してみたいと思います。

用意するもの

・クライアント

Silverlight

・サーバー側

Windows Azure Web Role

・エンコーダーPC

Expression Encoder 4 SP1: 勿論、これでなくてもいいですが、お手軽なので

カメラ: 今回は2台用意しました。PC標準添付のものと、USBカメラ

参考とするドキュメント:

iis.net のIIS Smooth Streaming: これがバイブル。

http://learn.iis.net/page.aspx/1017/iis-media-services-content-map/

iis.net のLive Smooth Streaming: 基本はこれを日本語の最新環境で動作確認をしたことになります。

http://learn.iis.net/page.aspx/620/getting-started-with-iis-live-smooth-streaming/

環境構築手順

  1. プレイヤー作成
  2. 配信サーバー設定
  3. エンコード実行

今回サーバー側は、以下の理由で全自動化をやめました。つまり、なんらかの理由でサーバーがReImageなどされた場合は、「2」はRemote Desktop にて手作業で行う必要があります

  • エンコーダーから通常オリジンサーバーにデータを送り、オリジンサーバーは、別の配信サーバーからPullされることで、サーバー側は冗長化をする。この際、サーバー名が毎回変わる
    (参考)
    http://learn.iis.net/page.aspx/690/syndicating-live-smooth-streams-between-servers/
  • 配信開始などは、手動で行う場合が多い。開発時は特に。これにはIISのリモート管理が必要になりますが、現時点でAzure上のIISの設定をリモート管理するとしても、結局GUIから行うので、であれば、必要最低限のポートのみで行う

また、サーバーにはIISMedia64.msi を直接インストールしています。Web Platform Installerも良くありますが、結局、このミドルウェアのメンテナンスをする責任はMicrosoftではなく、自分にあり、であれば、単一ファイルのみのmsiファイルの方が管理の煩雑性もないので。

環境構築手順: 1. クライアントのプレイヤー作成

用意するもの:

今回は、Playerはこらずにあるものを使います。以下のサイトから 「SmoothStreamingPlayer.exe」をダウンロードしてください。

http://go.microsoft.com/?linkid=9738294

exeを実行すると、zip解凍され、[smoothstreamingplayer-2.2010.1001.1.zip] ファイルが生成されます。この中の以下のファイルを、VS2010で使う作業フォルダにコピーしておきます。

  • SmoothStreamingPlayer.html : Silverlight アプリケーションをホストするHTMLファイルです。Silverilghtアプリケーションに各種パラメーターをわたすため、こちらを編集します
  • SmoothStreamingPlayer.xap : こちらは何もいじりません。プレイヤー自身のカスタマイズをする際には、これを作成することになります。

プレイヤーアプリ作成

1) VS2010を起動させ、[ASP.NET 空のWeb アプリケーション] を選択します。任意のプロジェクト名をつけてください。

image

先ほど解凍した、2つのファイルをプロジェクトに追加します。

image

[SmoothStreamingPlayer.html] のファイル名をデフォルトの [default.htm] へ変更します。

image

そう、Silverilghtのアプリを動かすのに、サーバー側で処理をしないのであれば、ASP.NET は要りません。それで、空のプロジェクトを選択しています。

ここで、html ファイルの内容を確認してみてください。「この」サンプルhtmlで大事なのは、60行目 (下のサンプルでは、その中で行数をつけていますが) からになります。

 1:         <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
 2:           <param name="source" value="SmoothStreamingPlayer.xap"/>
 3:           <param name="onError" value="onSilverlightError" />
 4:           <param name="background" value="white" />
 5:           <param name="minRuntimeVersion" value="4.0.50401.0" />
 6:           <param name="autoUpgrade" value="true" />
 7:           <param name="InitParams" value="selectedcaptionstream=textstream_eng,mediaurl=http://streams.smooth.vertigo.com/elephantsdream/Elephants_Dream_1024-h264-st-aac.ism/manifest" />

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

InitParams の mediaurl=

をご自分のLiveSmoothStreamingのパスにすることになります。

 1: http://<servername>/<LiveSmoothStreamingのisml ファイルのパス>/manifest

 

が唯一の編集の場所になります。

  • isml ファイル: これは後で、IIS 上にて決定します。ここでは「LiveSmoothStream」としましょう
  • manifest: このファイルは存在していません。IIS Metha Service に ism (VODのSmoothStreaming) もしくは isml ファイルを指定し、その先にて “manifest” 指定をすると、各クライアントが最初に取りに行く映像ファイルのメタ情報を自動生成します。

パラメータをみるとわかるとおり、外部にある存在しているSmoothStreaming の ismファイルをポイントしていますので、このまま F5 を押して実行します。
以下の画面のようなSmoothStreamingが実行されると思います。image

Windows Azure のcloudapp.net のURLが決まっている場合は、それも含めて以下の通り指定します。

<a href="http://.cloudapp.net/LiveSmoothStreaming.isml/manifest”>http://.cloudapp.net/LiveSmoothStreaming.isml/manifest

ここでは、以下の通りとしました。

http://dahatake-live.cloudapp.net/livesmoothstream.isml/manifest

Silverlight のコードアクセスセキュリティ

プレイヤーと配信サーバーは同じ場所にある必要はありません。そこへの対応も考慮し、Silverlightアプリケーションが配置される、Web サーバーのルート直下に、以下のファイルを置きます。

ファイル名: clientaccesspolicy.xml

 2:     <access-policy>
 3:         <cross-domain-access>
 4:             <policy>
 5:                 <allow-from http-methods="*" http-request-headers="*">
 6:                     <domain uri="*" />
 7:                     <domain uri="http://*" />
 8:                 </allow-from>
 1: <?xml version="1.0" encoding="utf-8"?>
 9:             <grant-to>
 10:                 <resource path="/" include-subpaths="true" />
 11:             </grant-to>
 12:             </policy>
 13:     </cross-domain-access>
 14: </access-policy>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

Windows Azure への IIS Media Service のインストール

さて、ここからが、「Elevated Privilege + スタートアップ タスク」の本領です。
やることは2つです。

  • 起動シェル (バッチ) ファイルの作成
  • 起動ファイルの呼出し

起動シェルの作成

ここではサーバーにIIS Media Service 4.0 をインストールします。繰り返しになりますが、このモジュールのセキュリティパッチ適用やバージョンアップはご自身の責任で行う必要があります。

最初に インストールモジュールを用意します。
「英語」のMicrosoftのダウンロードセンターから、IIS Media 4.0 x64 をダウンロードします。Windows Azure 上には、x64のOSのみが存在していますので、ご留意ください。

http://www.microsoft.com/downloads/en/details.aspx?FamilyID=53f37076-321e-4237-b4af-677e8a83b42b

ダウンロードした [IISMedia64.msi] ファイルを、Visual Studio のプロジェクトに追加します。
ファイルのプロパティを以下の通り変えてください。これをしないとAzure上にファイルが追加されません。

ビルドアクション: コンテンツ

出力ディレクトリ: 常にコピーする

image

次に起動シェルファイルを作ります。

ファイル名: startme.bat  (任意のファイル名で構いません)

 1: msiexec.exe /qn /passive /i iismedia64.msi ADDLOCAL=ALL

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

全部の機能を有効にします。

この startme.bat もAzure上に確実にコピーするため、以下のファイルのプロパティの設定にします。

ビルドアクション: コンテンツ

出力ディレクトリ: 常にコピーする

Windows Azure プロジェクトの追加

ここから作成した、プレイヤーと、IIS設定ファイルを、Azure上にて実行する準備をします。

まず、Visual Studio 2010 にて、既存のソリューションに[新規プロジェクトの追加]をし、[Cloud] から、[Windows Azure プロジェクト] を選択します。

image

次の画面では何も選びません。既存のWeb アプリケーションを追加するためです。

image

作成されたプロジェクトの [ロール] に [ソリューション内のWebロール プロジェクト] を追加します。

image

image

これで、展開すべきWebアプリケーションをWindows Azure に指定できます。

次に、スタートアップタスクを設定します。

ServiceDefinition.csdef ファイルの <WebRole> の中に、以下を追加します。

 1: <Startup>
 2:     <Task commandLine="startme.cmd" executionContext="elevated" taskType="simple" />
 3: </Startup>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

さて、これで準備は完了です。

Windows Azure へのデプロイ

今回はAzure上のLiveSmoothStreamingを Remote Desktop にて行うため、その設定を忘れないでください。Visual Studioでのデプロイ時でもいいですし、デプロイ後にWindows Azureの管理コンソールからでもいいです。

ここでは、Visual Studio からの手順を概要のみを「雰囲気」をお伝えするために記載します。
実際の設定は、マイクロソフトの安納さんのBlogをご参考にしてください。

http://blogs.technet.com/b/junichia/archive/tags/azure+for+itpro/

Cloud のプロジェクトから [発行] を選択します。

image

発行の設定をします。
以下はサンプルです。

image

10分程度で終了すると思います。

環境構築手順: 2. 配信サーバー設定

繰り返しになりますが、PaaSにおいて、この設定は何時失われるかわかりません。そんなに滅多にはないと思いますが、そのリスクはご承知ください。どこかで時間を見つけて、ここも自動化の術を探りますが。

Live Smooth Streaming の構成

詳細はGetting Started with IIS Live Smooth Streaming を参照してください。

まずは Remote Desktop にてログインします。

IIS管理コンソールを立ち上げ、サイトまで移動して、[Media Services] が表示されていれば、スタートアップタスクは正しい動作しています。
ここで、[Live Smooth Streaming Publishing Points] をクリックします

image

Application Pool の設定を更新する必要がありますので、このメッセージをクリックして有効化させます。

image

これで配布ポイントを作成できます。
[Add] を押してLive Smooth Streaming の設定を行います。

image

注意点は、FileNameと

image

[Start publishing point automatically upon first client request] のチェックをオンにする

image

くらいで・・・

後は、[Start Publishing Point] にて開始しましょう。

image

さて、これでエンコーディングを行うところにはいります。

環境構築手順: 3. エンコード実行

ここでは、Expression Encoder 4 SP1 を使用します。

[ライブ ブロードキャスト プロジェクト] を選択します。

image

プリセット選択と適用

画面右側にて、IIS Smooth Streaming の プリセットを選択し (ここでは、[VC-1 IIS スムーズストリーミング低帯域幅] を選択) [適用] ボタンを押します。

image

ストリーミングポイントと接続

さて、ここが一番大事。

画面右下の [出力] にて [ストリーミング] にチェックを入れます。
そうすると、[パブリッシュポイント]が指定できるようになりますので、Azure上のismlファイルを指定します。

例: http://dahatake-live.cloudapp.net/livesmoothstream.isml
image

そして、運命の一瞬! [接続] ボタンを押します。
接続がうまくできると、ボタンに緑色のアイコンがともります。

image

ここでうまくいかない場合は、Azure上のLiveSmoothStreaming が

・正しく開始できているか

・ismlファイル名が正しいか

を確認してみてください。

入力動画の選択

ライブソースかファイルソースを指定します。ちなみに、静止画もファイルソースとして指定した一定時間流せます。
ここでは、PCに接続されているライブカメラ2つで。

複数入力ソースは [キュー] を出すことで切り替えることができます。

image

後は画面真ん中の [開始ボタン] にてアップロードを開始します。生中継の開始ですね。

image

プレイヤーでの動作確認

まだ完全に動作確認ができているわけではありません。一番最初に指定した。HTMLへのLiveSmoothStreamingのURL指定が間違っている可能性があります。

最初に指定したサイトにアクセスしてみてください。

例: http://dahatake-live.cloudapp.net/

環境にもよりますが、20秒から、1分くらい、実際の映像との時間のずれがあると思います。

image

確認したい点

  • ライブ中継中に自分の指定した時間に「戻れる」
  • 相変わらず、好きな時間ポイントへの移動が超高速
  • サーバー側で自動的にアーカイブが取られている。よって、中継終了後も、そのファイルが存在している間は、映像を見ることができる
  • Expression Encoder でもエンコード中に、同時にローカルでアーカイブも取れる。
  • エンコーディング作業は物凄くマシンパワーを使うもの・・・

PCに繋がっているカメラがあれば、多少解像度が悪くとも、見れます。UStreamingもいいのですが、アプリケーションとして簡単に組むことができるSilverilght + HTMLにて、より魅力的なサービスが提供できるのではないでしょうか?

アクセス数にもよりますが、1時間、1,000ユーザーいたとしてですがたれながしにしたとして

Windows Azure Web Role : L x 1 :     41円。x2したとして、82円。

Windows Azure CDN:   10,000 トランザクション 1円 が 1ユーザー2秒に一度として 1,800回。1,000ユーザーで 1,800,000回。180円

Windows Azure CDN:  1GBデータ転送 18円。低帯域幅は、887 kbps, 596 kbps, 400 kbps の3本を同時作成。1秒で、235 kバイト。1時間ですと、おおよそ850Mバイト。ラフにみて、1人1Gで、1人18円。1,000人ですと、18,000円。

全部足して、20,000円くらい。ですかね。

UST ですと、1時間1,000人までですと、1人1ドルなので、10万円くらいいきますね。

CDNは全世界同じ品質ですし、SmoothStreamingは、Webのプロキシやブラウザのキャッシュが効きますので、会社で1人目の分だけが課金対象なので、実際にはもう少しお安くすむかもしれません。

いずれにしても、やってみないことには何ともいえませんが、宜しければ、お試しあれ!

あなたのPCが放送局になる!これはスレートのパワーだと難しい

1,000人だと1時間20,000円で、Live中継」への4件のフィードバック

  1. ピンバック: .NET Clips

  2. SmoothStreamingで配信出来るCDNを探していましたが、無いのであきらめて、Flashを使ってAmazon Cloud Frontで配信するしかないのかな・・・と思っていたらこんな素晴らしいものがMicrosoftからあったなんて・・・(存在は知ってたけど、CDNがあるとは知らなかった・・・)

    この記事を書いていただいて感謝しています。
    まあ、まだ高校生なんで、なんかやるとしたら来年、大学生になってからですがw

    Flashより、Silverlight推しなので、Silverlightを使っていろいろやっていきたいです。

  3. Blobからもsmooth streaming出来るようになれば、CDNを利用した配信で、Silverlightを選択肢から外すことなく、思い存分に利用できますね。
    CDNというか、クラウドを利用することで、事前投資がかなり必要になるものも、個人が簡単に始められるようになりました。
    素晴らしい時代に生まれたと思います(笑)

    ところでひとつ質問なのですが、
    > Windows Azure CDN: 1GBデータ 転送 18円。 低帯域幅 は、887 kbps, 596kbps, 400 kbpsの3本を同時作成。1 秒で 、235 kバイト。1 時間 ですと、おおよそ850Mバイト。ラフにみて、1人1Gで、1人18円。1,000人ですと、18, 000円。
    と書かれていますよね?
    この、1秒間で235kというのは、 887 kbps, 596kbps, 400kbpsを足して8で割った数だと思うのですが。

    僕の認識だと、Smooth StreamingはPCやネットワークの状態に応じてリアルタイムに、最適なビットレートの動画を要求・受信・視聴できるものだと認識しています。

    つまり、 887 kbps, 596kbps, 400 kbpsの3つのビットレートがあれば、どんなに好条件だったとしても、最大で887kbpsであり、3つのビットレートの映像を同時に受信しないのではないでしょうか?
    そうなると、最大でも1秒間で110KBにしかデータ量はならないのではないかと……

    とすると、1時間 1人辺り最高で396MB。
    ラフに見積もって、0.5GB
    すると、1000人で9000円

    その他のゴニョゴニョを足しても10000円で放送出来ることになってしまいます。

    たいした金額差ではないので、実際に人柱すれば良いのかもしれませんが、まだクレジットカードを作れない年齢なもんで……

    もしよろしければ、僕の認識で間違っている点をご指摘いただければ幸いです。

コメントを残す