이번에는 canvas.toDataURL 이미지/png 오류 보고서와 이를 처리하는 방법, 그리고 canvas.toDataURL 이미지/png 오류 보고서를 처리할 때 어떤 참고사항이 있는지 알려드리겠습니다. 다음은 실제 사례입니다. 봐.
문제 배경:
재생된 동영상의 스크린샷을 찍어야 하는 상황이 발생했습니다. 동영상 태그를 사용하여 동영상이 재생된 후 동영상 재생 영역을 클릭하면 실시간 프레임 사진이 캡처됩니다.
코드는 다음과 같이 매우 간단합니다.
var video = document.getElementById('video'); var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); var img = document.getElementById('img'); function snapshot() { ctx.drawImage(video,0,0); img.src = canvas.toDataURL('image/png'); } video.addEventListener('click', snapshot, false);
문제 팁:
Uncaught SecurityError: 'HTMLCanvasElement'에서 'toDataURL'을 실행하지 못했습니다: 오염된 캔버스를 내보낼 수 없습니다.
검토 및 분석 후 다음과 같은 사실을 발견했습니다. 실제로는 동영상 파일 때문입니다. 이미지가 있는 도메인과 페이지가 있는 도메인이 달라서 도메인 간 전송 문제가 발생합니다.
해결책:
비디오 파일을 페이지 도메인 아래에 넣으세요.
이 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
관련 읽기:
위 내용은 canvas.toDataURL 이미지/png 오류 처리 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!