[React] 배경화면 동영상/사진 - Safari 자동재생 안됨, Chrome 구분하여 자동재생 작동하기 구현


[React] 배경화면 동영상/사진 - Safari 자동재생 안됨,  Chrome 구분하여 자동재생 작동하기 구현

동아리 웹사이트를 만들면서 Home 화면 배경화면 동영상이 Safari에서는 자동 재생이 안된다는 사실을 알게 되었다.. 알고 보니 사파리는 사용자 경험을 향상시키기 위해 자동 재생 정책을 가지고 있는데, 광과민성 발작을 일으킬 수 있는 영상, 음란물, 폭력, 혐오, 공포가 포함된 영상 등이 자동 재생되어 원치 않게 보게되는 문제를 방지하기 위해 화면이 딱 켜졌을 때에 대한 자동 재생을 막아두었다. 그래서 사용자의 스크롤 컨트롤이 생기면 자동 재생이 되는 기능을 넣자고 하기도 했지만..ㅎㅎ 그래서 우리는 Safari일 때와 Chorme일때의 환경을 JS로 읽어와 서로 다른 인터렉션을 보여주기로 결정하였다. 사용자 에이전트(userAgent) 문자열 읽어오기 -> 사용자 에이전트 문자열을 읽어오기 위해 U..


원문링크 : [React] 배경화면 동영상/사진 - Safari 자동재생 안됨, Chrome 구분하여 자동재생 작동하기 구현