Embed the player in the browser

implementation method of embedded Web VOD system choose from Goaler Blog Key words Implementation method of embedded Web VOD system Source

In recent years, the name of video-on-demand VOD (video on Demand) appears more and more in the media. VOD technology enables people to according to their own interests, without the use of video recorders, DVD players, cable TV and on the computer or television free on demand in the program library of the videos and information, is the content of the video program can be freely selected interactive system. The essence of VOD is that the users of information actively obtain multimedia information according to their own needs, which differs from the biggest difference of information release: One is initiative, the other is selectivity. In a sense this is the recipient of information in accordance with their own needs for self-improvement and self-development of the way in today's information society will be more and more in line with the needs of consumers, it can be said that VOD is the future of information acquisition mainstream mode in multimedia video audio performance. The concept of VOD will be expanded rapidly in the field of information acquisition, and has an unlimited and broad development prospects. Background The author of the unit building has an internal website, in order to further improve the availability of the network, improve the function of the website, decided to provide VOD on the network function. After a period of exploration and comparison, the author finally selected the Realsystem company's RealPlayer as a video file playback tool, mainly based on the following considerations: 1, RealPlayer support the majority of today's audio and video streaming media format, including the current popular MP3 audio medium; 2, RealPlayer the default. rm format to ensure playback quality at the same time, file compression ratio, so that it is more conducive to network transmission; 3, RealPlayer on the Internet has a wide range of user groups and service provider support. You can also choose from Microsoft's MediaPlayer, APPLE's QuickTime, and so on. Please refer to "Search the new Network" evaluation article: "Three major stream media technology comparison" (http://www.souxin.com/stream/txt/3_stream_comp/www.souxin.com.htm) "Selection of Playback mode" In general, after installing the RealPlayer, there are two ways to connect to the video file. One is directly on the Web page to provide a video file URL address, when the user clicks on the link, RealPlayer automatic recognition and real-time connection to play; the second way is to embed the RealPlayer object in a Web page through an ActiveX control. Through DHTML, the video stream URL is dynamically assigned to the embedded object, which provides a unified and friendly interface for video playback. The previous method is relatively simple for the designer and only needs to provide the playback path for the video file. RealPlayer skilled users, but also through the custom RealPlayer play mode, download Visual Plug-ins, add to Favorites and other ways of video management. But there are several drawbacks to this approach: 1, for the Chinese-language path and the Chinese name of the video file, the browser is not very good support, often appear to find no file error messages. 2, the need for the System file association, if the file association error, the browser will be at a loss. 3, for end users, often want to see a unified playback interface, rather than pop-up playback. Through the web embedded video streaming management, user-side operation requests can be minimized (the user simply installs the RealPlayer player). If supplemented by elaborate art design, but also in accordance with the wishes of the designer to customize a beautiful and generous playback interface. "Basic Concepts" Before designing, let's take a look at some of the basic concepts involved. 1, <object>, <embed> tags <object> is the object definition label (ie still supports <embed>) that was introduced after Microsoft in IE4.0 to replace <embed> tags, and defines the corresponding object type through the ClassID property. <embed> tags are object definition tags supported by Netscape browsers. If developers need to gain support from both IE and Netscape two browser users, it is best to use <embed> tags. 2. Define RAM Files The RAM format file, like the RM file, is also a RealPlayer supported video file compression format, unlike a ram file that simply includes the URL address of the video file. That is, the Ram file can be a simple text format, with each row defining the URL address of a video file. The author found in the test, embedded RealPlayer in the playback of video files, the general use of the entire video file download to the local and then play. This is hard to endure for larger video files. The way to solve this problem first, the video file is simply segmented into a small file size of moderate playback (due to real company in the RM format of the implementation of "closed management", so the RM so far can not be like MPEG and other video files such as video software free editing); the other is the use of RAM files. RealPlayer simply downloads the text-formatted RAM file, then takes out the real address, and then automatically connects to the network for real-time point-to-point playback. The disadvantage is that it increases the burden on the server. Similarly, Microsoft Media Player uses the ASX format to define ASF files. 3, DHTML DHTML is the acronym for Dynamic HTML, which uses CSS (cascading style Sheets, the style sheet) through traditional HTML languages, and relies on JavaScript to "move" pages that have always been static. The Netscape 4.0 and IE 4.0/5.0 versions support dhtml,dhtml is a complete "client" technology that enables the interaction of pages and users directly through a Web page. The good thing about DHTML is that it enhances the functionality of Web pages, creating animations, games and applications directly on Web pages, and so on, providing a new way to browse the site, and unlike Java, Flash and other technologies, the pages that are made with DHTML do not need the support of plug-ins to be fully implemented. "Design Process" The author takes IE5.0 as an example to illustrate the implementation of an embedded web video-on-demand system, in which some PHP and JavaScript technologies are used, and the readers who are puzzled should refer to the relevant information. Inserts the RealPlayer ActiveX object (if you want to test, you need to install the RealPlayer player first) Assume that the following code is included in the video.php document (the file will be linked through <iframe> in the main page). <object width= "height=" classid= "CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA" > <param name= "CONTROLS" value= "Imagewindow" > <param name= "CONSOLE" value= "video" > <param name= "CENTER" value= "TRUE" > <param name= "Maintainspect" value= "TRUE" > </object>//definition of the playback interface <object width= "height=" classid= "CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA" > <param name= "CONTROLS" value= "StatusBar" > <param name= "CONSOLE" value= "video" > </object>//define status bar <object width= "height=" classid= "CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA" > <param name= "CONTROLS" value= "ControlPanel" > <param name= "CONSOLE" value= "video" > <param name= "SRC" value= "<?php Echo getsrc ();?>" > <param name= "AUTOSTART" value= "TRUE" > <param name= "PREFETCH" value= "0" > <param name= "LOOP" value= "0" > <param name= "Numloop" value= "0" > </object>//define Control Panel Where the controls parameter is used to specify the appearance of the control for the player, it can be combined with multiple controls and associated with the console parameter. For Param parameters, readers can refer to the RealPlayer official website http://service.real.com/help/library/guides/production/htmfiles/control.htm. The SRC parameter is particularly important here to specify the URL address of the video stream file. Here the author uses the method of PHP code to specify SRC dynamically, the reader can also use other such as ASP, or completely through JavaScript implementation. Ii. using DHTML to dynamically control playback of RealPlayer controls The magical:<iframe> of small tricks. Because the new SRC needs to be refreshed for the RealPlayer control, you can embed the RealPlayer control in a separate page using <IFRAME>, so that dynamic refresh is done in <IFRAME>. Does not affect the user viewing other content on the page. The following code is included in the main page: <iframe id= "Ivideo" src= "video.php" width=500 height=345 frameborder=0 scrolling= "No" > </iframe&gt, where the video.php file displays the RealPlayer control forcefully. Here we add a simple JavaScript code to control the playback of the video. <script language= "JavaScript" > function Play (filename) { Top.document.all ("Ivideo"). src = "video.php?src=" +filename; }//Ivideo is the identifier of the IFRAME just defined </script> We can use JavaScript to control the more complex features of the RealPlayer plug-in, such as extracting the length of the video, testing the user's network rate, customizing playback events, and so on. For specific details on RealPlayer ActiveX development, please refer to the RealPlayer official website http://service.real.com/help/library/guides/extend/embed.htm. Let's say we have a video file with a URL of http://YourURL/filename.ram, so we can define it like this: <a href= "Javascript:play (" Http://YourURL/filename.ram ")" > File 1</a> If the file is local, the URL can also be a relative path. Third, detect whether the user installs RealPlayer player Add the following JavaScript code to the <script language=javascript> <!-- var realmode=0; var realplayer5=0; var realplayer4=0; var realplayerg2=0; if (Navigator.userAgent.indexOf ("MSIE") < 0) { Numplugins = Navigator.plugins.length; for (i = 0; i < numplugins; i++) { plugin = Navigator.plugins; if (plugin.name.substring (0,10) = = "RealPlayer") { realmode=1; } } } The following code creates a RealPlayer object dynamically through the CreateObject () function of VBScript document.write ("<script language=vbscript/>/n"); document.write ("On Error Resume next/n"); document.write ("RealPlayerG2 =" (Not IsNull (CreateObject ("Rmocx"). RealPlayer G2 Control "))/n"); document.write ("RealPlayer5 = (Not IsNull (CreateObject (" Realplayer.realplayer (tm) ActiveX control (32-bit)))/n "); document.write ("RealPlayer4 = (Not IsNull (CreateObject (" Realvideo.realvideo (tm) ActiveX control (32-bit)))/n "); document.write ("</SCRIPT/>/n"); if (RealPlayerG2 | | RealPlayer5 | | REALPLAYER4) { You can add <object> objects here }else if (realmode) {//Netscape browser user <embed> objects can be added here }else{ Window.location.replace ("install.htm"); Transfer to Install.htm page to instruct users to install } --> </Script> At this point, we have implemented a web-based video on-demand basic functions. But if we want to make the function more perfect, we need other more complex considerations. The production of streaming media, the design of Web art, network flow rate considerations, as well as the effective organization of the website video files. These topics have gone beyond the scope of this article, please refer to the reader's own relevant information. Author Blog:http://blog.csdn.net/goaler/related articles [Original] without templates, a method of generating static HTML pages using only ASP+FSO (especially for content-intensive pages) A Date control View server application/session Variable tool Access stores data limits In ASP, an alternative way to implement pagination with JScript script

Comments on the article "Comments" "Off"