2011-08-05 13 views
10

में बाइनरी डेटा निर्दिष्ट करने के लिए कैसे मेरे पास बाइनरी स्ट्रिंग के रूप में स्क्रीनशॉट है। मैं $ .post() फ़ंक्शन का उपयोग कर सर्वर पर कुछ डेटा पोस्ट करना चाहता हूं।jquery पोस्ट फ़ंक्शन

मेरे कोड:

var filename = "screenshot.jpg": 
var filedataUrl = "";// string like 'data:image/jpeg;base64,/9j/4A .....' 

$.post(serverUrl, { 
title: title 
name: name 

/*here must be my file */ 

}, function(response) { 
       alert('ok'); 
}); 

मैं संलग्न फाइल के रूप में पैरामीटर कैसे निर्दिष्ट कर सकते हैं?

+0

आपको इस पोस्ट के जवाब द्वारा रुचि हो सकती है http://stackoverflow.com/questions/19148065/how-to-post-binary-file-from-jquery-client-to-java-server- उपयोग-आराम –

उत्तर

2

आपको कुछ चीजें करने की आवश्यकता होगी।

सबसे पहले आपको दायरटाटाउआरएल को तोड़ने की आवश्यकता होगी। आप केवल बेस 64 डेटा चाहते हैं, बाकी नहीं। फिर स्ट्रिंग होल्डिंग बाइनरी डेटा में स्ट्रिंग को डीकोड करने के लिए Base64 encoding and decoding in client-side Javascript में विधियों का उपयोग करें।

फिर उस पोस्ट को अपने पोस्ट अनुरोध में शामिल करें।

1

मुझे नहीं लगता कि आप फ़ाइल नाम का उपयोग कर छवि अपलोड कर सकते हैं। आपको फ़ाइल इनपुट तत्व के साथ एक फॉर्म बनाने की आवश्यकता हो सकती है जहां उपयोगकर्ता फ़ाइल चुन सकता है (जावास्क्रिप्ट के माध्यम से नहीं)।

फिर AJAX का उपयोग करके फ़ॉर्म सबमिट करें।

+0

मेरे पास अभी भी छवि है। यह ब्राउज़र स्क्रीनशॉट है। मुझे केवल इसे फ़ाइल के रूप में पास करने की आवश्यकता है। – kitshark

+0

उस स्थिति में, फ़ाइल को बेस 64 में कनवर्ट करना और इसे AJAX के माध्यम से पोस्ट करना सबसे अच्छा विकल्प है। @ एरियल का जवाब आपके लिए उपयुक्त होगा। – KishoreK

4

तकनीकी तौर पर बेस 64 बाइनरी डेटा के पाठ प्रतिनिधित्व है - अगर आप के साथ इस ऊपर उत्तर सही हैं ठीक कर रहे हैं। यदि आप वास्तविक बाइनरी डेटा भेजना चाहते हैं तो आपको FormData का उपयोग करना होगा।

यदि मैं आपका प्रश्न सही तरीके से पढ़ रहा हूं तो आप कैनवास तत्व में HTML "स्क्रीनशॉट" सहेज रहे हैं। यदि ऐसा है तो toDataURL पढ़ने के बजाय आपको toBlob का उपयोग करना चाहिए। यह आपको बाइनरी डेटा है कि हम FormData

var form = new FormData(); 

form.append('image', blob, 'image.jpg'); 
का उपयोग कर भेज सकते हैं दे देंगे

ऊपर नियमित XMLHttpRequest का उपयोग कर भेजने के हो सकते हैं:

var request = new XMLHttpRequest(); 

request.open('POST', 'http://foo.com/submitform.php'); 
request.send(form); 

कार्य उदाहरण ->codepen

यदि आप क्रोम निरीक्षक पर गौर करेंगे आप देखेंगे कि सही मल्टीपार्ट अनुरोध बनाया गया है:

------WebKitFormBoundaryGWsPW93HnMPQFcXB 
Content-Disposition: form-data; name="image"; filename="image.jpg" 
Content-Type: image/jpeg 

------WebKitFormBoundaryGWsPW93HnMPQFcXB-- 

तुम भी jQuery के साथ प्रपत्र ऊपर भेज सकते हैं:

$.ajax({ 
    url: 'http://foo.com/submitform.php', 
    type: 'POST', 
    data: form, 
    processData: false, 
    contentType: false 
}); 

अद्यतन

बस PHP में सर्वर साइड पर फाइल अपलोड निपटने के बारे में आपकी जानकारी में देखा था। अपलोड की गई फ़ाइल $ _FILES सरणी में उपलब्ध है:

<?php 
    $uploaddir = '/var/www/uploads/'; 
    $uploadfile = $uploaddir . basename($_FILES['image']['name']); 
    if (move_uploaded_file($_FILES['image']['tmp_name'], $uploadfile)) { 
     echo "File was successfully uploaded.\n"; 
    } else { 
     echo "Error"; 
    } 
    echo 'File info:'; 
    print_r($_FILES); 
?> 
1

base64 इनकोडिंग छवि भी एक सामान्य स्ट्रिंग है। आप इसे jQuery पोस्ट में data के रूप में पास कर सकते हैं।

यह निम्न की तरह होगा।

var filename = "screenshot.jpg": 
var filedataUrl = "";// string like 'data:image/jpeg;base64,/9j/4A .....' 

$.post(serverUrl, { 
    title: title, 
    name: name, 
    image: filedataUrl, 
}) 
.done(function(res){ 
    alert('ok') 
}) 
संबंधित मुद्दे