2013-01-15 12 views
5

HTML5 kanvasını ve işlevini KineticJS's.toDataURL() yöntemiyle kullanıyorum. Tuval, kullanıcıların siteye yüklediği, başka bir makinede ve alt alan adına kayıtlı farm1.domain.com görüntülerini kullanır.canvas.toDataURL() bir güvenlik hatasına neden

Sorun: Hata

SECURITY_ERR: DOM Exception 18 

bu etrafında bir yolu var mı .toDataURL() çağrıldığında, ben olsun? Kullanıcı domain.com aracılığıyla sayfaya erişirse ve görüntü www.domain.com adresinde barındırılıyorsa ben de aynı sorunu yaşıyorum.

Denemesi:

Ben virtualhosta içinde httpd.conf aşağıdaki satırları eklendi ve apache servisini yeniden başlattı. domain.com üzerine sayfasından www.domain.com barındırılan görüntüyü erişirken

Header add Access-Control-Allow-Origin "http://www.domain.com" 
Header add Access-Control-Allow-Origin "http://domain.com" 
Header add Access-Control-Allow-Origin "http://farm1.domain.com" 

hala aynı hatayı alıyorum! KineticJS'de bunun bir yolu var mı?

+0

Muhtemelen bir tekrar: http://stackoverflow.com/questions/9344548/security-error-with-canvas-todataurl-and-drawimage?rq=1 ve http://stackoverflow.com/questions/2390232/ neden-tuval-todataurl-atma-a-güvenlik-istisnası –

+0

yinelenen ve cevaplandı, ilgili sütuna ilgili bak ve burada [spec] (http://www.w3.org/TR/2011 /WD-html5-20110405/the-canvas-element.html#security-with-canvas-elements) – antejan

+0

Hatalardan kaçınmak için kaynak temiz bayrağı doğru olarak ayarlanmış mıyım? KineticJS'de yapılabilir mi? – Nyxynyx

cevap

0

Bu hatanın etrafı yoktur. Farklı bir etki alanından bir brandaya yüklenen resimler, bu hatayı her tarayıcı tarafından uygulandığı haliyle yükseltecektir. Sizin durumunuzda görüntüler aynı alanda saklanmalı ve istisnalar elde etmeyecektiniz.

+0

Özellikle resimlerin tek bir sunucuya sığmaması durumunda, görüntüleri diğer sunucularda ve CDN'lerde saklayamam gerçekten garip ... – Nyxynyx

+0

@ Nyxynyx Evet, maalesef tuval elemanının güvenlik sınırlaması. –

1

Access-Control-Allow-Origin başlıklarını, yüklediğiniz sayfaya değil, yüklediğiniz resimlere eklemeniz gerekir. Bu başlık ve genel olarak CORS ile ilgili ayrıntılar için, özellikle bu konuyu ele alan "CORS isn't just for XHR" adresini okumak isteyebilirsiniz.