ネットワークからメディア ファイルを開く方法 (HTML)
[ この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]
audio または video 要素のメディア ソースをネットワーク上のメディア ファイルに設定します。
必要条件
このトピックは、JavaScript で基本的な Windows ランタイム アプリを作成する方法を知っていることを前提としています。最初のアプリを作成する方法については、「Create your first Windows Runtime app using JavaScript」をご覧ください。
このトピックでは、HTML の audio 要素と video 要素に習熟していることを前提としています。 audio 要素と video 要素の使用の概要については、「クイック スタート: アプリでのビデオの再生」をご覧ください。
手順
ステップ 1: 概要
audio 要素と video 要素は、JavaScript を使った Windows ランタイム アプリでオーディオ メディアまたはビデオ メディアを再生します。src プロパティは、再生するメディア ファイルを指定します。これには、ネットワーク上のファイル、アプリケーションに含まれているファイル、またはローカル システム上のファイルを指定できます。
ネットワーク上のファイルまたはアプリに埋め込まれたファイルを再生する場合は、src プロパティをファイルのパスに設定します。
ローカル システムや Microsoft OneDrive のファイルを開くには、FileOpenPicker を使ってファイルを取得します。 詳しくは、「FileOpenPicker コントロールを使用してローカル メディア ファイルを開く方法」をご覧ください。
このトピックでは、ネットワーク上のメディア ファイルまたはアプリに埋め込まれたメディア ファイルを src として設定する方法について説明します。
Windows ストア アプリでサポートされるオーディオとビデオのメディア形式について詳しくは、「サポートされるオーディオとビデオの形式」をご覧ください。
ステップ 2: 機能
インターネットからファイル取得する場合は、プロジェクトの Package.appmanifest ファイルで Internet (Client) 機能を設定する必要があります。 機能の宣言について詳しくは、「アプリ機能の宣言」をご覧ください。
ステップ 3: HTML でソースをネットワーク上のファイルに設定する
video 要素の src プロパティを設定するコードを次に示します。
<body>
<video id="mediaVideo" src="https://www.contoso.com/clip.mp4" controls/>
</body>
ステップ 4: JavaScript でソースを設定する
var media = document.getElementById("mediaVideo");
media.src = "https://www.contoso.com/clip2.mp4";