blocks|key|1411049|text|也许你必须为设备专门编码视频，例如：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1411050|<video+id="movie"+width="320"+height="240"+autobuffer+controls>
++<source+src="pr6.ogv"+type='video/ogg;+codecs="theora,+vorbis"'>
++<source+src="pr6.mp4"+type='video/mp4;+codecs="avc1.42E01E,+mp4a.40.2"'>
<source+src="pr6.mp4"+type='video/mp4;+codecs="some+droid+video+codec,+some+droid+audio+codec"'>
</video>|code-block|syntax|javascript|1411051|这里有一些在这里工作的编码配置的示例：|1411052|https://supportforums.motorola.com|offset|length|1411053|entityMap|0|LINK|mutability|MUTABLE|url|https://supportforums.motorola.com/thread/16194;jsessionid=6862B00E1E6AEAC97390681A732A87E1.node0?start=15&tstart=0^0|0|0|0|0|Y|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|X|8|@]|9|@$K|Y|L|Z|1|10]]|A|$]]|$1|M|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]]]

Maybe you have to encode the video specifically for the device eg:

<pre><code>&lt;video id="movie" width="320" height="240" autobuffer controls&gt;
 &lt;source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"'&gt;
 &lt;source src="pr6.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'&gt;
&lt;source src="pr6.mp4" type='video/mp4; codecs="some droid video codec, some droid audio codec"'&gt;
&lt;/video&gt;
</code></pre>

There are some examples of encoding configurations that worked on here:

<a href="https://supportforums.motorola.com/thread/16194;jsessionid=6862B00E1E6AEAC97390681A732A87E1.node0?start=15&amp;tstart=0" rel="nofollow noreferrer">https://supportforums.motorola.com</a>

blocks|key|1195810|text|如果您手动调用video.play()，它应该可以工作：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1195811|<!DOCTYPE+html>
<html>
<head>
++<script>
++++function+init()+{
++++++enableVideoClicks();
++++}

++++function+enableVideoClicks()+{
++++++var+videos+=+document.getElementsByTagName('video')+%7C%7C+[];
++++++for+(var+i+=+0;+i+<+videos.length;+i%2B%2B)+{
++++++++//+TODO:+use+attachEvent+in+IE
++++++++videos[i].addEventListener('click',+function(videoNode)+{
++++++++++return+function()+{
++++++++++++videoNode.play();
++++++++++};
++++++++}(videos[i]));
++++++}
++++}
++</script>
</head>
<body+onload="init()">

++<video+src="sample.mp4"+width="400"+height="300"+controls></video>

++...

</body>
</html>|code-block|syntax|javascript|1195812|entityMap^0|7|C|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

If you manually call <code>video.play()</code> it should work:

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
 &lt;script&gt;
 function init() {
 enableVideoClicks();
 }

 function enableVideoClicks() {
 var videos = document.getElementsByTagName('video') || [];
 for (var i = 0; i &lt; videos.length; i++) {
 // TODO: use attachEvent in IE
 videos[i].addEventListener('click', function(videoNode) {
 return function() {
 videoNode.play();
 };
 }(videos[i]));
 }
 }
 &lt;/script&gt;
&lt;/head&gt;
&lt;body onload="init()"&gt;

 &lt;video src="sample.mp4" width="400" height="300" controls&gt;&lt;/video&gt;

 ...

&lt;/body&gt;
&lt;/html&gt;
</code></pre>

