팁 & 노하우

|  분야 불문! 어떤 분야든지 자신이 알고 있는 팁이나 노하우를 남겨주세요.

조회 수 153 추천 수 0 댓글 1
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

조금 뒷북이긴 하지만 구글의 유튜브 autoplay 정책에 변화가 있었습니다.


https://developers.google.com/web/updates/2017/09/autoplay-policy-changes


따라서 현재 autoplay가 허용되는 경우는 다음과 같이 세 가지입니다.


  • Muted autoplay is always allowed.
  • Autoplay with sound is allowed if:
    • User has interacted with the domain (click, tap, etc.).
    • On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously play video with sound.
    • On mobile, the user has [added the site to their home screen].
  • Top frames can delegate autoplay permission to their iframes to allow autoplay with sound.



1번에 따라 다음과 같은 파라미터를 사용하면 여전히 autoplay를 할 수 있지만 대신 음소거 모드로 재생됩니다.



?autoplay=1&mute=1


블랙핑크의 비교적 최신 직캠을 예로 들어 설명하겠습니다 ^^


다음과 같은 iframe 태그를 삽입하면 autoplay가 가능합니다.



<iframe width="560" height="315" src="https://www.youtube.com/embed/E11p66uJVMY?autoplay=1&mute=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>





만약 음소거 등 제한을 우회하고 싶으시다면 관련된 javascript 등 플러그인을 사용하시면 됩니다.


예컨대 아미나의 basic-youtube-title 위젯의 경우에는 다른 플러그인을 사용하여


메인화면에 접속하면 소리를 켠 상태로 autoplay가 되도록 하고 있습니다.


다만 제가 테스트한 바로는 한 페이지에서 두 개의 위젯을 사용하면 충돌이 발생했고,

(이에 대해 한별아빠 님께서도 한 페이지에 하나의 위젯만 사용하라고 말씀하셨습니다)


제가 정확한 소스를 분석하지는 못했지만 다른 javascript 플러그인과도 충돌이 있는 것 같습니다.


그리고 아래 URL의 plyr를 사용하면 음소거가 아닌 autoplay를 지원하는 것 같네요.


https://github.com/sampotts/plyr


  • profile
    이니스프리 2019.01.05 18:49
    plyr를 이용하여 다음과 같은 방법으로 IE, 파폭, 크롬에서 autoplay가 가능하다고 하네요.

    player.on('ready', () => {
    player.play();
    })

    다만 사파리에서는 autoplay 적용이 안 되는 것 같습니다.

팁 & 노하우

분야 불문! 어떤 분야든지 자신이 알고 있는 팁이나 노하우를 남겨주세요.

List of Articles
번호 제목 글쓴이 날짜 조회 수
공지 구글 로그인 문제가 있던 부분을 해결하였습니다. 7 마스터 2019.03.13 177
공지 당분간 호스팅 신청을 받지 않습니다. 20 마스터 2019.02.27 647
공지 회원 전용 페이지가 생겼습니다. 15 file 마스터 2018.03.20 5767
217 Asus MB169AC를 USB Type-C 아닌 포트에서 사용하는 방법 이니스프리 2019.03.16 17
216 [아미나] 아미나 2.0으로의 리뉴얼 계획 이니스프리 2019.03.12 15
215 Linux에서 Screen 패키지를 사용하는 방법과 그 이유 6 file Seia 2019.02.20 47
214 직구시 건강보조식품의 통관과 관련하여 1 이니스프리 2019.02.05 35
213 [아미나] 미소 컴퍼니 / 미소 심플 테마와 관련된 정보 1 이니스프리 2019.02.05 21
212 [학습정보] 구글 게이밍 아카데미 2/18 9 file 이니스프리 2019.02.05 35
211 [스퀘어넷] Ubuntu Server 18.04 LTS 지원 1 이니스프리 2019.02.04 29
210 [강좌 추천] 파이썬을 파이썬답게 7 이니스프리 2019.02.01 69
209 [아미나] 한별아빠 님의 미소 심플 1.0 테마 출시, 미소 컴퍼니 2.2 테마 업그레이드, jake 님의 PORTFOLIO 테마 출시 5 이니스프리 2019.02.01 39
208 [Vultr] 2/1 service alert 이니스프리 2019.01.31 23
207 토크멘터리 전쟁사를 유튜브에 업로드 되기 전에 시청하는 방법 이니스프리 2019.01.27 18
206 변압기 소음을 줄이는 방법 6 이니스프리 2019.01.27 105
205 체온계/의료기기의 통관과 관련된 사항입니다 1 이니스프리 2019.01.17 50
204 MySQL 최신버전에서 그누보드 설치시 비밀번호 오류 해결하기 도토리묵 2019.01.13 30
» 유튜브 iframe api의 autoplay 옵션과 관련하여 1 이니스프리 2019.01.05 153
202 2019년 공휴일 미리보기(?) 2 file 이니스프리 2019.01.05 29
201 [유튜브] 타인의 유튜브 재생목록 공유하기 이니스프리 2019.01.04 62
200 ESET Internet Security 사용시 인터넷 속도저하와 관련하여 이니스프리 2019.01.01 159
199 [파이썬/PHP] 스트링 앞에 0 채워서 자리수 맞추기 이니스프리 2019.01.01 26
198 Bose Sleepbuds의 사용 환경 등에 관하여 이니스프리 2018.12.31 21
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 11 Next
/ 11
서버에 요청 중입니다. 잠시만 기다려 주십시오...