객체 태그를 사용하여 도메인 간 SVG 콘텐츠 문서 삽입

Question

외부 도메인(예: (data="//da86ge957603k.cloudfront.net/rails/grafitti_logo-f4e8238a87c979c0cf5b41481c982b71.svg"))의 데이터를 포함하는 SVG를 갖고 로드 이벤트를 객체에 바인딩하고 그런 다음 contentdocument 속성을 전달합니다. 이 개체의 SVG DOM에 액세스하시겠습니까? SVG가 로컬 도메인에 있을 때 이 작업을 수행할 수 있지만 다른 곳에서 SVG를 호스팅하려고 할 때마다 "this.contentDocument가 비어 있습니다" 오류가 발생합니다. 나는 또한 getSVGDocument() 을 시도했습니다. 이것이 도메인 간 보안 문제라고 말하는 곳을 찾을 수 없으며 내가 아는 한 SVG에서 사용되는 객체 태그에 대해 이것이 허용되어야 합니다(저는 iFrame을 사용하지 않습니다). 시간을 내어 도와주셔서 감사합니다. 다음은 개체와 바인딩을 포함하고 DOM에 액세스하려고 시도하는 데 사용하는 코드입니다. 앞서 말했듯이 이는 SVG가 로컬 도메인에 있을 때 작동합니다.

으아악

Answer 1

w3c가 이것을 문서화했습니다. 객체 태그에 대한 자세한 내용은 여기 를 참조하세요. CORS를 통하지 않고 도메인 전체에서 태그가 지정된 데이터에 액세스할 수 없습니다.

MDN에 더 읽기 쉬운 개선 사항이 있습니다이 문제를 해결하려면 (가능한 경우) 원격 사이트에서 CORS를 활성화

해야 합니다. 🎜