blocks|key|1411174|text|罗曼的回答对我来说很有效--或者至少，它给了我所期望的。在手机的原生应用程序中打开视频与iPhone的操作完全相同。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1411175|调整你的视点，期待视频在它自己的应用程序中全屏播放，并为此进行编码，这可能是值得的。令人沮丧的是，点击视频并不足以让它像iPhone一样播放，但考虑到它只需要一个onclick属性来启动它，这并不是世界末日。|1411176|我的建议，FWIW，是使用海报图像，并使其显而易见，它将播放视频。我目前正在做的一个项目正是做到了这一点，客户对此很满意-当然，他们还免费获得了安卓版本的网页应用程序，因为合同只针对iPhone网页应用程序。|1411177|为了说明起见，下面是一个有效的Android视频标签。很好很简单。|1411178|<video+src="video/placeholder.m4v"+poster="video/placeholder.jpg"+onclick="this.play();"/>|code-block|syntax|javascript|1411179|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|Q|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|R|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|S|8|@]|9|@]|A|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Roman's answer worked fine for me - or at least, it gave me what I was expecting. Opening the video in the phone's native application is exactly the same as what the iPhone does.

It's probably worth adjusting your viewpoint and expect video to be played fullscreen in its own application, and coding for that. It's frustrating that clicking the video isn't sufficient to get it playing in the same way as the iPhone does, but seeing as it only takes an onclick attribute to launch it, it's not the end of the world.

My advice, FWIW, is to use a poster image, and make it obvious that it will play the video. I'm working on a project at the moment that does precisely that, and the clients are happy with it - and also that they're getting the Android version of a web app for free, of course, because the contract was only for an iPhone web app.

Just for illustration, a working Android video tag is below. Nice and simple.

<pre><code>&lt;video src="video/placeholder.m4v" poster="video/placeholder.jpg" onclick="this.play();"/&gt;
</code></pre>

blocks|key|1195936|text|这可能不能准确回答您的问题，但我们使用的是3GP或3GP2文件格式。最好使用rtsp协议，但Android浏览器也会识别3GP文件格式。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1195937|您可以使用类似于|1195938|self.location+=+URL_OF_YOUR_3GP_FILE|code-block|syntax|javascript|1195939|来触发视频播放器。文件将被流式传输，播放结束后，处理将返回给浏览器。|1195940|对我来说，这解决了android设备上当前视频标签实现的许多问题。|1195941|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

This might not exactly answer your question, but we're using the 3GP or 3GP2 file format. Better even to use the rtsp protocol, but the Android browser will also recognize the 3GP file format.

You can use something like

<pre><code>self.location = URL_OF_YOUR_3GP_FILE
</code></pre>

to trigger the video player. The file will be streamed and after playback ends, handling is returned to the browser. 

For me this solves a lot of problems with current video tag implementation on android devices.

blocks|key|1411302|text|将我的Android2.2浏览器指向html5test.com，告诉我视频元素是受支持的，但列出的视频编解码器中没有一个...支持视频元素但没有编解码器似乎有点无意义？除非测试页有问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1411303|但是，我确实发现了与audio元素相同的情况:支持该元素，但不支持音频格式。请看这里：|1411304|http://textopiablog.wordpress.com/2010/06/25/browser-support-for-html5-audio/|1411305|entityMap|0|LINK|mutability|MUTABLE|url|http://html5test.com/|1^0|I|D|0|0|0|0|25|1|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@$A|R|B|S|1|T]]|C|$]]|$1|D|3|E|5|6|7|U|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|V|8|@]|9|@$A|W|B|X|1|Y]]|C|$]]|$1|H|3|-4|5|6|7|Z|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]|P|$5|K|L|M|C|$N|G]]]]

pointing my android 2.2 browser to <a href="http://html5test.com" rel="nofollow noreferrer">html5test.com</a>, tells me that the video element is supported, but none of the listed video codecs... seems a little pointless to support the video element but no codecs??? unless there is something wrong with that test page.

however, i did find the same kind of situation with the audio element: the element is supported, but no audio formats. see here:

<a href="http://textopiablog.wordpress.com/2010/06/25/browser-support-for-html5-audio/" rel="nofollow noreferrer">http://textopiablog.wordpress.com/2010/06/25/browser-support-for-html5-audio/</a>

