2011-06-01 28 views
5

के साथ छवि को बाइनरी सरणी (ब्लॉब) में परिवर्तित करना मैं एक फ़ाइल को बाइनरी सरणी में परिवर्तित करने के लिए क्रोम और फ़ायरफ़ॉक्स में HTML5 में समर्थित 'फ़ाइल रीडर' और 'फ़ाइल' एपीआई का उपयोग करने की कोशिश कर रहा हूं, लेकिन ऐसा प्रतीत नहीं होता है क्रोम पर सही ढंग से काम करने के लिए।एचटीएमएल 5

<input id="image_upload" type="file" /> 

और यहाँ से मैं jQuery का उपयोग कर रहा छवि की सामग्री हड़पने के लिए और फिर एपीआई का उपयोग कर:: मैं बस इनपुट प्रकार के रूप में एक फ़ाइल के साथ एक सरल HTML पृष्ठ है File.getAsBinary() यह एक द्विआधारी सरणी में बदलने के लिए । यह Firefox पर पूरी तरह से नहीं बल्कि काम करता है क्रोम पर:

uncaught TypeError: Object #<File> has no method 'getAsBinary' 

मैं सबसे अप-टू-डेट संस्करण का उपयोग कर रहा हूँ:

$('#image_upload').change(function() { 
    var fileList = this.files; 
    var file = fileList[0]; 
    var data = file.getAsBinary(); 
      //do something with binary 
}); 

इस विधि क्रोम पर निष्पादित जब मैं कह कंसोल में कोई त्रुटि मिलती है Google क्रोम का जो आज (2011-05-31) संस्करण है: 11.0.696.71 और स्रोतों के अनुसार इस विधि को क्रोम के सबसे वर्तमान संस्करण के साथ समर्थित माना जाना चाहिए।

ऐसा प्रतीत नहीं होता है इसलिए मैंने FileReader एपीआई का उपयोग करने की कोशिश की और उसके साथ कोई भाग्य नहीं था। मैं कोई लाभ नहीं हुआ ऐसा करने की कोशिश की:

$('#image_upload').change(function() { 
    var fileList = this.files; 
    var file = fileList[0]; 
    var r = new FileReader(); 
    r.readAsBinaryString(file); 
    alert(r.result); 
]); 

लेकिन वह केवल कुछ भी नहीं है जो मुझे लगता है क्योंकि readAsBinaryString() एक शून्य तरीका है देता है। क्रोम और फ़ायरफ़ॉक्स दोनों के लिए यह काम करने के तरीके के बारे में मुझे पूरी तरह से नुकसान हुआ है। मैंने बिना किसी लाभ के अनगिनत उदाहरणों को देखकर पूरे वेब पर खोज की है। मैं इसे कैसे काम कर सकता हूं?

उत्तर

8

FileReader एपीआई एक अतुल्यकालिक एपीआई है, तो आप इस बजाय की तरह कुछ करने की जरूरत है:

var r = new FileReader(); 
r.onload = function(){ alert(r.result); }; 
r.readAsBinaryString(file); 
0

पता लगा मैं जैसे अपने आप को वापस करने के लिए एक कॉल पारित जा सकते हैं:

create_blob(file, function(blob_string) { alert(blob_string) }); 

function create_blob(file, callback) { 
    var reader = new FileReader(); 
    reader.onload = function() { callback(reader.result) }; 
    reader.readAsDataURL(file); 
} 

यह पूरी तरह से काम करता है। एक बार समाप्त हो जाने के बाद मैं ऑनलोड फ़ंक्शन से वापस लौटा हुआ ब्लॉब पास कर सकता हूं।