본문 바로가기

반응형

HTML5

#크롬 자동재생 정책, Chrome Autoplay Policy Chrome Autoplay policy 2018년 4월 부터 적용될 예정이라고 선언했으며, 적용 되었음 사용자 경험을 개선하기 위해 엄격한 자동재생 정책으로 시행 몇가지 조건 일 경우에만 자동 재생 허용 무음인 영상일 경우 자동 재생 허용 사용자 인터렉션(클릭, 탭, 터치) 등이 있었을 경우 자동 재생 허용 데스크탑에서 MEI(Media Emgagement Index)가 임계치를 넘었을 경우 chrome://media-engagement ← 여기서 MEI 확인 가능 상단 프레임에서 허용을 iframe으로 전달하여 허용 video tag로 부터 play promise를 받을 경우 에러 발생 "play() failed because the user didn't interact with the documen.. 더보기
#HTMLMediaElement.play() Return Promise HTMLMediaElement.play() Return Promise var Promise = HTMLMediaElement.play(); HTMLMediaElement.play() 객체는 promise객체를 반환 어떤 이유든 재생에 실패했을 경우 reject 발생 NotAllowedError 브라우저에서 미디어 재생이 되지 않는 경우, 보통 사파리 브라우저 정책으로 인해 안되는 경우가 있음. NotSupportedError MediaSource가 지워되는 포맷으로 만들어지지?표현? 되지 않은 경우, 아무튼 포맷 뭔가 안맞을 때 사용 예 let myVideo = document.getElementById("myVideoElement"); myVideo.play().then(() => { document... 더보기
[HTML5] #Video Tag HTML5 Video TagVideo ElementHTMLMediaElement를 상속 받음 + videoWidth, videoHeight 속성 추가.videoWidth, videoHeight : 실제 비디오의 해상도 크기.preload“none” : 재생 전에 다운로딩 안함.“metadata” : 재생 전에 포스터 같이 한장만 띄워둠.“auto” : 재생 전에 다운로딩 ㄱㄱ.IDL(Interface definition language)currentSrc : 현재 재생 중인 srcloadedmetadata 이벤트가 발생한 이후에 currentSrc를 신뢰할 수 있다.캐시에 따라 미디어 URI가 변경되지 않으면 일부 이벤트 발생 안할 수 있기 때문에상태 속성 (videoElement.상태속성) readyS.. 더보기

반응형