blocks|key|1411354|text|在我对视频进行正确编码之前，什么都不起作用。请尝试此指南以了解正确的手刹车设置：http://forum.handbrake.fr/viewtopic.php?f=7&t=9694|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1411355|entityMap|0|LINK|mutability|MUTABLE|url|http://forum.handbrake.fr/viewtopic.php?f=7&t=9694^0|14|1E|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

Nothing worked for me until I encoded the video properly. Try this guide for the correct handbrake settings:
<a href="http://forum.handbrake.fr/viewtopic.php?f=7&amp;t=9694" rel="nofollow noreferrer">http://forum.handbrake.fr/viewtopic.php?f=7&amp;t=9694</a>

blocks|key|1411394|text|谷歌(android)手机都支持HTML5，比如Galaxy+S和iPhone。然而，iPhone不支持闪存，而谷歌手机确实支持闪存。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1411395|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

HTML5 is supported on both Google (android) phones such as Galaxy S, and iPhone. iPhone however doesn't support Flash, which Google phones do support.

blocks|key|1411453|text|在mp4容器中尝试使用h.264。我在我的Droid上已经取得了很大的成功，我一直在使用zencoder.com进行格式转换。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1411454|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Try h.264 in an mp4 container. I've had much success with it on my Droid X. I've been using zencoder.com for format conversions.

blocks|key|1196194|text|我在这里介绍了我的一个朋友如何在Nexus+One中解决了在HTML中显示视频的问题：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1196195|我从来没能让视频以内联方式播放。实际上，互联网上的许多人明确提到，自从Honeycomb以来，HTML中的内联视频播放就得到了支持，而我们正在与Froyo和姜饼抗争……此外，对于较小的手机，我认为全屏播放是非常自然的-否则看不到太多。因此，我们的目标是让视频全屏打开。然而，这个线程中提出的解决方案对我们来说并不起作用--单击该元素不会触发任何内容。此外，显示了视频控件，但没有显示海报，因此用户体验更加奇怪。所以他做了以下几件事：|1196196|将本机代码暴露给HTML，以便可以通过javascript调用：|1196197|JavaScriptInterface+jsInterface+=+new+JavaScriptInterface(this);
webView.getSettings().setJavaScriptEnabled(true);
webView.addJavascriptInterface(jsInterface,+"JSInterface");|code-block|syntax|javascript|1196198|代码本身有一个调用本地活动来播放视频的函数：|1196199|public+class+JavaScriptInterface+{
++++private+Activity+activity;

++++public+JavaScriptInterface(Activity+activiy)+{
++++++++this.activity+=+activiy;
++++}

++++public+void+startVideo(String+videoAddress){
++++++++Intent+intent+=+new+Intent(Intent.ACTION_VIEW);
++++++++intent.setDataAndType(Uri.parse(videoAddress),+"video/3gpp");+//+The+Mime+type+can+actually+be+determined+from+the+file
++++++++activity.startActivity(intent);
++++}
}|1196200|然后，在HTML本身，他一直没能让视频标签工作，播放视频。因此，他最终决定覆盖视频的onclick事件，使其成为实际的播放。这对他来说几乎是可行的--除了没有展示任何海报。最奇怪的部分来了-每次设置标记的poster属性时，他都会收到ERROR/AndroidRuntime(7391):+java.lang.RuntimeException:+Null+or+empty+value+for+header+"Host"。最后，他发现了一个非常奇怪的问题--原来他在video标签中保留了source子标签，但从未使用过它。奇怪的是，这正是导致问题的原因。现在看看他对video部分的定义：|offset|length|style|CODE|1196201|<video+width="320"+height="240"+controls="controls"+poster='poster.gif'++onclick="playVideo('file:///sdcard/test.3gp');"+>
+++Your+browser+does+not+support+the+video+tag.
</video>|1196202|当然，您还需要在页面的头部添加javascript函数的定义：|1196203|<script>
++function+playVideo(video){
++++window.JSInterface.startVideo(video);
++}
</script>|1196204|我意识到这不是纯粹的HTML解决方案，而是我们为Nexus+One类型的手机所能做的最好的事情。这个解决方案的所有荣誉都归功于Dimitar+Zlatkov+Dimitrov。|1196205|entityMap^0|0|0|0|0|0|0|16|7|2U|6|39|2L|6H|5|6S|6|7W|5|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|14|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|15|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|16|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|17|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|18|8|@]|9|@]|A|$]]|$1|M|3|N|5|H|7|19|8|@]|9|@]|A|$I|J]]|$1|O|3|P|5|6|7|1A|8|@$Q|1B|R|1C|S|T]|$Q|1D|R|1E|S|T]|$Q|1F|R|1G|S|T]|$Q|1H|R|1I|S|T]|$Q|1J|R|1K|S|T]|$Q|1L|R|1M|S|T]]|9|@]|A|$]]|$1|U|3|V|5|H|7|1N|8|@]|9|@]|A|$I|J]]|$1|W|3|X|5|6|7|1O|8|@]|9|@]|A|$]]|$1|Y|3|Z|5|H|7|1P|8|@]|9|@]|A|$I|J]]|$1|10|3|11|5|6|7|1Q|8|@]|9|@]|A|$]]|$1|12|3|-4|5|6|7|1R|8|@]|9|@]|A|$]]]|13|$]]

