11

iPadで動作するhtml5ビデオがあります。コントロールを非表示にし、ユーザーがiPadをタップすると、html5ビデオが再生される必要があります。

html5video.jsを使用しています。iPadで表示されるのはポスター画像のみで、iPadをタップしても何も起こりません。以下は私のコードです

<!doctype html>
<html>
 <head>
   <meta name="viewport" content="width=768px, minimum-scale=1.0, maximum-scale=1.0" />
   <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
   <script src="http://vjs.zencdn.net/c/video.js"></script>

   <script>
    var video = document.getElementById('video');
    video.addEventListener('touchstart',function(){
            video.play();
    },false);
</script>
</head>
<body>
   <video id="video" class="video-js vjs-default-skin" preload="auto" width="620" height="860" poster="img/poster.png" data-setup="{}">
    <source src="video/Motion.mp4" type='video/mp4'>
    </video>
</body>
</html>
4

4 に答える 4

19

正しいMIMEタイプでビデオを提供していますか？Dive IntoHTML5による優れたVideoOnthe Webの記事では、ビデオの提供について知っておく必要のあるすべてを網羅しています。記事の一番下（過去のすべてのエンコーディングヘルプ）では、iPhoneとiPadの問題と、正しいMIMEタイプの必要性について説明しています。完全に読む価値は十分にあります。

編集

iOSを使用するには、Accept-Ranges: bytesHTTP応答ヘッダーを含める必要があります。SafariWebコンテンツガイド-サーバーの構成を参照してください。

于 2012-05-09T07:06:40.053 に答える
2

このトリックを試してください（ユーザーが画面をタップしないようにしてください）：

document.addEventListener('touchstart', function(event) {

  video.play();

  // They use this first touch/click event for buffering others video.
  // with this trick 

  video2.play();
  video2.pause();

  // After in your program you can call from 'code' play video.
  // Sum of success buffering per one click is 3 ~ 6 ( android or ios ).


}, false);

私にとっては、Androidタブレットのサムスン、iPhone、iPad2/3で動作します。

更新しました ：

新しいバージョンのブラウザでは、自動再生もデフォルトで有効になっています。成功するには、属性をミュートにする必要があります。

最終的な解決策はありません。たとえば、MacのFirefoxバージョン64はサポートしていませんが、Linuxの同じバージョンは自動再生をサポートしています。そしてとても長い...

于 2013-01-29T12:24:04.013 に答える
1

私の場合、MIMEタイプは正しいのですが、サーバーはクライアントがRangeHTTPヘッダーを使用して部分的なファイルを要求することを許可していませんでした。したがって、mp4ファイルを要求するときにサーバーは「Accept-Ranges：bytes」を送信する必要があります。iPadは、ファイルを完全にダウンロードするように強制された場合、そのファイルのダウンロードを拒否します。

于 2015-12-30T19:32:33.197 に答える
0

私も同じ問題を抱えていました。ビデオはiPadとiPhone4だけで再生されていませんでした。何も機能しませんでした。最後に、.mp4ファイルの形式が間違っていることに気付きました。私はそのファイルを作成しませんでした。もう一度mp4形式に変換した後、動作しました。

于 2015-07-06T16:29:54.323 に答える