WEBカメラからの映像配信マニュアル

2016年6月30日12時をもちまして Flash Media Server の提供を終了いたします。
詳しくはこちらをご覧ください。

WEB カメラで動画をリアルタイム配信してみましょう

WEB カメラで映像配信

Flash Media Server を使えば、ご自宅のパソコンに付けた WEB カメラを使ってペットの動画を会社から確認できたり、 WEB サイト上からリアルタイムで WEB カメラを通した映像を配信できるようになります。

映像配信の方法

WEB カメラを購入する

何はともあれ、WEB カメラがないと映像を配信できません。 現在は安いものだと 1,000 円代の WEB カメラもたくさんありますのでお気軽に手に入れることができます。


バーチャルホストを作成します

コントロールパネルメニュー内 [ その他 ] から「 Flash Media Server 」へお進みください。

1) 「バーチャルホストの作成」をクリックします。

2) バーチャルホストが作成されました。

3) 「 rtmp 」 の欄をメモしておいてください

※ rtmp は 「 rtmp://ユーザー名.fms.heteml.jp 」 という形になります。


サンプルファイルをダウンロードしてください

簡単に WEB カメラから動画を配信できるサンプルファイルをご用意しましたので、 下記のリンクよりサンプルファイルをダウンロードしてください。


ダウンロードした watch.zip を解凍します

ダウンロードした watch.zip を解凍ソフトで解凍してください。
解凍すると以下のファイル構成となります。

  • send.html
    - 動画配信用の html ファイルです。
  • send.swf
    - 動画配信用の swf ファイルです。
  • send.fla
    - 動画送信用 flash ファイルです。デザインを変更される場合はこちらを編集してください。
  • receive.html
    - 動画受信用の html ファイルです。
  • receive.swf
    - 動画受信用の swf ファイルです。
  • receive.fla
    - 動画受信用 flash ファイルです。デザインを変更される場合はこちらを編集してください。
  • config.xml
    - 設定用のファイルです。rtmp などの記述を行います。
  • readme.txt
    - 説明が記述されているテキストファイルです。

config.xml ファイルをテキストエディタ等で編集します。

設定をお客様の FMS の環境に合わせるために config.xml を編集します。
config.xml ファイルをテキストエディタ(メモ帳や秀丸など)で開き、 3 行目の 「 ****** 」 の部分をコントロールパネルにある rtmp 名に変更してください。 「 /watch 」 の箇所はそのままにしておいてください。


FTP ソフトでサーバに接続し、環境を整えます。

サーバに接続すると

folderアイコン apps
folderアイコン web

の 2 つのフォルダが見つかると思います

まず、「 apps 」 フォルダの中に 「 watch 」 フォルダを作成してください。
「 watch 」 は 「 config.xml 」 ファイルの 3 行目の 「 rtmp://******.fms.heteml.jp/watch 」 の末尾にある 「 watch 」 と同じものを記載しています。 こちらの名前を変更された場合は必ずフォルダ名も変更してください。 また、作成された 「 watch 」 フォルダのパーミッションを 「 707 」 に変更してください

作成後は以下のようなフォルダ構成になります。
※ 括弧内はパーミッションを示しています。

folderアイコン apps (755)
┗ folderアイコン watch (707)
folderアイコン web (755)

必要なファイルを web フォルダにアップロードします。

web フォルダに下記の 5 ファイルをアップロードしてください。

  • send.html
    - 動画配信用の html ファイルです。
  • send.swf
    - 動画配信用の swf ファイルです。
  • receive.html
    - 動画受信用の html ファイルです。
  • receive.swf
    - 動画受信用の swf ファイルです。
  • config.xml
    - 設定用のファイルです。rtmp などの記述を行います。

ここまでくれば、あとは動画の確認をするだけです。


動画の配信を確認してみましょう。

send.html ファイルにアクセスします。

WEB カメラを PC に接続したら、先ほど web フォルダにアップロードした、 send.html にアクセスしてください。すると、下記のようにカメラとマイクへのアクセス許可を求めるメッセージが 現れますので、「許可」をクリックしてください。

受信用

そうしますと、WEB カメラで撮影された映像が表示されます。

受信用

次に receive.html ファイルにアクセスしてください。

send.html で動画の送信を確認できたら、次に実際に受信される側の画面の確認を行います。
receive.html にアクセスしてください。

受信用

send.html で撮影されている動画が、receive.html で実際に見ることができれば完成です。
receive.html や receive.fla ファイルなどを加工して、お客様のサイト上などに貼り付けてください。

※ send.html で撮影した動画を receive.html で閲覧する形になります。
逆は行えませんのでご注意ください。


お試しお申し込み

トップヘ戻る