Here I include how a friend of mine solved the problem of displaying videos in HTML in Nexus One:

I never was able to make the video play inline. Actually many people on the internet mention explicitly that inline video play in HTML is supported since Honeycomb, and we were fighting with Froyo and Gingerbread... Also for smaller phones I think that playing full screen is very natural - otherwise not so much is visible. So the goal was to make the video open in full screen. However, the proposed solutions in this thread did not work for us - clicking on the element triggered nothing. Furthermore the video controls were shown, but no poster was displayed so the user experience was even weirder. So what he did was the following:

Expose native code to the HTML to be callable via javascript:

<pre><code>JavaScriptInterface jsInterface = new JavaScriptInterface(this);
webView.getSettings().setJavaScriptEnabled(true);
webView.addJavascriptInterface(jsInterface, "JSInterface");
</code></pre>

The code itself, had a function that called native activity to play the video:

<pre><code>public class JavaScriptInterface {
 private Activity activity;

 public JavaScriptInterface(Activity activiy) {
 this.activity = activiy;
 }

 public void startVideo(String videoAddress){
 Intent intent = new Intent(Intent.ACTION_VIEW);
 intent.setDataAndType(Uri.parse(videoAddress), "video/3gpp"); // The Mime type can actually be determined from the file
 activity.startActivity(intent);
 }
}
</code></pre>

Then in the HTML itself he kept on failing make the video tag work playing the video. Thus, finally he decided to overwrite the <code>onclick</code> event of the video, making it do the actual play. This almost worked for him - except for no poster was displayed. Here comes the most weird part - he kept on receiving <code>ERROR/AndroidRuntime(7391): java.lang.RuntimeException: Null or empty value for header "Host"</code> every time he set the <code>poster</code> attribute of the tag. Finally he found the issue, which was very weird - it turned out that he had kept the <code>source</code> subtag in the <code>video</code> tag, but never used it. And weird enough exactly this was causing the problem. Now see his definition of the <code>video</code> section:

<pre><code>&lt;video width="320" height="240" controls="controls" poster='poster.gif' onclick="playVideo('file:///sdcard/test.3gp');" &gt;
 Your browser does not support the video tag.
&lt;/video&gt;
</code></pre>

Of course you need to also add the definition of the javascript function in the head of the page:

<pre><code>&lt;script&gt;
 function playVideo(video){
 window.JSInterface.startVideo(video);
 }
&lt;/script&gt;
</code></pre>

I realize this is not purely HTML solution, but is the best we were able to do for Nexus One type of phone.
All credits for this solution go to Dimitar Zlatkov Dimitrov.

