टूटा हुआ यूट्यूब थंबनेल त्रुटि कॉलबैक

Question

कोई छवि त्रुटि कॉलबैक आग नहीं करेगा यदि कोई छवि 404 है, लेकिन मेजबान किसी भी छवि को वापस लौटाता है?

मैं क्लाइंट पर निर्धारित करने की कोशिश कर रहा हूं कि सर्वर पर यूआरएल जमा करने से पहले एक यूट्यूब थंबनेल मान्य है या नहीं। आम तौर पर आप प्रारूप के साथ अपने एपीआई से पूछे बिना एक थंबनेल URL उत्पन्न कर सकते हैं http://img.youtube.com/vi/**ID**/maxresdefault.jpg

कुछ वीडियो उच्च रिज़ॉल्यूशन थंबनेल की जरूरत नहीं है, उदाहरण के लिए, यह एक: http://img.youtube.com/vi/ty62YzGryU4/maxresdefault.jpg

हालांकि, एक कम गुणवत्ता थंबनेल हमेशा मौजूद है: http://img.youtube.com/vi/ty62YzGryU4/default.jpg

आदर्श रूप में मैं चाहे थंबनेल लोड किया पता लगाने के लिए इस कोड स्निपेट, होगा जो "किया" कहते हैं जब यह एक वैध थंबनेल लोड के माध्यम से सक्षम हो जाएगा:

var id = "ty62YzGryU4" 
var tries = 0 
var thumb = "http://img.youtube.com/vi/" + id + "/maxresdefault.jpg" 
var img = new Image() 
img.onload = function(){ console.log('ok'); done(id, thumb) } 
img.onerror = function(){ 
    switch (tries++){ 
     case 0: 
      img.src = thumb = "http://img.youtube.com/vi/" + id + "/hqdefault.jpg" 
      break; 
     case 1: 
      img.src = thumb = "http://img.youtube.com/vi/" + id + "/default.jpg" 
      break; 
     case 2: 
      done(id, thumb) 
      break; 
    } 
} 
img.src = thumb 
if (img.complete) img.onload() 

हालांकि यह मामला नहीं है - जबकि मुझे कंसोल में 404 त्रुटि दिखाई देती है, न तो अधिभार और न ही आतंक कॉलबैक आग लगती है, और इस प्रकार done कभी नहीं कहा जाता है।

यदि मैं img.crossOrigin = "Anonymous" सेट करता हूं तो आतंक कॉलबैक आग ... प्रत्येक थंबनेल के लिए, शापित क्रॉस-ओरिजिनल रिसोर्स शेयरिंग पॉलिसी के कारण।

मैं भी एक XMLHttpRequest क्राफ्टिंग की कोशिश की है, लेकिन कोई लाभ नहीं हुआ: मैं सेट

xmlhttp = new XMLHttpRequest() 
xmlhttp.onreadystatechange = function() { 
    console.log(xmlhttp.readyState) 
    console.log(xmlhttp.status) 
}; 
xmlhttp.open('GET', url, true); 
xmlhttp.send(null); 

चाहे X-Requested-With: XMLHttpRequest या नहीं, readyState चला जाता है 1 से 4 के लिए, लेकिन स्थिति हमेशा शून्य!

क्या यह देखने के लिए कोई तरीका है कि इस विशेष छवि ने एपीआई का उपयोग किये बिना 404 दिया है?

Answer 1

YouTube थंबनेल आतंक() फ़ंक्शन को नहीं फेंकेंगे क्योंकि YouTube एक और बेस 64 gif छवि भेजता है जो खाली वीडियो आइकन दिखाता है जिसमें 120X90 का संकल्प होता है। (यह समाधान की कुंजी है)

ध्यान दें कि आपको maxresdefault छवि के साथ छवि टैग लोड करना चाहिए और इसे या (उन्हें) एक निश्चित वर्ग देना चाहिए, उदा। "यूट्यूब अंगूठे"।

जानकारी के लिए: maxresdefault 1080, sddefault 720, hqdefault 480, mqdefault 360, डिफ़ॉल्ट 240

सीमित प्रयोगों के अनुसार, 0.jpg 480 या सबसे अच्छा कम-रिज़ॉल्यूशन वाला एक वीडियो के लिए उपलब्ध छवि है।

 $(function() 
     { 

     $('.youtube-thumb').each(function(ix, it){ 

      if($(it)[0].naturalHeight <= 90) 
      { 
      var path = $(it).attr('src'); 
      var altpath = path.replace('maxresdefault.jpg','0.jpg'); 

      $(it).attr('src', altpath); 
      } 


     }); 

    });