コメント:ユーザーの許可を取得した後、ローカルファイルを再生できます。入力ノードをページに挿入し、ファイルとしてタイプを指定し、URLをオーディオまたはビデオのSRC値に設定します。
この期間中、開発者はしばしば同じ質問を繰り返し尋ねるのが見られますが、なぜSRC属性を設定してローカルメディアファイルを再生できないのですか?たとえば、video.src = d:/test.mp4。
これは、ユーザーの許可が事前に取得されない限り、ブラウザ内のJavaScriptがローカルリソース(ファイルシステム、カメラ、マイクなど)に直接アクセスできないためです。また、ブラウザがこの制限を実装する必要があります。 JavaScriptがローカルファイルシステムに誤ってアクセスできる場合、ユーザーのプライバシーデータを盗むことが簡単になると想像してください。ユーザーがネットワーク上のWebページにアクセスすると、マシンに保存されているクレジットカード番号、パスワード、会社のシークレットファイル、およびその他のプライバシーファイルが、ユーザーが耐えられない悪意のあるJavaScriptプログラムによって遠いサーバーにアップロードされた可能性があります。
ユーザーの許可を取得した後、ローカルファイルを再生できます。これが方法です。
入力ノードをページに挿入し、ファイルとしてタイプを指定します。複数のファイルを再生する必要がある場合は、属性を複数追加できます。ファイルノードが更新されたら、コールバック関数を登録し、コールバック関数のurl.createobjecturl関数を呼び出して、選択したばかりのファイルのURLを取得し、URLをオーディオまたはビデオのSRC値に設定します。
コードの例は次のとおりです。
<html>
<body>
<入力型= "file" onchange = "oninputfilechange()">
<Audio Controls Autoplay Loop>ブラウザはHTML5 Audio </Audio>をサポートできません
<スクリプト>
function oninputfilechange(){
var file = document.getElementById( 'file')。ファイル[0];
var url = url.createobjecturl(file);
console.log(url);
document.getElementByID( "Audio_Id")。src = url;
}
</script>
</body>
</html>
このコードは、Chrome 30とFirefox 24でテストされ、渡されました。IEには互換性の問題がいくつかあります(IE8および以前のバージョンは間違いなく機能しません)。IEはHTML5をうまくサポートしておらず、IE10が関連APIを実装するかどうかはわかりません。