blocks|key|1196251|text|这对我来说很有效：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1196252|<video+id="video-example"+width="256"+height="177"+poster="image.jpg">
<source+src="video/video.mp4"+type="video/mp4"></source>
<source+src="video/video.ogg"+type="video/ogg"></source>
This+browser+does+not+support+HTML5
</video>|code-block|syntax|javascript|1196253|只有当.mp4在顶部并且视频文件不是很大的时候。|1196254|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

This works for me:

<pre><code>&lt;video id="video-example" width="256" height="177" poster="image.jpg"&gt;
&lt;source src="video/video.mp4" type="video/mp4"&gt;&lt;/source&gt;
&lt;source src="video/video.ogg" type="video/ogg"&gt;&lt;/source&gt;
This browser does not support HTML5
&lt;/video&gt;
</code></pre>

Only when the .mp4 is on top and the videofile is not to big.

blocks|key|1196309|text|经过大量的研究，在许多不同的设备上，到目前为止，我已经得出了一个简单的结论:与MOV格式相比，MP4的支持要少得多。因此，我在所有浏览器上使用MOV格式，所有安卓和苹果设备都支持这种格式。我已经检测到设备是移动设备还是桌面浏览器，并相应地设置了SRC：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1196310|if+(IsMobile())+{
++++$('#vid').attr('src',+'/uploads/'+%2B+name+%2B+'.mov');
}
else+{
++++$('#vid').attr('src',+'/uploads/'+%2B+name+%2B+'.webm');++++++++
}

