audio 태그 자동 재생 해결 방안 및 크로스 브라우징 청첩장을 만드는 도중 배경음악을 위한 태그 사용에 대한 문제가 발생해서 이 문제를 어떻게 해결했는지에 대한 정리 글을 남기며 다시 한번 공부하려고 한다. 문제청첩장을 만드는 과정에서 청첩장이 렌더링 되었을 때 배경음악이 자동으로 재생될 수 있도록 만들고 싶었다. 당연하게도 에는 자동 재생을 지원하는 autoplay 속성이 있어 이를 사용하면 될 줄 알았다. 하지만 대부분의 최신 브라우저들이 더 나은 사용자 경험과 보안정책상 사용자의 인터랙션이 없는 상태에서는 자동 재생을 허용하지 않는다는 것을 알게 되었다. 해결가장 첫번 째로 생각한 방법은 스크롤 이벤트가 발생하면 자동으로 재생될 수 있도록 하는 것이었다. 그렇게 작성한 코드는 아래와 같다. import { useEffect, useRef, useS.. 이전 1 다음