将Flex嵌入到Jsp页面实例-基于FlexModule插件

发布时间：2020-12-15 03:55:18 所属栏目：百科来源：网络整理

导读：如果我们只需要用到Flex的一部分功能，例如播放器功能，我们可以单独把Flex页面嵌入到Jsp页面中。要想实现此功能，需要下载一个工程，将其覆盖在服务器根目录下即可。你可以再次下载。在eclipse下新建一个web工程，将刚才下载的工程解压缩，然后将webtier文

如果我们只需要用到Flex的一部分功能，例如播放器功能，我们可以单独把Flex页面嵌入到Jsp页面中。要想实现此功能，需要下载一个工程，将其覆盖在服务器根目录下即可。你可以再次下载。

在eclipse下新建一个web工程，将刚才下载的工程解压缩，然后将webtier文件夹下的内容覆盖服务器根目录下，如本人的：

注意要将lib文件夹和jars文件夹下的jar包添加到到类路径下，这样就算是整合完成了吧。

接着新建一个flex的mxml文件PlayVideo.mxml，将其放在WebContent下，代码如下所示：

         <?xmlversion="1.0"?encoding="utf-8"?> 
       
         <mx:Application?xmlns:mx=" 
        http://www.adobe.com/2006/mxml"?layout="absolute" 
       
         creationComplete="init()"> 
       
         <mx:Script> 
       
         <![CDATA[ 
       
         ????import?mx.controls.Alert; 
       
         ????private?var?rtmpURL:String=" 
        rtmp://localhost/oflaDemo"; 
       
         ????private?var?nc:NetConnection=new?NetConnection(); 
       
         ????private?var?playerVideo:Video=new?Video(); 
       
         ????[Bindable] 
       
         ????private?var?stream:NetStream; 
       
         ????private?function?init():void{ 
       
         ???????playerVideo.width?=?500; 
       
         ???????playerVideo.height?=?400; 
       
         ???????connect(); 
       
         ????} 
       
         ????private?function?connect():void{ 
       
         ???????nc.addEventListener(NetStatusEvent.NET_STATUS,netStatus); 
       
         ???????nc.connect(rtmpURL); 
       
         ????} 
       
         ????private?function?netStatus(e:NetStatusEvent):void{ 
       
         ???????trace(e.info.code); 
       
         ???????if(e.info.code=="NetConnection.Connect.Success"){ 
       
         ???????????stream=new?NetStream(nc); 
       
         ???????????playerVideo.attachNetStream(stream); 
       
         ???????????stream.play("chirisyu_ytywn.flv"); 
       
         ???????????container.addChild(playerVideo); 
       
         ???????} 
       
         ????} 
       
         ]]> 
       
         </mx:Script> 
       
         ????<mx:UIComponent?id="container"></mx:UIComponent> 
       
         </mx:Application>

这个文件实现的是之前用Red5播放视频的减缩版。

接着新建一个jsp文件，如下所示：

<%@?page?language="java"contentType="text/html;?charset=UTF-8"

????pageEncoding="UTF-8"%>

<%@taglib?uri="FlexTagLib"prefix="mm"?%>

<!DOCTYPE?html?PUBLIC?"-//W3C//DTDHTML?4.01?Transitional//EN"?" http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

????#mess{

???????position:?absolute;

???????left:?250px;

???????top:?25px;

???????font-size:?22px;

????}

????#video{

???????position:?absolute;

???????left:?250px;

???????top:?70px;

????}

</style>

</head>

<body>

????<div?id="mess">

????这是测试视频：

????</div>

????<div?id="video">

???????<mm:mxml?source="PlayVideo.mxml"width="500"?height="400">

???????</mm:mxml>

????</div>

????

</body>

</html>

可以看出将mxml文件引入jsp需要做的事是：

声明引入标签，如<%@taglib uri="FlexTagLib" prefix="mm" %>。如果web.xml文件中没有添加<taglib>
缺少如下标签，则会报错

         <taglib-uri>FlexTagLib</taglib-uri> 
       
         <taglib-location>/WEB-INF/lib/flex-bootstrap-jsp.jar</taglib-location> 
       
         </taglib>

2.在<mm:mxml/>标签中引入mxml文件，里面有一些属性，可以查看API，本人就不在此赘述了。

好了，这样就可以测试了，运行jsp文件，如果成功运行则证明成功了：

当然，这个mxml用的是flex 3文件，如果换成flex4的话会报错，因为目前使用的jar包不支持Flex4标签，不知道作者会不会更新。

原创文章，转载请注明出处：http://www.it161.com/article/webDetail?articleid=140112111941

更多原创内容，请访问：http://www.it161.com/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!