React - 클릭 이벤트로 모바일에서 동영상 자동 재생

Question

여러 이미지가있는 React 앱이 있습니다. 이미지를 클릭하면 iFrame API를 통해 YouTube 동영상이로드되는 모달이 열립니다. 나는 비디오 iframe을 https://www.npmjs.com/package/react-youtube

모달을로드하려면이 옵션을 사용하고

는 조건 추가 상태 modalVisible를 사용하여 DOM에 제거 : 참/거짓.

{this.state.modalVisible ? <div className="Modal"><YouTube videoId="2g811Eo7K8U" onReady={this._onReady} /></div> : null} 

이 필요할 때 모달을 표시 한 후 표시 블록을 페이지로드에 이미 내부에 장착 된 비디오 전통적인 모달 대에 필요하고 경우에만 비디오를로드하기 때문에 이것은 아주 좋습니다.

모바일 동영상에서는 자동 재생 (https://developers.google.com/youtube/iframe_api_reference#Mobile_considerations)이 불가능하므로 기존 숨기기/표시 사전로드 된 모달에서는 이미지를 클릭하여 모달을 표시 할 때 함수를 호출하고 event.target.playVideo();을 사용하여 비디오를 재생하여 본질적으로 자동 재생합니다.

_onReady(event) { 
    // access to player in all event handlers via event.target 
    event.target.playVideo(); 
} 

을로드 할 수있는 방법이 있나요 : 나 이미지가 비디오를 클릭 할 때 모달로 먼저 비디오를로드하여 그것을 할 때 event.target.playVideo(); 비디오가로드되면 onready 함수를 호출 할 때 작동하지 않습니다 그러면 클릭 이벤트가 발생하기 전에 동영상을로드하지 않고 클릭 기능에서 자동 재생할 수 있습니까?

Answer 1

아니요, 실제 사용자 클릭 없이는 비디오를 시작할 수 없습니다. 브라우저에서 프로그래밍 방식으로 클릭을 실행하면 실제 사용자 동작이 아닌 것으로 브라우저에서 알 수 있습니다.

사용자가 이미지를 클릭 할 때 동영상을 시작하려면 iframe이 DOM에 있어야합니다.