작동하지 나는이 작업을 수행. 봤는데 .SVG 파일과 관련된 문제로 돌아 왔지만 SVG 파일을 사용하지 않고 PNG 및 JPG 만 사용하고 있습니다. 여기 내 코드의 피들입니다 : http://jsfiddle.net/ykpCn/2/ 투명 PNG를 사용하고 있기 때문에 그런가요? 내가 뭘 잘못하고 있는지 모르겠다. HTML5를 처음 접했을 때, 내가 간과 한 바보가 아니기를 바랍니다.hml5의 toDataUrl() 크롬
1
A
답변
2
이 문제는 크로스 오리진 자원 액세스와 관련됩니다. 캔버스에 렌더링 한 이미지는 다른 출처에서 가져온 것입니다 (http://moosepi.com). 다른 출처의 이미지에서는 toDataURL()을 호출 할 수 없습니다.
Chrome 개발자 도구를 실행하면 콘솔에서 찾을 수 있습니다. "잡히지 않은 오류 : SECURITY_ERR : DOM 예외 18". 이것은 spec에 따른 예상 된 동작입니다.
솔루션 : 1. 호스트 서버에서 이미지 (프록시 설정을 사용하고있을 수 있습니다). 2. 자원에 CORS 속성을 설정하십시오. 소스가 적절한 헤더를 설정해야한다는 것을 기억하십시오.
2
웹 서버에서 호스팅되는 경우 크롬에서만 작동하는 것 같습니다. 서버에 업로드 한 다음 거기에서 보았지만 로컬에서 작동하지 않으면 제대로 작동합니다. 내 질문은 지금 어리 석다. 낭비를해서 죄송합니다.
+1
귀하의 질문은 작은 문제가 ,, 당신이 일을 얻을 수있는 실제 환경에서 테스트하지 말았어야하지 ... 크롬은 말쑥한 브라우저이기 때문에 난 그냥 이것에 반나절을 낭비 ... 전혀 바보 아니다 일하다. – GRowing
관련 문제
- 1. canvas.drawImage .toDataURL
- 2. toDataUrl - 이미지를 IE에 저장 하시겠습니까?
- 3. toDataURL 캔버스 drawImage
- 4. Three.js를 toDataUrl 빈
- 5. 알파 채널이없는 Canvas toDataURL
- 6. 빈 캔버스 toDataURL() 검정색이됩니다.
- 7. canvas toDataUrl to facebook
- 8. toDataURL 대 toDataURLHD
- 9. getImageData toDataURL HTML5로 변환
- 10. iOS HTML5 Canvas toDataURL
- 11. HTML5의 toDataURL 무엇입니까?
- 12. Canvas toDataURL() 빈 이미지
- 13. toDataUrl 안내 찾아보기
- 14. 파이썬 toDataUrl 동등한
- 15. 캔버스 .. toDataURL 업로드하여
- 16. canvas toDataURL jpg 품질
- 17. canvas toDataURL from string
- 18. toDataURL 만 사용하여 픽셀 조작하기
- 19. Firefox - 작업이 안전하지 않습니다. [toDataURL]
- 20. jquery를 통해 toDataUrl 이미지 업로드
- 21. IE11에서 캔버스 toDataURL 보안 오류
- 22. 캔버스 크기를 조정하여 base64 toDataURL()의 크기도 조정하십시오.
- 23. toDataUrl base64 문자열을 페이지의 이미지로 변환
- 24. canvas toDataUrl 메서드가 rgba 값을 조작합니까?
- 25. toDataURL ("image/png") to Facebook Upload
- 26. .toDataUrl()을 사용하여 캔버스 오류가 발생했습니다.
- 27. node.js 서버에서 -toDataURL() 함수를 구현하는 방법은 무엇입니까?
- 28. 300dpi (imagemagick) 및 todataurl/base64로 캔버스 저장
- 29. Canvas toDataURL()은 Firefox에서만 빈 이미지를 반환합니다.
- 30. fabric.js에서 toDataUrl 함수를 편집하는 방법은 무엇입니까?
정말 고마워요! 이것은 정확하게 나의 문제이었다! 또한 ... 나는 방화범과 같이 크롬 개발자 도구에 대해 몰랐습니다. – Silas