2. IT
    3. Java webvideo 视频开发

    Java webvideo 视频开发

    xiaoxiao2023-03-24  4

     

    播放器

    \flowplayer

     

     

     

    1.下载Flowplayer播放器，

    2.下载安装包解压后可以找到以下几个主要文件：

    flowplayer-3.2.11.swf：用于播放器主体的flash文件

    flowplayer.controls-3.2.11.swf：控制条文件，是个可选的插件

    flowplayer-3.2.10.min.js：播放器的api文件，也用来装载整个播放器

     

    3.在页面调用播放器前引入播放器的api脚本文件flowplayer-3.1.1.min.js，如下：

    <script src="path/to/the/flowplayer-3.1.1.min.js"></script>

     

    4.通过一个链接(<a>标签)指向视频文件的链接，并设定视频文件长宽，同时应为它指定一个id。该链接的位置即是视频显示的位置。如下：

    <a href="/要播放的视频文件/a.flv" id="player"></a>

     

    5.调用api为上一步设定的链接位置装载播放器，如下：

    flowplayer("player","path/to/the/flowplayer-3.1.1.swf");  播放器自身主体

    上面代码中第一个参数是上一步中设定的链接id，第二个参数是播放器主体的flash文件路径。使用flowplayer()方法装载播放器时，可以指定非常多的参数来配置或个性化你的播放器。常用的例如：

     

     

    <script>flowplayer("player","/hygg/resources/flash/flowplayer-3.2.7.swf", {

    clip:{

    autoPlay:false,//是否自动播放，默认true

    //autoBuffering:true//是否自动缓冲视频，默认true

    }

    });

    </script>

     

     

     

     

     

    项目代码：

     

     

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title>

    <script type="text/javascript" src="js/flowplayer-3.2.10.min.js"></script>

    </head> <body>

    <a href="flowplayer.flv" style="display:block;width:520px;height:330px" id="player"></a>

    <script type="text/javascript">  flowplayer("player", "flowplayer-3.2.11.swf",{

     clip:{

     autoPlay:false,//是否自动播放，默认true

     //autoBuffering:true//是否自动缓冲视频，默认true

     }

     });

    </script>

    </body>

     

    </html>

     

    ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

     

     

     视频 改进 1：  

     

     

     

    <%@ page language="java" import="java.util.*" pageEncoding="GB18030"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <%@taglib uri="/struts-tags" prefix="s" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html>   <head>     <base href="<%=basePath%>">         <title>My JSP 'index.jsp' starting page</title>  <meta http-equiv="pragma" content="no-cache">  <meta http-equiv="cache-control" content="no-cache">  <meta http-equiv="expires" content="0">     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  <meta http-equiv="description" content="This is my page">  <!--  <link rel="stylesheet" type="text/css" href="styles.css">  -->         </head>     <body>

    <a href="userAction!add">添加用户</a>  <br>  <a href="userAction!update">更新用户</a>      

    <div style="margin-top: 200px;margin-left: 530px;">  <ul>   <li><s:a href="movie/main.action">去看电影 </s:a> </li>    <li><s:a href="shop/main.action">去买东西 </s:a> </li>    <li><s:a href="bbs/main.action">去论坛讨论 </s:a> </li>    <li><s:a href="notice/main.action">站内信息 </s:a> </li>   </ul> </div>

     

     

      </body> </html>

     

    -----------------------------------------------------

     

           <action name="userAction" class="UserAction">       <!-- 添加成功的映射页面 -->       <result name="add">video1.jsp</result>          <!-- 更新成功的映射页面 -->       <result name="update">user_update.jsp</result>

     

    -------------------------------------------------------

     

    <bean id="UserAction" class="com.guang.action.UserAction" scope="prototype">   </bean>

     

     

    ----------------------------------------------------------------

    package com.guang.action;

     

    import com.opensymphony.xwork2.ActionSupport; public class UserAction extends ActionSupport {  private static final long serialVersionUID = 1L;  // 提示信息  private String info;  // 添加用户信息  public String add() throws Exception{   info = "movie/flowplayer.flv";   return "add";  }  // 更新用户信息  public String update() throws Exception{   info = "更新用户信息";   return "update";  }  public String getInfo() {   return info;  }  public void setInfo(String info) {   this.info = info;  } }

     

    -------------------------------------------------------------

     

     

    <%@ page language="java" contentType="text/html; charset=GB18030"     pageEncoding="GB18030"%>         <%@taglib uri="/struts-tags" prefix="s" %>         <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

    "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Insert title here</title>

    <script type="text/JavaScript" src="js/flowplayer-3.2.10.min.js"></script>

    </head> <body>

    <s:a  href = "%{info}"       style="display:block;width:520px;height:330px" id="player"></s:a> <script type="text/javascript">  flowplayer("player", "flowplayer-3.2.11.swf",{  clip:{  autoPlay:true,//是否自动播放，默认true  //autoBuffering:true//是否自动缓冲视频，默认true  }  }); </script>

    <div style="margin-top: 100px;margin-left: 530px;">  <ul>   <li><s:a href="movie/main.action">新的下一首歌曲 </s:a> </li>    <li><s:a href="shop/main.action">去买东西 </s:a> </li>    <li><s:a href="bbs/main.action">去论坛讨论 </s:a> </li>    <li><s:a href="notice/main.action">站内信息 </s:a> </li>   </ul> </div>

     

    </body> </html>

     

     

    J:\erjie2\WebContent\movie\flowplayer.flv

     

     =================================================================

     

     

     

    <div id="main4">   <div  id="main1-4">     <a href="videoAction?info=movie/1.flv">     <img src="${pageContext.request.contextPath }/images/5-7.jpg" width="340" height="150" />     </a>       </div> </div>

     

     

    ---------------------------------------------------------

     

     

     <action name="videoAction" class="VideoAction">       <!-- 添加成功的映射页面 -->       <result name="findAll">/admin/video2.jsp</result>     <result >/admin/video2.jsp</result>       <!-- 更新成功的映射页面 -->       <result name="update">user_update.jsp</result>

      </action>

     

     

    --------------------------------------------------------

     

     <bean id="VideoAction" class="cn.itcast.shop.video.action.VideoAction" scope="prototype">   <property name="videoService" ref="videoService"/>     </bean>      <bean id="videoService" class="cn.itcast.shop.video.service.VideoService" scope="prototype">      <property name="videoDao" ref="videoDao"/>  </bean>

        <bean id="videoDao" class="cn.itcast.shop.video.dao.VideoDao">   <property name="sessionFactory" ref="sessionFactory"/>  </bean>

    <!-- 用户模块的Action -->  

    <!-- Service的配置  ===========================-->  

    <!-- Dao的配置  ===========================-->  

     

     

    ---------------------------------------------------------------

     

     

    package cn.itcast.shop.video.action;

    import java.util.List; import java.util.Map;

    import javax.servlet.http.HttpServletRequest;

    import org.apache.struts2.ServletActionContext; import org.springframework.web.context.request.RequestAttributes;

    import com.opensymphony.xwork2.ActionContext; import com.opensymphony.xwork2.ActionSupport; import com.opensymphony.xwork2.ModelDriven;

    import cn.itcast.shop.adminuser.service.AdminUserService; import cn.itcast.shop.adminuser.vo.AdminUser; import cn.itcast.shop.category.vo.Category; import cn.itcast.shop.video.dao.VideoDao; import cn.itcast.shop.video.service.VideoService; import cn.itcast.shop.video.vo.Video;

    public class VideoAction extends ActionSupport implements ModelDriven<Video>{     private static final long serialVersionUID = 1L;

      private String info;       public String getInfo() {   return info;  }

     public void setInfo(String info) {   this.info = info;  }

     private Video video = new Video();

      public Video getModel() {    return video;   }      private VideoService videoService;          public void setVideoService(VideoService videoService) {    this.videoService = videoService;   }

            public String  execute() throws Exception{  

                     ActionContext context=ActionContext.getContext();       

    HttpServletRequest request=(HttpServletRequest)context.get(ServletActionContext.HTTP_REQUEST);   

            info =request.getParameter("info");  

                    List<Video> listVideo = videoService.findAllVideoService();             ActionContext.getContext().getValueStack().set("listVideo", listVideo);                                           System.out.println("info: " + info);                    return SUCCESS;  

                                     }             // 后台查询所有视频的执行的方法   public String findAll() {               return "findAll";               //  ActionContext context =ActionContext.getContext();       //  info = context.getName();              

                     //       if(info.equals(""))        //      {                               //       List<Video> listVideo = videoService.findAllVideoService();             //         ActionContext.getContext().getValueStack().set("listVideo", listVideo);      //          //       return "findAll";         //     }                                  //     else {                      //      List<Video> listVideo = videoService.findAllVideoService();               //       ActionContext.getContext().getValueStack().set("listVideo", listVideo);                                  //   }                              }            }

    --------------------------------------------------------

     

    <%@ page language="java" contentType="text/html; charset=UTF-8"     pageEncoding="UTF-8"%>      <%@taglib uri="/struts-tags" prefix="s" %>         <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/JavaScript" src="js/flowplayer-3.2.10.min.js"></script> </head> <body>

    <s:a href ="%{info}"   style="display:block;width:520px;height:330px" id="player"></s:a><script type="text/javascript">  flowplayer("player", "flowplayer-3.2.11.swf",{  clip:{  autoPlay:true,//是否自动播放，默认true  //autoBuffering:true//是否自动缓冲视频，默认true  }  }); </script>

    <s:iterator value="listVideo" >      <li>      <s:a href="videoAction?info=%{url}" title="%{introduce}">             <div class="" style="width: 200px;">        <s:property value="name"/>       </div>      </s:a>     </li>     <br>     </s:iterator>

    <div style="margin-top: 100px;margin-left: 530px;">  <ul>     <li><s:a href="userAction!add">新的下一首歌曲 </s:a> </li>   <li><s:a href="shop/main.action">去买东西 </s:a> </li>   <li><s:a href="bbs/main.action">去论坛讨论 </s:a> </li>   <li><s:a href="notice/main.action">站内信息 </s:a> </li>  </ul> </div>

     

     

    </body> </html>

    -------------------------------------------------

     

    create table video  ( id int  not null primary key  auto_increment ,                          name varchar(100)  not null ,                          introduce varchar(1000)  not null  ,                          type int not null,                          url  varchar(1000)  not null                                                                                  );

    insert  into video values( 1 , '星月神话' , '古装爱情剧' ,  1 ,  'movie/1.flv' ); insert  into video values( 2 , '第一次爱的人' , '歌曲散发爱情' ,  1 ,  'movie/2.mp4' );

     

    =========================================================

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

    转载请注明原文地址: https://ju.6miu.com/read-1201082.html
    最新回复(0)