2013-01-15 38 views
5

का कारण बन रहा है मैं KineticJS's.toDataURL() विधि के माध्यम से HTML5 कैनवास और .toDataURL() फ़ंक्शन का उपयोग कर रहा हूं। कैनवास उन छवियों का उपयोग करता है जो मेरे उपयोगकर्ता साइट पर अपलोड किए जाते हैं, जो एक अलग मशीन और सबडोमेन farm1.domain.com पर संग्रहीत होते हैं।canvas.toDataURL() एक सुरक्षा त्रुटि

समस्या: जब .toDataURL() कहा जाता है, मैं करने के त्रुटि

SECURITY_ERR: DOM Exception 18 

वहाँ इस के चारों ओर एक रास्ता नहीं है? यदि उपयोगकर्ता domain.com के माध्यम से पृष्ठ तक पहुंचता है और छवि www.domain.com पर होस्ट की जाती है तो मुझे भी वही समस्या मिलती है।

प्रयास:

मैं वर्चुअलहोस्ट भीतर httpd.conf के लिए निम्न पंक्तियां जोड़ी और अपाचे सेवा को पुनः आरंभ।

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" 

जब domain.com पर पेज से www.domain.com पर होस्ट छवि तक पहुँचने मैं अभी भी एक ही त्रुटि मिलती है! KineticJS में इसके आसपास कोई रास्ता है?

+0

संभावित रूप से दोहराना: http://stackoverflow.com/questions/9344548/security-error-with-canvas-todataurl-and-drawimage?rq=1 और http://stackoverflow.com/questions/2390232/ क्यों-करता-कैनवास-टोडाटॉरल-फेंक-ए-सुरक्षा-अपवाद –

+0

डुप्लिकेट और उत्तर दिया गया था, दाएं कॉलम से संबंधित देखें, और यहां [spec] (http://www.w3.org/TR/2011 है) /WD-html5-20110405/the-canvas-element.html#security-with-canvas-elements) – antejan

+0

मुझे लगता है कि त्रुटि से बचने के लिए मूल-साफ़ ध्वज सत्य पर सेट किया जाना चाहिए? क्या यह KineticJS में किया जा सकता है? – Nyxynyx

उत्तर

0

इस त्रुटि के आसपास कोई रास्ता नहीं है। किसी भिन्न डोमेन से कैनवास में लोड की गई छवियां इस त्रुटि को वर्तमान में प्रत्येक ब्राउज़र द्वारा कार्यान्वित की जाएगी। आपके मामले में छवियों को एक ही डोमेन में संग्रहीत किया जाना चाहिए और आपको अपवाद नहीं मिलेंगे।

+0

में समस्याएं हैं, यह वास्तव में अजीब बात है कि मैं अपनी छवियों को अन्य सर्वरों और सीडीएन में स्टोर नहीं कर सकता, खासकर जब छवियों की मात्रा एक सर्वर में फिट नहीं हो सकती ... – Nyxynyx

+0

@ Nyxynyx हां दुर्भाग्य से यह कैनवास तत्व की एक सुरक्षा सीमा है। –

1

आपको उन छवियों को Access-Control-Allow-Origin शीर्षलेख जोड़ने की आवश्यकता होगी, जो उन्हें लोड करने वाले पृष्ठ पर नहीं हैं। इस शीर्षलेख के विवरण के लिए, और सामान्य रूप से सीओआरएस पर, आप "CORS isn't just for XHR" पढ़ना चाहेंगे, जो विशेष रूप से इस समस्या पर चर्चा करता है।