2013-01-22 4 views
1

작동하지 나는이 작업을 수행. 봤는데 .SVG 파일과 관련된 문제로 돌아 왔지만 SVG 파일을 사용하지 않고 PNG 및 JPG 만 사용하고 있습니다. 여기 내 코드의 피들입니다 : http://jsfiddle.net/ykpCn/2/ 투명 PNG를 사용하고 있기 때문에 그런가요? 내가 뭘 잘못하고 있는지 모르겠다. HTML5를 처음 접했을 때, 내가 간과 한 바보가 아니기를 바랍니다.hml5의 toDataUrl() 크롬

답변

2

이 문제는 크로스 오리진 자원 액세스와 관련됩니다. 캔버스에 렌더링 한 이미지는 다른 출처에서 가져온 것입니다 (http://moosepi.com). 다른 출처의 이미지에서는 toDataURL()을 호출 할 수 없습니다.

Chrome 개발자 도구를 실행하면 콘솔에서 찾을 수 있습니다. "잡히지 않은 오류 : SECURITY_ERR : DOM 예외 18". 이것은 spec에 따른 예상 된 동작입니다.

솔루션 : 1. 호스트 서버에서 이미지 (프록시 설정을 사용하고있을 수 있습니다). 2. 자원에 CORS 속성을 설정하십시오. 소스가 적절한 헤더를 설정해야한다는 것을 기억하십시오.

+0

정말 고마워요! 이것은 정확하게 나의 문제이었다! 또한 ... 나는 방화범과 같이 크롬 개발자 도구에 대해 몰랐습니다. – Silas

2

웹 서버에서 호스팅되는 경우 크롬에서만 작동하는 것 같습니다. 서버에 업로드 한 다음 거기에서 보았지만 로컬에서 작동하지 않으면 제대로 작동합니다. 내 질문은 지금 어리 석다. 낭비를해서 죄송합니다.

+1

귀하의 질문은 작은 문제가 ,, 당신이 일을 얻을 수있는 실제 환경에서 테스트하지 말았어야하지 ... 크롬은 말쑥한 브라우저이기 때문에 난 그냥 이것에 반나절을 낭비 ... 전혀 바보 아니다 일하다. – GRowing

관련 문제