Flex에서 VideoDisplay를 사용하여 라이브 스트리밍 비디오를 표시하는 방법

StackOverflow https://stackoverflow.com/questions/42333

  •  09-06-2019
  •  | 
  •  

문제

NetStream을 통해 FMS에서 스트리밍된 비디오를 표시하기 위해 VideoDisplay 객체(MXML에 정의됨)를 사용하는 방법이 궁금합니다.

그만큼 Flex3 문서 이것이 가능하다고 제안하십시오:

비디오 디스플레이 ...HTTP를 통한 점진적 다운로드, Flash Media Server에서의 스트리밍 및 Camera 객체에서의 스트리밍을 지원합니다.

그러나 나중에 문서에서 내가 볼 수 있는 것은 attachmentCamera() 메서드뿐입니다.이전 Video 개체와 같은 attachmentStream() 메서드가 없는 것 같습니다.

source 속성을 사용하여 HTML을 통해 제공되는 고정 파일을 재생할 수 있는 것처럼 보이지만 NetStream을 연결하는 방법에 대해서는 아무것도 표시되지 않습니다.

오래된 동영상 객체는 UIComponent를 기반으로 하지 않고 MXML에서 사용할 수 없는 것처럼 보이지만 여전히 존재하는 것 같습니다.

나는 찾았다 이 블로그 게시물 이는 일반 Video 객체를 사용하여 이를 수행하는 방법을 보여 주지만 VideoDisplay(또는 MXML에 직접 넣을 수 있는 다른 것)를 사용하는 것이 훨씬 더 좋습니다.

도움이 되었습니까?

해결책

불행히도 Video 개체에만 NetStream()을 연결할 수 있습니다.따라서 FMS에서 데이터를 얻으려면 em을 사용할 운명입니다.

그런데 attachmentCamera() 메소드 출판하다 로컬 카메라 비디오가 서버로 전송되므로 조심하세요 ;)

다른 팁

VideoDisplay 래퍼입니다 VideoPlayer, 이는 차례로 ~이다 ㅏ Video 아강.안타깝게도 래퍼를 사용하면 기존 NetStream을 Video 객체에 연결할 수 없습니다.

그러나 해당 구성 요소에 대한 참조는 mx_internal 네임스페이스이므로 다음이 트릭을 수행해야 합니다.

videoDisplay.mx_internal::videoPlayer.attachNetStream(incomingStream);
videoDisplay.mx_internal::videoPlayer.visible = true;

(다음을 가져와야 합니다. mx.core.mx_internal 네임스페이스)

효과가있다.

mx:VideoDisplay live="true" autoPlay="true" source="rtmp://server.com/appname/streamname" />

비디오 디스플레이를 통해 실시간 비디오를 제공합니다...문제는 기존 netconnection 개체를 사용하지 않고 자체 개체를 생성한다는 것입니다.이것이 내가 해결 방법을 찾으려고 노력하는 것입니다.

다음은 비디오 사용 방법에 대한 예시 링크입니다.http://blog.flexexamples.com/2008/03/01/displaying-a-video-in-flex-using-the-netconnection-netstream-and-video-classes/

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="vertical"
    verticalAlign="middle"
    backgroundColor="white"
    creationComplete="init();">

<mx:Script>
<![CDATA[
    import mx.utils.ObjectUtil;

    private var nc:NetConnection;
    private var ns:NetStream;
    private var video:Video;
    private var meta:Object;

    private function init():void {
    var nsClient:Object = {};
    nsClient.onMetaData = ns_onMetaData;
    nsClient.onCuePoint = ns_onCuePoint;

    nc = new NetConnection();
    nc.connect(null);

    ns = new NetStream(nc);
    ns.play("http://www.helpexamples.com/flash/video/cuepoints.flv");
    ns.client = nsClient;

    video = new Video();
    video.attachNetStream(ns);
    uic.addChild(video);
    }

    private function ns_onMetaData(item:Object):void {
    trace("meta");
    meta = item;
    // Resize Video object to same size as meta data.
    video.width = item.width;
    video.height = item.height;
    // Resize UIComponent to same size as Video object.
    uic.width = video.width;
    uic.height = video.height;
    panel.title = "framerate: " + item.framerate;
    panel.visible = true;
    trace(ObjectUtil.toString(item));
    }

    private function ns_onCuePoint(item:Object):void {
    trace("cue");
    }
]]>
</mx:Script>

<mx:Panel id="panel" visible="false">
    <mx:UIComponent id="uic" />
    <mx:ControlBar>
    <mx:Button label="Play/Pause" click="ns.togglePause();" />
    <mx:Button label="Rewind" click="ns.seek(0); ns.pause();" />
    </mx:ControlBar>
</mx:Panel>
</mx:Application>

다음과 같이 작동하는 샘플 코드를 보았습니다.

// Connect to the video stream in question.
var stream:NetStream = new NetStream( chatNC );
stream.addEventListener( NetStatusEvent.NET_STATUS, handleStreamStatus );
stream.addEventListener( IOErrorEvent.IO_ERROR, handleIOError );

// Build the video player on the UI.
var video:Video = new Video(246, 189);
var uiComp:UIComponent = new UIComponent();
uiComp.addChild( video );
uiComp.width = 246;
uiComp.height = 189;
stream.play( streamName );
video.attachNetStream( stream );
video.smoothing = true;
video.width = 246;
video.height = 189;
view.videoPlayerPanel.removeAllChildren();
view.videoPlayerPanel.addChild( uiComp );

하지만 실제로 나 자신이 작동하도록 할 수는 없습니다.나중에 알아낼 수 있으면 여기에 게시하겠습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top