3

このSO投稿を見つけましたが、古くなっています：HTML5WebページでiPadからローカルビデオを再生します

iOS 6では、ファイルをアップロードするためにカメラロールにアクセスできるようになりました（たとえば、iPadカメラからキャプチャされた.movファイル）。誰にクレジットを与えるかはわかりませんが、入力フィールドを使用してローカルファイルを取得し、それをビデオ要素にロードして再生するjsFiddleを見つけました。これは.movファイルのデスクトップacceptで機能しますが、accept属性から「video / *」を削除すると、入力ファイルでローカルから.movを選択できるようになり、JSでfile.typeを「video/mp4」に強制するとビデオ要素で再生する.mov。

上記で参照されているjsFiddleを参照してください：http：//jsfiddle.net/dsbonev/cCCZ2/embedded/result,js,html,css/presentation/

ただし、これがモバイルサファリで機能する場合、ファイル入力フィールドにプレビューサムネイルとファイル名が表示されていても、ファイルの読み込みに失敗します。「？dl = 1」をblob：urlに連結するページへのリンクを追加しましたが、それをクリックすると、ホストされている.movへのリンクがQuickTimeで再生されても、mSafariが「無効なアドレス」と表示します。最終的には、カメラロールからビデオを選択し、それをhtmlビデオプレーヤーで再生し、（理想的には）後でアクセスできるようにそのファイルのソースパスをデータベースに保存できるようにしたいと考えています。私はどの部分が欠けていますか？

ここで動作しているjsFiddleの編集済みバージョンを参照してください：http： //lt.umn.edu/email/

JS：

playSelectedFile = function playSelectedFileInit(event) {
    var file = this.files[0];
    //var type = file.type;
    var type = "video/mp4";
    var videoNode = document.querySelector('video');
    var canPlay = videoNode.canPlayType(type);
    canPlay = (canPlay === '' ? 'no' : canPlay);

    var message = 'Can play type "' + type + '": ' + canPlay;
    var isError = canPlay === 'no';
    //displayMessage(message, isError);

    if (isError) {
        return;
    }

    var fileURL = URL.createObjectURL(file);

    var tempURL = fileURL+'?dl=1';
    var tempText = '<a href="'+tempURL+'?dl=1">'+tempURL+'?dl=1</a>';
    displayMessage(tempText, isError);

    videoNode.src = fileURL;
}
4

1 に答える 1

0

var videoNode = document.querySelector('video')[0];querySelector を使用する場合に使用します

編集：

そうでない場合は、ビデオ ノードを削除し、正しい src を使用して再度作成してみてください。映画が再生されないという同じ問題がありました。srcを変更してもどこでも機能しないと思います..

于 2013-07-05T14:32:23.227 に答える