मैं एक वेब एप्लिकेशन लिख रहा हूं जिसमें वेबपृष्ठ पर छवियों की एक उचित संख्या बनाने (और हटाने) का निरंतर चक्र शामिल है। प्रत्येक छवि सर्वर द्वारा गतिशील रूप से जेनरेट की जाती है।मैं एक निरस्त AJAX अनुरोध से बाइनरी छवि डेटा कैसे वापस कर सकता हूं और परिणाम को HTML/DOM छवि के स्रोत पर सेट कर सकता हूं?
var img = document.createElement("img");
img.src = "http://mydomain.com/myImageServer?param=blah";
कुछ मामलों में, इनमें से कुछ छवियां डाउनलोड करने से पहले उनकी उपयोगिता को पार करती हैं। उस बिंदु पर, मैं उन्हें डोम से हटा देता हूं।
समस्या यह है कि ब्राउजर उन छवियों को डाउनलोड करने के लिए भी जारी है उन्हें DOM से हटा दिए जाने के बाद। इससे एक बाधा उत्पन्न होती है, क्योंकि मेरे पास नई छवियां डाउनलोड होने की प्रतीक्षा कर रही हैं, लेकिन उन्हें पुरानी अनियंत्रित छवियों को पहले डाउनलोड करने के लिए इंतजार करना होगा।
मैं उन अनियंत्रित छवि डाउनलोड को रोकना चाहता हूं।
// Code sample uses jQuery, but jQuery is not a necessity
var img = document.createElement("img");
var xhr = $.ajax({
url: "http://mydomain.com/myImageServer?param=blah",
context: img,
success: ImageLoadedCallback
});
function ImageLoadedCallback(data)
{
this.src = data;
}
function DoSomethingElse()
{
if (condition)
xhr.abort();
}
लेकिन समस्या यह है कि यह है: स्पष्ट समाधान लगता AJAX (के बाद से AJAX अनुरोध निरस्त किया जा सकता है) के माध्यम से द्विआधारी छवि डेटा का अनुरोध, और img.src स्थापित करने के लिए डाउनलोड पूरा होने के एक बार होने के लिए लाइन जिस तरह से मैंने आशा की थी, वह काम नहीं करता:
this.src = data;
मैंने उच्च और निम्न खोज की है। AJAX के माध्यम से भेजे गए बाइनरी छवि डेटा में छवि स्रोत सेट करने का कोई तरीका नहीं है?
आपकी प्रतिक्रिया के लिए धन्यवाद। दुर्भाग्य से, मुझे काफी व्यापक ब्राउज़र समर्थन की आवश्यकता है - और मुझे यकीन नहीं है कि बेस 64-एन्कोडिंग काम करेगी; मुझे इन छवियों को जितना संभव हो उतना छोटा होना चाहिए। – Michael