[HTML] Video 태그 ios 미 재생 현상 해결하기

Video 태그 ios 미 재생 현상 해결하기

 

🩸이슈 발생

Video 태그가 분명 커밋 전 로컬에서는 자동재생까지 됐는데 모바일(ios)에서는 재생버튼조차 생성되지 않았다.

 

728x90

 

---

🩹이슈 해결

 video 태그에 속성 추가하기

1) autoplay : 자동재생 (단, 안될 때 많음)
2) loop : 반복실행
3) muted : 음소거
4) playsinline: ios에서 비디오 전체화면 미처리를 위한 설정

<video autoplay="" loop="" muted="" playsinline="" width="220" height="243">
	<source src="/videos/realStory-01.mp4" type="video/mp4">
</video>

---

💡유의사항

브라우저 정책 상 음소거 설정(muted) 을 하지 않으면 자동재생 제한이 있으며,

사용자의 핸드폰이 저전력 모드일 경우 자동재생이 되지 않는다.