function+IsMobile()+{
++++var+isMobile+=+false;+//initiate+as+false

++++if+(/(android%7Cbb\d%2B%7Cmeego).%2Bmobile%7Cavantgo%7Cbada\/%7Cblackberry%7Cblazer%7Ccompal%7Celaine%7Cfennec%7Chiptop%7Ciemobile%7Cip(hone%7Cod)%7Cipad%7Ciris%7Ckindle%7CAndroid%7CSilk%7Clge+%7Cmaemo%7Cmidp%7Cmmp%7Cnetfront%7Copera+m(ob%7Cin)i%7Cpalm(+os)?%7Cphone%7Cp(ixi%7Cre)\/%7Cplucker%7Cpocket%7Cpsp%7Cseries(4%7C6)0%7Csymbian%7Ctreo%7Cup\.(browser%7Clink)%7Cvodafone%7Cwap%7Cwindows+(ce%7Cphone)%7Cxda%7Cxiino/i.test(navigator.userAgent)
++++++++++++++++%7C%7C+/1207%7C6310%7C6590%7C3gso%7C4thp%7C50[1-6]i%7C770s%7C802s%7Ca+wa%7Cabac%7Cac(er%7Coo%7Cs\-)%7Cai(ko%7Crn)%7Cal(av%7Cca%7Cco)%7Camoi%7Can(ex%7Cny%7Cyw)%7Captu%7Car(ch%7Cgo)%7Cas(te%7Cus)%7Cattw%7Cau(di%7C\-m%7Cr+%7Cs+)%7Cavan%7Cbe(ck%7Cll%7Cnq)%7Cbi(lb%7Crd)%7Cbl(ac%7Caz)%7Cbr(e%7Cv)w%7Cbumb%7Cbw\-(n%7Cu)%7Cc55\/%7Ccapi%7Cccwa%7Ccdm\-%7Ccell%7Cchtm%7Ccldc%7Ccmd\-%7Cco(mp%7Cnd)%7Ccraw%7Cda(it%7Cll%7Cng)%7Cdbte%7Cdc\-s%7Cdevi%7Cdica%7Cdmob%7Cdo(c%7Cp)o%7Cds(12%7C\-d)%7Cel(49%7Cai)%7Cem(l2%7Cul)%7Cer(ic%7Ck0)%7Cesl8%7Cez([4-7]0%7Cos%7Cwa%7Cze)%7Cfetc%7Cfly(\-%7C_)%7Cg1+u%7Cg560%7Cgene%7Cgf\-5%7Cg\-mo%7Cgo(\.w%7Cod)%7Cgr(ad%7Cun)%7Chaie%7Chcit%7Chd\-(m%7Cp%7Ct)%7Chei\-%7Chi(pt%7Cta)%7Chp(+i%7Cip)%7Chs\-c%7Cht(c(\-%7C+%7C_%7Ca%7Cg%7Cp%7Cs%7Ct)%7Ctp)%7Chu(aw%7Ctc)%7Ci\-(20%7Cgo%7Cma)%7Ci230%7Ciac(+%7C\-%7C\/)%7Cibro%7Cidea%7Cig01%7Cikom%7Cim1k%7Cinno%7Cipaq%7Ciris%7Cja(t%7Cv)a%7Cjbro%7Cjemu%7Cjigs%7Ckddi%7Ckeji%7Ckgt(+%7C\/)%7Cklon%7Ckpt+%7Ckwc\-%7Ckyo(c%7Ck)%7Cle(no%7Cxi)%7Clg(+g%7C\/(k%7Cl%7Cu)%7C50%7C54%7C\-[a-w])%7Clibw%7Clynx%7Cm1\-w%7Cm3ga%7Cm50\/%7Cma(te%7Cui%7Cxo)%7Cmc(01%7C21%7Cca)%7Cm\-cr%7Cme(rc%7Cri)%7Cmi(o8%7Coa%7Cts)%7Cmmef%7Cmo(01%7C02%7Cbi%7Cde%7Cdo%7Ct(\-%7C+%7Co%7Cv)%7Czz)%7Cmt(50%7Cp1%7Cv+)%7Cmwbp%7Cmywa%7Cn10[0-2]%7Cn20[2-3]%7Cn30(0%7C2)%7Cn50(0%7C2%7C5)%7Cn7(0(0%7C1)%7C10)%7Cne((c%7Cm)\-%7Con%7Ctf%7Cwf%7Cwg%7Cwt)%7Cnok(6%7Ci)%7Cnzph%7Co2im%7Cop(ti%7Cwv)%7Coran%7Cowg1%7Cp800%7Cpan(a%7Cd%7Ct)%7Cpdxg%7Cpg(13%7C\-([1-8]%7Cc))%7Cphil%7Cpire%7Cpl(ay%7Cuc)%7Cpn\-2%7Cpo(ck%7Crt%7Cse)%7Cprox%7Cpsio%7Cpt\-g%7Cqa\-a%7Cqc(07%7C12%7C21%7C32%7C60%7C\-[2-7]%7Ci\-)%7Cqtek%7Cr380%7Cr600%7Craks%7Crim9%7Cro(ve%7Czo)%7Cs55\/%7Csa(ge%7Cma%7Cmm%7Cms%7Cny%7Cva)%7Csc(01%7Ch\-%7Coo%7Cp\-)%7Csdk\/%7Cse(c(\-%7C0%7C1)%7C47%7Cmc%7Cnd%7Cri)%7Csgh\-%7Cshar%7Csie(\-%7Cm)%7Csk\-0%7Csl(45%7Cid)%7Csm(al%7Car%7Cb3%7Cit%7Ct5)%7Cso(ft%7Cny)%7Csp(01%7Ch\-%7Cv\-%7Cv+)%7Csy(01%7Cmb)%7Ct2(18%7C50)%7Ct6(00%7C10%7C18)%7Cta(gt%7Clk)%7Ctcl\-%7Ctdg\-%7Ctel(i%7Cm)%7Ctim\-%7Ct\-mo%7Cto(pl%7Csh)%7Cts(70%7Cm\-%7Cm3%7Cm5)%7Ctx\-9%7Cup(\.b%7Cg1%7Csi)%7Cutst%7Cv400%7Cv750%7Cveri%7Cvi(rg%7Cte)%7Cvk(40%7C5[0-3]%7C\-v)%7Cvm40%7Cvoda%7Cvulc%7Cvx(52%7C53%7C60%7C61%7C70%7C80%7C81%7C83%7C85%7C98)%7Cw3c(\-%7C+)%7Cwebc%7Cwhit%7Cwi(g+%7Cnc%7Cnw)%7Cwmlb%7Cwonu%7Cx700%7Cyas\-%7Cyour%7Czeto%7Czte\-/i.test(navigator.userAgent.substr(0,+4)))+isMobile+=+true;
++++return+isMobile;
}|code-block|syntax|javascript|1196311|entityMap^0|13|3|1B|3|1Z|3|3E|3|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]|$9|R|A|S|B|C]|$9|T|A|U|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|V|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|W|8|@]|D|@]|E|$]]]|L|$]]

