2012-02-12 1 views
6

का उपयोग करके imgur करने के लिए एक पीएनजी अपलोड करना मैं का उपयोग pngimgur पर अपलोड करने का प्रयास कर रहा हूं। मैंने सीधे इम्गुर एपीआई example से कोड का उपयोग किया है, लेकिन मुझे नहीं लगता कि मैं पीएनजी फ़ाइल को ठीक से पास कर रहा हूं क्योंकि मुझे file.type is undefined कहने में एक त्रुटि संदेश मिलता है। मुझे लगता है कि फ़ाइल ठीक है क्योंकि मैंने इसे कुछ अलग पीएनजी के साथ करने की कोशिश की है।जावास्क्रिप्ट

<html> 
<head> 
<script type="text/javascript"> 
function upload(file) { 
    // file is from a <input> tag or from Drag'n Drop 
    // Is the file an image? 
    if (!file || !file.type.match(/image.*/)) return; 

    // It is! 
    // Let's build a FormData object 
    var fd = new FormData(); 
    fd.append("image", file); // Append the file 
    fd.append("key", "mykey"); // Get your own key: http://api.imgur.com/ 

    // Create the XHR (Cross-Domain XHR FTW!!!) 
    var xhr = new XMLHttpRequest(); 
    xhr.open("POST", "http://api.imgur.com/2/upload.json"); // Boooom! 
    xhr.onload = function() { 
     // Big win! 
     // The URL of the image is: 
     JSON.parse(xhr.responseText).upload.links.imgur_page; 
    } 

    // Ok, I don't handle the errors. An exercice for the reader. 
    // And now, we send the formdata 
    xhr.send(fd); 
} 
</script> 
</head> 

<body> 

<button type="button" onclick="upload('test.png')">upload to imgur</button> 

</body> 
</html> 

png फ़ाइल test.png मेरी html फ़ाइल के रूप में एक ही निर्देशिका में संग्रहीत किया जाता है: मेरे कोड इस प्रकार है।

उत्तर

2

उदाहरण का उपयोग कर रहे उदाहरण का उदाहरण है कि आप कुछ छवि अपलोड करने के लिए इनपुट तत्व (प्रकार = फ़ाइल) का उपयोग करते हैं। this example आज़माएं। आप कैनवास like this का उपयोग कर छवि डेटा तक पहुंच सकते हैं।

संक्षेप में, यदि आप ऐसा करने की आवश्यकता होगी:

  1. अपनी फ़ाइल के साथ नए छवि बनाएँ (स्थानीय डोमेन पर होने की जरूरत है)
  2. ऑनलोड
  3. निकालें पर एक कैनवास के चित्र बनाएं this method
  4. दर्रा कि imgur करने के लिए डेटा like here
+0

सुझाव के लिए धन्यवाद का उपयोग कर छवि डेटा। कैनवास में एक छवि जोड़ने के लिए, क्या छवि 'id' है? मुझे लगता है कि मैं @ skimberk1 की टिप्पणी के आधार पर फ़ाइल नाम का उपयोग करके इसका उल्लेख नहीं कर सकता। – djq

+0

फ़ाइल नाम का उपयोग कर छवि का संदर्भ देने का कोई तरीका नहीं है। आपको इसे एक आईएमजी तत्व में लोड करने की आवश्यकता होगी और उसके बाद drawImage का उपयोग करके कैनवास में अपनी सामग्री लोड करनी होगी। आईएमजी के ऑनलोड हैंडलर पर यह बाद वाला हिस्सा करना महत्वपूर्ण है। अन्यथा यह काम नहीं करेगा। –

+0

धन्यवाद bebraw, जो मुझे प्रवाह को समझने में मदद करता है। मैं फिलहाल http://html2canvas.hertzen.com/ के साथ प्रयोग कर रहा हूं; ऐसा लगता है कि यह इन चरणों का हिस्सा होगा। – djq

3

फ़ाइल को HTML12 फ़ाइल के साथ बनाई गई File ऑब्जेक्ट होना चाहिए, आप इसे केवल फ़ाइल नाम नहीं दे सकते हैं और इसे काम करने की उम्मीद कर सकते हैं।

जावास्क्रिप्ट के पास फाइल सिस्टम तक कोई पहुंच नहीं है, यह केवल ड्रैग और ड्रॉप या फ़ाइल इनपुट का उपयोग करके दी गई फ़ाइलों तक पहुंच सकता है।

संबंधित मुद्दे