본문 바로가기

나의 플랫폼/Spring Framework

[JavaScript] Using videojs to play video inline on ios

336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

VideoJs 기능을 이용하여 열심히 플레이어를 만들고 커스텀마이징 했는데...


iOS 에서 Native Player가 실행되어서 많이 당황 하셨죠?


아래 옵션을 넣기만 하면 된다고 합니다.


<video class="video-js" poster="#" playsinline autoplay loop>
  <source src="#" type="video/mp4">
</video>

참조 : https://stackoverflow.com/a/43617296


다른 건 크게 신경 안쓰셔도 되고, playisinline 옵션을 넣어주세요.


중요한건.. iOS 9이상 부터 가능하다는 설명이 있는데...


iOS8을 테스트 해보질 못해서 첨언을 못하겠네요.



하지만.. 더 중요한 부분이..


테스트를 해보니 iOS 에서는 전체 화면 버튼을 넣을 경우,


Native 플레이어가 적용 되더라구요.


결국... iOS 사파리인지 체크 해서 그 때만 전체 화면 버튼을 제외 시키는 방식을 했습니다.


아래는 전체화면 버튼을 제외 시키는 코드 입니다.


videojs("my-video", {
    controlBar: {
      fullscreenToggle: false
    }
});


혹시 다른 방법을 아시는 분 댓글 달아주세요. ㅠㅠ