HTML5 Ö§³ÖÖ±½ÓÔÚä¯ÀÀÆ÷Öв¥·ÅÒôƵºÍÊÓÆµÎļþ£¬²»ÐèҪʹÓÃAbode FlashÕâÑùµÄ²å¼þ¡£
1. ʹÓà video ÔªËØ
¿ÉÒÔÓÃvideo ÔªËØÔÚÍøÒ³ÀïǶÈëÊÓÆµÄÚÈÝ¡£
Æä»ù±¾Ó÷¨ÈçÏ£º
ʹÓÃvideoÔªËØ Video cannot be displayed
´ËÀýÏÔʾЧ¹ûÈçÏ£º
Èç¹ûä¯ÀÀÆ÷²»Ö§³ÖvideoÔªËØ»òÕßÎÞ·¨²¥·ÅÊÓÆµÄÇô±¸ÓÃÄÚÈÝ£¨¿ªÊ¼ºÍ½áÊø±êǩ֮ÄÚµÄÄÚÈÝ£©¾Í»á´úÌæËüÏÔʾ¡£´ËÀýÖУ¬ÏÔʾÁËÒ»¶Î¼òµ¥µÄÎı¾ÏûÏ¢£¬µ«³£Óõļ¼ÇÉÊÇÌṩʹÓ÷ÑHTML5¼¼Êõ£¨ÀýÈçFlash£©µÄÊÓÆµ²¥·Å£¬ÒÔÖ§³Ö¾É°æµÄä¯ÀÀÆ÷¡£
video ÔªËØÓÐÐí¶àÊôÐÔ£¬Ï±íÁгöÁËËüÃÇ£º
1.1 Ô¤ÏȼÓÔØÊÓÆµ
preloadÊôÐÔ¸æËßä¯ÀÀÆ÷£ºµ±Ëü¼ÓÔØÍê°üº¬videoÔªËØµÄÍøÒ³ºó£¬ÊÇ·ñÓ¦¸Ã»ý¼«µØÈ¥ÏÂÔØÊÓÆµ¡£Ô¤ÏȼÓÔØÊÓÆµ¼õÉÙÁËÓû§²¥·ÅʱµÄ³õʼÑÓ³Ù£¬µ«Èç¹ûÓû§²»¹Û¿´ÊÓÆµÔò»áÔì³ÉÍøÂç´ø¿íµÄÀË·Ñ¡£Ï±í½éÉÜÁËÕâ¸öÊôÐÔÔÊÐíÉèÖõÄÖµ¡£
ÔÚ¾ö¶¨ÊÇ·ñÔ¤ÏȼÓÔØÊÓÆµÊ±£¬Ó¦µ±È¨ºâÓû§ÏëÒª¹Û¿´ÊÓÆµµÄ¿ÉÄÜÐÔÓë×Ô¶¯ÔØÈëÊÓÆµÄÚÈÝËùÐèÒªµÄ´ø¿í¡£×Ô¶¯ÔØÈëÊÓÆµ»á´øÀ´¸üƽ»¬µÄÓû§ÌåÑ飬µ«Ëü¿ÉÄÜ»á´ó´óÌáÉý¾Óª³É±¾£¬Èç¹ûÓû§Ã»Óйۿ´ÊÓÆµ¾ÍÀë¿ªÍøÒ³£¬ÄÇôÕâЩ³É±¾¾ÍÀË·ÑÁË¡£
Õâ¸öÊôÐÔµÄmetadataÖµ¿ÉÒÔ±»ÓÃÀ´ÔÚnoneºÍautoÖµÖ®¼ä½¨Á¢ÆðÊÊ¶ÈµÄÆ½ºâ¡£noneÖµµÄÎÊÌâÔÚÓÚÊÓÆµÄÚÈÝ»áÔÚÆÁÄ»ÉÏÏÔʾΪһƬ¿Õ°×ÇøÓò¡£metadataÖµ»áÈÃä¯ÀÀÆ÷»ñÈ¡×ã¹»µÄÐÅÏ¢À´ÏòÓû§Õ¹Ê¾ÊÓÆµµÄµÚÒ»Ö¡£¬¶ø²»±ØÏÂÔØÈ«²¿ÄÚÈÝ¡£
½«noneºÍmetadataÖµÓÃÓÚpreloadÊôÐÔ Video cannot be displayed Video cannot be displayed
´ËÀýչʾÁËÔÚͬһ¸öÎĵµÀïʹÓÃnoneºÍmetadataÖµ£¬ÆäÏÔʾЧ¹ûÈçÏ£¬¿ÉÒÔ¿´µ½ÕâЩֵÈçºÎÓ°Ïìչʾ¸øÓû§µÄÔ¤ÀÀ»Ãæ¡£
PS:metadataÖµÏòÓû§ÌṩÁËÆ¯ÁÁµÄÔ¤ÀÀ»Ã棬µ«ÐèÒªÉ÷ÖØÒ»Ð©¡£µ±ÓÃÍøÂç·ÖÎö¹¤¾ß²âÊÔÕâ¸öÊôÐÔ£¬·¢ÏÖ¾¡¹ÜÖ»ÇëÇóÁËÔªÊý¾Ý£¬µ«ÊÇÓÐЩä¯ÀÀÆ÷ʵ¼ÊÉÏ»áÔ¤ÏÈÏÂÔØÕû¸öÊÓÆµ¡£Æ½ÐĶøÂÛ£¬ä¯ÀÀÆ÷¿ÉÒÔ×ÔÓÉÑ¡ÔñÊÇ·ñºöÂÔpreloadÊôÐÔËù±í´ïµÄÆ«ºÃ¡£µ«ÊÇ£¬Èç¹ûÐèÒªÏÞÖÆ´ø¿íµÄÏûºÄ£¬posterÊôÐÔ¿ÉÄܸüʤһЩ¡£
1.2 ÏÔʾռλͼÏñ
¿ÉÒÔÓÃposterÊôÐÔÏòÓû§³ÊÏÖÒ»ÕÅռλͼÏñ¡£ÕâÕÅͼÏñ»áÏÔʾÔÚÊÓÆµµÄλÖã¬Ö±ÖÁÓû§¿ªÊ¼²¥·Å¡£
ʹÓÃposterÊôÐÔÀ´Ö¸¶¨Õ¼Î»Í¼Ïñ> Video cannot be displayed
ÕâÀïΪÊÓÆµÎļþµÄµÚÒ»Ö¡×öÁËÒ»ÕÅÆÁÄ»½ØÍ¼£¬È»ºóÔÚËüÉÏÃæµþ¼ÓÁ˵¥´Ê Poster£¨º£±¨£©¡£ÕâÕÅͼÏñ°üÀ¨ÁËÊÓÆµ¿Ø¼þ£¬ÒÔ´ËÌáʾÓû§ÕâÕź£±¨´ú±íÒ»¶ÎÊÓÆµ¼ô¼¡£ÕâÀﻹÔÚ´ËÀýÖмÓÈëÁËÒ»¸öimgÔªËØ£¬ÒÔÑÝʾvideoÔªËØ»á²»¼Ó¸Ä¶¯µØÕ¹Ê¾ÕâÕź£±¨Í¼Ïñ¡£
1.3 ÉèÖÃÊÓÆµ³ß´ç
Èç¹ûÊ¡ÂÔwidthºÍheightÊôÐÔ£¬ä¯ÀÀÆ÷¾Í»áÏÔʾһ¸öºÜСµÄÕ¼Î»ÔªËØ£¬²¢ÔÚÔªÊý¾Ý¿ÉÓÃʱ£¨Ò²¾ÍÊǵ±Óû§¿ªÊ¼²¥·Å£¬»òÕßpreloadÊôÐÔ±»ÉèΪmetadataʱ£©°ÑËüµ÷Õûµ½ÊÓÆµÔʼ³ß´çµÄ´óС¡£Õâ¿ÉÄÜ»á²úÉú²ü¶¯¸Ð£¬ÒòÎªÒ³Ãæ²¼¾ÖÐèÒªµ÷ÕûÒÔÈÝÄÉÊÓÆµ¡£
Èç¹ûÖ¸¶¨widthºÍheightÊôÐÔ£¬ä¯ÀÀÆ÷»á±£³ÖÊÓÆµµÄ³¤¿í±È£¨²»±Øµ£ÐÄÊÓÆµ»áÏòÈÎÒ»·½ÏòÀÉ죩¡£
Ó¦ÓÃwidthºÍheightÊôÐÔ video Video cannot be displayed
´ËÀýÖÐÉèÖõÄwidthÊôÐÔÓëheightÊôÐԵıÈÀýÊÇʧºâµÄ¡£ÕâÀﻹ¸øvideoÔªËØÓ¦ÓÃÁËÒ»¸öÑùʽ£¬ÒÔ͹ÏÔä¯ÀÀÆ÷ΪÁ˱£³ÖÊÓÆµµÄ³¤¿í¸ß£¬Ö»»áʹÓò¿·ÖÖ¸Åɸø¸ÃÔªËØµÄ¿Õ¼ä¡£
1.4 Ö¸¶¨ÊÓÆµÀ´Ô´£¨ºÍ¸ñʽ£©
Ö¸¶¨ÊÓÆµ×î¼òµ¥µÄ·½Ê½ÊÇʹÓà src ÊôÐÔ£¬²¢ÌṩËùÐèÊÓÆµÎļþµÄURL¡£
¿ÉÒÔ¿´µ½Ç°ÃæµÄÀý×ÓÖУ¬ÓÃsrcÊôÐÔÖ¸¶¨ÁËÎļþ timessquare.webm¡£ÕâÊÇÒ»¸öÓÃWebM ¸ñʽ±àÂëµÄÎļþ¡£Ä¿Ç°»¹Ã»ÓÐÄÄÒ»ÖÖÊÓÆµ¸ñʽ±»ÆÕ±éÖ§³Ö£¬Èç¹ûÏ뽫ÊÓÆµÍÆÏò¸÷ÖÖ¸÷ÑùµÄHTML5Óû§£¬¾ÍÒª×öºÃÒÔ¶àÖÖ¸ñʽ±àÂëÊÓÆµµÄ×¼±¸¡£
Ò»¸ö²»ÐÒµÄÊÂʵÊÇ£¬Ã»ÓÐÄÄÒ»ÖÖ¸ñʽÄܹ»ÓÃÓÚËùÓеÄÖ÷Á÷ä¯ÀÀÆ÷¡£Òò´Ë£¬±ØÐëÒÔ¶àÖÖ¸ñʽ±àÂëÊÓÆµ£¬Ö±µ½³öÏÖͬһһÖÖ¸ñʽΪֹ¡£¿ÉÒÔʹÓÃsourceÔªËØÀ´Ö¸¶¨¶à¸ö¸ñʽ¡£
ÏÂÃæÀý×ÓչʾÁËÈçºÎʹÓà sourceÔªËØÀ´Ïòä¯ÀÀÆ÷Ìṩ±¸Ñ¡ÊÓÆµ¸ñʽ¡£
ÓÃsourceÔªËØ Video cannot be displayed
ä¯ÀÀÆ÷»áÑØ×ÅÁбí˳ÐòѰÕÒËüÄܹ»²¥·ÅµÄÊÓÆµÎļþ¡£Õâ¿ÉÄÜ»áÒý·¢¶à¸ö·þÎñÆ÷ÇëÇóÒÔ»ñµÃÿ¸öÎļþµÄ¶îÍâÐÅÏ¢¡£ä¯ÀÀÆ÷ÅжÏËüÊÇ·ñÄܲ¥·Åij¸öÊÓÆµµÄÒÀ¾ÝÖ®Ò»ÊÇ·þÎñÆ÷·µ»ØµÄMIMEÀàÐÍ¡£¿ÉÒÔͨ¹ý¸øsourceÔªËØÓ¦ÓÃtypeÊôÐÔÀ´ÌáʾÓû§£¬·½·¨ÊÇÔÚÆäÖÐÖ¸¶¨ÎļþµÄMIMEÀàÐÍ¡£
ÔÚsourceÔªËØÉÏÓ¦ÓÃtypeÊôÐÔ /> Video cannot be displayed
PS:mediaÊôÐÔÏòä¯ÀÀÆ÷Ö¸Ã÷¸ÃÊÓÆµ×îÊʺÏÔÚÄÇÖÖÉ豸Éϲ¥·Å¡£
2. ʹÓà audio ÔªËØ
audio ÔªËØÔÊÐíÔÚHTMLÎĵµÀïǶÈëÒôƵÄÚÈÝ¡£
¿ÉÒÔ¿´µ½audioºÍvideoÔªËØÓÐÐí¶à¹²Í¬µã¡£ÏÂÃæµÄÀý×ÓչʾÁËaudioÔªËØµÄÓ÷¨¡£
ʹÓÃaudioÔªËØ Audio content cannot be played
Ò²¿ÉÒÔʹÓÃsourceÔªËØÀ´Ìṩ¶àÖÖ¸ñʽ¡£
ʹÓÃaudioÔªËØ Audio content cannot be played
ÕâÁ½¸öÀý×Ó¶¼Ê¹ÓÃÁËcontrolsÊôÐÔ£¬ÕâÑùä¯ÀÀÆ÷¾Í»á¶ÔÓû§ÏÔʾĬÈϵIJ¥·Å¿Ø¼þ¡£ËüÃÇÔÚ²»Í¬µÄä¯ÀÀÆ÷ÖÐÍâ¹Û¸÷Ò죬ÏÂÃæÊÇÔÚ»ðºüä¯ÀÀÆ÷ÖеÄÏÔʾЧ¹û£º
3. ͨ¹ý DOM ²Ù×÷ǶÈëʽýÌå
¡¡