今回使用するプレイヤーはgithubで公開されている、clapprを使いたいと思います
clapprはHLSのLive及びVODを再生する事が出来るJavaScriptを使ったプレイヤーです
デスクトップPCやMacは勿論、FlashPlayerが入っていない最近のスマートフォンでも視聴する事が出来ます
このプレイヤーの優秀なところは、DVRに対応しているという事。その他にも多くのプラグインに対応しているので、色々と使えそうです
とりあえずサンプルのVODページを作成してみました（再生出来ない場合はリンク切れを起こしてるかもしれません・・・）
作り方は非常に簡単で、以下のタグを表示したいWebサーバーに追加するだけです
まず、ヘッダーに以下の文字列を追加します
<script type=“text/javascript“ src=“https://cdn.jsdelivr.net/clappr/latest/clappr.min.js“></script>
次に、表示したいページに以下のタグを追加します
<div id=“player“></div>
<script> var player = new Clappr.Player({source: “http://your.video/here.mp4“, parentId: “#player“}); </script>
変更をするのは、http://your.video/here.mp4の部分です
ここに再生したいHLSのURLを記入します（例：http://~.m3u8まで）
もしも再生が出来ない、という場合は以下の原因が考えられます
・HLSで使用不可能なフォーマットを使っている（例：音声にMP3など）
・Wowza側にCORSの設定がされていない
・そもそもタグが閉じられていない
CORSはCross-Origin Resource Sharingの略で、WowzaとWebサーバーが別のところにある場合に発生します
この辺を読んでみると分かりやすいかもしれません
要するに、Wowzaから出てくるデータをWebサーバー経由で出す場合にWowzaでCORSの設定をしないといけないという話です
WowzaでCORS設定
WowzaのCORS設定は、Wowza4.4からWebインターフェース上から操作して設定できるようになりました
各アプリケーション内の設定からチェックボックスを入れ、サーバーの再起動を行うだけで完了します
この設定はLiveだけでなくVODでも当然有効に出来るので、配信で使用するアプリケーションごとに設定を行いましょう
これでWowzaを使った配信までの流れの説明は終わります
次回からはWowzaを使った大規模配信向けのロードバランシングとかを掲載しようと思います