2014.09.04 15:30

JWPlayer6 RTMP FLASH HTML5

조회 수 472 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

PC에서는 FLASH, 모바일에서는 HTML5로 재생되는 JWplayer6


아래와 같이 file 부분에 두가지를 주면 되는것 같다. 원 소스는 rtmp만 있었는데


우선적으로 jw는 primary값과 같이 flash로 동작하며 ,모바일에서 보여지기 위해서 HTML로 동작은 jw가 알아서 하기때문에 http로 시작하는 소스 위치만 주면 된다.


nginx로 구동하고 있는 rtmp의 서버의 application값은 vod 이며 하위 폴더 sub 아래 mp4파일이므로


rtmp에서 서브폴더가있을시 형식은 아래와 같이 /mp4:서브폴더/mp4파일명 형식을 주면 jw는 제대로 재생한다.



<script src="/jwplayer/jwplayer.js"></script>
<div id="mediaplayer"></div>

<script>
jwplayer('mediaplayer').setup({
width: "720",
height: "406",
primary: "flash",
autostart: "false",
repeat: 'always',
sources:[
{file: "rtmp://주소.mp4"},
        {file: "http://도메인/서브폴더/mp4파일명"}
]
 });
</script>


?

  1. 유튜브 영상 삽입방법

    오브젝트 가로 폭 반응형 형태 <style type="text/css"> .video-container { margin: 0;padding-bottom: 75%; max-width: 100%; height: 0; position: relative;overflow: hidden;} .video-container iframe, .video-container object, .video-container embed...
    Date2016.02.05 By행복아이 Views8180
    Read More
  2. 유튜브 라이브 테스트

    모니터를 보냄 jw로 jwplayer('mediaplayer').setup({ file: 'http://youtu.be/YfnTz987ZHg', width: "100%", height: 406 });
    Date2014.10.15 By행복아이 Views1800
    Read More
  3. 윈도우7 wimboot 테스트

    jwplayer RTMP HTTP jwplayer("mediaplayer2").setup({ primary: "flash", width: "100%", height: 406, playlist: [{ sources: [ { file: "rtmp://one2.kr/mp4/mp4:lec/win7wimboot.mp4" }, { file: "http://one2.kr/mp4/lec/win7wimboot.mp4" } ] }] });
    Date2015.08.27 By행복아이 Views8157
    Read More
  4. 스마트폰 녹화 mp4테스트

    jwplayer("mediaplayer2").setup({ primary: "flash", width: 720, height: 406, playlist: [{ sources: [ { file: "rtmp://one2.kr/mp4/mp4:smart/SCR_20150115_151558.mp4" }, { file: "http://one2.kr/mp4/smart/SCR_20150115_151558.mp4" } ] }] });
    Date2015.01.15 By행복아이 Views269
    Read More
  5. 모나서버

    ㅇㅇㅇ jwplayer RTMP HTTP jwplayer("mediaplayer2").setup({ primary: "flash", width: 720, height: 406, playlist: [{ sources: [ { file: "rtmp://one2.kr:48600/mp4:mm/test.mp4" }, { file: "http://one2.kr/mp4/lec/win7wimboot.mp4" } ] }] });
    Date2015.10.27 By행복아이 Views6796
    Read More
  6. videojs HLS 2

    스타일 시트 사용. 역시 모바일에서 보이기. <script src="/videojs/video.js"></script> <script src="/videojs/videojs-media-sources.js"></script> <script src="/videojs/videojs.hls.min.js"></script> <video id="my_video_1" class="video-js vjs-defa...
    Date2015.07.31 By행복아이 Views433
    Read More
  7. videoJS HLS

    <video id=example-video width=600 height=300 class="video-js vjs-default-skin" controls> <source src="http://one2.kr:8080/hls/nav.m3u8" type="application/vnd.apple.mpegurl" /> </video> <script src="/videojs/video.js"></script> <script src="/...
    Date2015.07.31 By행복아이 Views653
    Read More
  8. videojs

    Date2015.10.12 By행복아이 Views6529
    Read More
  9. video-js http streaming 테스트

    요건 오픈 소스랜다. 그리고 브라우저 기반이란다. RTMP 지원하고, 자막지원하고, 모바일에서도 끄떡없다는데. RTMP로 쓸 경우 주소끝에 type='rtmp/mp4' 로 주어야한다. http일경우는 'video/mp4' VideoJS.setupAllWhenReady(); Download Video: MP4
    Date2014.09.04 By행복아이 Views195
    Read More
  10. video-js 3

    nginx RTMP 단독서버로 http 스트리밍 HTML5 +fallback flash (flowplayer, http) VideoJS.setupAllWhenReady();
    Date2014.09.11 By행복아이 Views261
    Read More
  11. umplayer mp4 stream2

    embedPlayer('player-container', { flashvars : { 'rtmp' : 'rtmp://one2.kr/vod/nut720.mp4' }, size : { width: 720, height: 406 }, playerStyle : 'quick' });
    Date2014.08.26 By행복아이 Views155
    Read More
  12. test

    http://one2.kr/live.htmdd
    Date2019.06.18 By행복아이 Views716
    Read More
  13. RTMP 서브폴더 테스트

    nginx rtmp 서브폴더 되나. /vod/sub/nut720.mp4 임. embedPlayer('player-container', { flashvars : { 'rtmp' : 'rtmp://one2.kr/vod/mp4:sub/nut720.mp4' }, size : { width: 720, height: 406 }, playerStyle : 'quick' });
    Date2014.08.26 By행복아이 Views170
    Read More
  14. RTMP HLS2 1935 실시간

    1935포트 jwplayer('mediaplayer2').setup({ width: "100%", androidhls:true, aspectratio: "16:9", primary: "flash", sources:[ { file: "rtmp://one2.kr:1935/hls/nav" }, { file: "http://one2.kr:8080/hls/nav.m3u8"} ] });
    Date2015.07.31 By행복아이 Views263
    Read More
  15. OBS RTMP 웹 HLS모바일 생방송 테스트

    RTMP 1936 HLS 8080 NginX RTMP 에서 아래와 같이 설정하여야한다. nginx.conf #user nobody; worker_processes 1; error_log logs/rtmp_error.log debug; pid logs/nginx.pid; events { worker_connections 1024; } http { allow all; deny all; access_log l...
    Date2015.07.30 By행복아이 Views1975
    Read More
  16. mp4 rtmp umplayer 1

    umplayer 1080p 영상. embedPlayer('player-container', { flashvars : { 'rtmp' : 'rtmp://one2.kr/vod/bnb1080.mp4' }, size : { width: 720, height: 406 }, playerStyle : 'quick' });
    Date2014.08.26 By행복아이 Views212
    Read More
  17. mp4 1080 flowplayer

    flowplayer 1080p영상 $f("player", "/flowplayer2/flowplayer-3.2.18.swf", { clip: { url: 'rtmp://one2.kr/vod/bnb1080.mp4', provider: 'rtmp' }, plugins: { rtmp: { url: "/flowplayer2/flowplayer.rtmp-3.2.13.swf" } } });
    Date2014.08.26 By행복아이 Views462
    Read More
  18. Media Element.js

    $('audio,video').mediaelementplayer({ success: function(player, node) { $('#' + node.id + '-mode').html('mode: ' + player.pluginType); } });
    Date2014.09.11 By행복아이 Views263
    Read More
  19. jwplayer6 캡션 설정

    트랙옵션을 준다. 자막의 경로는 정확히 주어야한다. http://서버주소/자막파일.srt 이런식으로주던가 상대경로로 주던가.. tracks: [{ file: "/subtitle/nut.srt", label: "korean", kind: "captions", "default": true }] 자막을 여러개 넣을 경우 tracks: [...
    Date2014.09.04 By행복아이 Views210
    Read More
  20. JWPlayer6 RTMP FLASH HTML5

    PC에서는 FLASH, 모바일에서는 HTML5로 재생되는 JWplayer6 아래와 같이 file 부분에 두가지를 주면 되는것 같다. 원 소스는 rtmp만 있었는데 우선적으로 jw는 primary값과 같이 flash로 동작하며 ,모바일에서 보여지기 위해서 HTML로 동작은 jw가 알아서 하기...
    Date2014.09.04 By행복아이 Views472
    Read More
Board Pagination Prev 1 2 Next
/ 2