After much research, in many different devices, up to now, I've reached the simple conclusion that <code>MP4</code> is much less supported than <code>MOV</code> format.
So, I'm using <code>MOV</code> format, which is supported by all Android and Apple devices, on all browsers.
I've detected weather the device is a mobile device or a desktop browser, and set the <code>SRC</code> accordingly:

<pre><code>if (IsMobile()) {
 $('#vid').attr('src', '/uploads/' + name + '.mov');
}
else {
 $('#vid').attr('src', '/uploads/' + name + '.webm'); 
}

function IsMobile() {
 var isMobile = false; //initiate as false

 if (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent)
 || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0, 4))) isMobile = true;
 return isMobile;
}
</code></pre>

blocks|key|1196368|text|我试着用.mp4格式在安卓设备上播放视频，但效果不佳。因此，经过反复试验，我将视频转换为.webm格式，并在没有额外javascript或JQuery的情况下编写了以下代码：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1196369|<video+id="video"+class="video"+muted+loop+autoplay>
++++<source+src="../media/some_video.webm"+type="video/webm">
++++Sorry,+your+browser+doesn't+support+embedded+videos.
</video>|code-block|syntax|javascript|1196370|它可以在更老的Android设备上运行(至少到2020年已经有几年的历史了)。|1196371|entityMap^0|4|4|18|5|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|U|8|@]|D|@]|E|$]]|$1|M|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|N|$]]

I tried using the <code>.mp4</code> format to play a video on Android devices but that did not go well. So after some trial and error, I converted the video into the <code>.webm</code> format and following code with no extra javascript or JQuery:
<pre><code>&lt;video id=&quot;video&quot; class=&quot;video&quot; muted loop autoplay&gt;
 &lt;source src=&quot;../media/some_video.webm&quot; type=&quot;video/webm&quot;&gt;
 Sorry, your browser doesn't support embedded videos.
&lt;/video&gt;
</code></pre>
It worked on an older Android device (at least a few years old as of 2020).

According to:

<a href="http://developer.android.com/sdk/android-2.0-highlights.html" rel="noreferrer">http://developer.android.com/sdk/android-2.0-highlights.html</a>

Android 2.0 should support the HTML5 video element. I haven't been able to get this to work using a Motorola Droid, and haven't been able to successfully view a video on any of the HTML5 video example pages out there. Since there currently isn't support for QuickTime or Flash, this is the only other thing I can think of for embedding mp4 video in a web page. Has anyone had any luck with this?

HTML5 <video> element on Android

Android

容器

HTML5

根据以下内容：Android2.0应该支持HTML5视频元素。我还没能用摩托罗拉的Droid实现这个功能，也没能在任何HTML5视频示例页面上成功观看视频。由于目前还不支持QuickTime或Flash，这是我唯一能想到的在网页中嵌入mp4视频的方法。有没有人在这方面有什么收获？

问安卓上的HTML5 <video> element
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问安卓上的HTML5 <video> elementEN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问安卓上的HTML5 <video> element
EN