एक कैनवास todataURL

Question

डीकोडिंग मुझे कैनवास की todataurl() विधि के साथ बनाए गए डेटा का उपयोग करने में कठिनाई हो रही है। वर्तमान में मेरा कोड परिणामस्वरूप डेटा को मेरे php सर्वर पर भेजता है जो उस डेटा को संग्रहीत करने के लिए फ़ाइल बनाने के लिए file_put_contents() विधि का उपयोग करता है। अब अगर मैं फ़ाइल से परिणामी gibberish को एक छवि टैग में कट और पेस्ट करता हूं तो यह ठीक काम करता है और ठीक से प्रदर्शित करता है, इसलिए मुझे लगता है कि अब तक सब कुछ peachy है।

लेकिन जब मैं जेएस में कोड का उपयोग करने का प्रयास करता हूं तो मैं मुद्दों में भागता रहता हूं। मैंने php की base64_decode विधि को आजमाया है लेकिन दूषित फ़ाइलों को जारी रखा है। मुझे यह कोड मिला:

<?php 
    $encodedData = str_replace(' ','+',$encodedData); 
    $decocedData = base64_decode($encodedData); 

और अभी भी दूषित फाइलें मिलीं। आदर्श रूप से मैं इसके साथ एक .png फ़ाइल बनाना चाहता हूं लेकिन मैं जेएस में फिर से डेटा फ़ाइल को संसाधित करने के लिए बसूंगा। किसी भी मदद की बहुत सराहना की।

Answer 1

ऐसा लगता है कि आपको toDataURL() फ़ंक्शन द्वारा छवि डेटा पर प्रीपेड किए गए शीर्षलेख से छुटकारा पाना होगा। उन ब्राउज़रों पर)

<?php 
    $decocedData = base64_decode($encodedData); 
?> 

Answer 2

जावा स्क्रिप्ट में canvas.toDataURL (से परिणाम भेज:

.. 
var data=canvas.toDataURL(); 
var output=data.replace(/^data:image\/(png|jpg);base64,/, ""); 
// now send "output" to the server 
.. 

सर्वर साइड उपयोग इस पर: क्लाइंट पक्ष पर आप इस तरह हैडर बंद पट्टी कर सकते हैं डिफ़ॉल्ट रूप से "छवि/पीएनजी" के साथ इस विधि का समर्थन करने के लिए।

var imageInfo = canvas.toDataURL(); 
// now send "imageInfo" to the server 

प्रत्यक्ष रास्ता png फ़ाइल बनाने के लिए:

<?php 
$imageInfo = imageInfoFromBrowser(); // Your method to get the data 
$image = fopen($imageInfo, 'r'); 
file_put_contents("fileName.png", $image); 
fclose($image); 
?> 

मैं/विंडोज, दूसरे संस्करण के लिए, कृपया जाँच पीएचपी 5.3 में यह काम कर रहे है।

PHP पर परीक्षण के लिए छवि डेटा नमूना।

$imageInfo = "data:image/png;base64,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" 

Answer 3

एक और महत्वपूर्ण नोट आपको ब्लैंक को प्लस में परिवर्तित करना है। आप ऐसा नहीं करते हैं, डीकोड डेटा दूषित है:

$encodedData = str_replace(' ','+',$encodedData); 
$decocedData = base64_decode($encodedData); 

आप पढ़ सकते हैं और अधिक से http://www.php.net/manual/en/function.base64-decode.php

Answer 4

अन्य समाधान मेरे लिए काम नहीं किया।

यह काम करता है:

//image sample 
$baseFromJavascript = "data:image/png;base64,BBBFBfj42Pj4"; 

// remove the part that we don't need from the provided image and decode it 
$data = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $baseFromJavascript));