سؤال

لإضافة بعض الأخطاء الأساسية في التعامل مع أردت كتابة قطعة من التعليمات البرمجية التي تستخدم مسج دولار.getJSON لسحب بعض الصور من فليكر.والسبب في ذلك هو أن $.getJSON لا توفر معالجة الخطأ أو العمل مع مهلة.

منذ $.getJSON هو مجرد التفاف حول $.اياكس قررت كتابة شيء والمفاجأة يعمل لا تشوبه شائبة.

الآن يبدأ المرح مع ذلك.عندما تسبب عمدا 404 (عن طريق تغيير عنوان URL) أو يسبب الشبكة مهلة (قبل لا يتم التوصيل إلى interwebs) حدث خطأ لا النار في كل شيء.أنا في حيرة ما أفعله خطأ.مساعدة هي موضع تقدير كبير.

هنا كود:

$(document).ready(function(){

    // var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne"; // correct URL
    var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne_______"; // this should throw a 404

    $.ajax({
        url: jsonFeed,
        data: { "lang" : "en-us",
                "format" : "json",
                "tags" : "sunset"
        },
        dataType: "jsonp",
        jsonp: "jsoncallback",
        timeout: 5000,
        success: function(data, status){
            $.each(data.items, function(i,item){
                $("<img>").attr("src", (item.media.m).replace("_m.","_s."))
                          .attr("alt", item.title)
                          .appendTo("ul#flickr")
                          .wrap("<li><a href=\"" + item.link + "\"></a></li>");
                if (i == 9) return false;
            });
        },
        error: function(XHR, textStatus, errorThrown){
            alert("ERREUR: " + textStatus);
            alert("ERREUR: " + errorThrown);
        }
    });

});

أود أن أضيف أن هذا السؤال عندما سئل مسج كان في النسخة 1.4.2

هل كانت مفيدة؟

المحلول

ومسج 1.5 و أعلى لديها دعم أفضل للتعامل مع طلبات JSONP الخطأ. ومع ذلك، تحتاج إلى استخدام الأسلوب $.ajax بدلا من $.getJSON. بالنسبة لي، وهذا يعمل:

var req = $.ajax({
    url : url,
    dataType : "jsonp",
    timeout : 10000
});

req.success(function() {
    console.log('Yes! Success!');
});

req.error(function() {
    console.log('Oh noes!');
});

والمهلة يبدو أن تفعل خدعة واستدعاء معالج خطأ، عندما لا يكون هناك طلب ناجح بعد 10 ثانية.

وفعلت القليل من مشاركة المدونة حول هذا الموضوع أيضا.

نصائح أخرى

وهذا هو وجود قيود معروفة مع تنفيذ jsonp الأصلي في مسج. النص أدناه من IBM DeveloperWorks

<اقتباس فقرة>   

وJSONP هي تقنية قوية جدا ل   بناء المزج، ولكن، للأسف،   أنها ليست علاجا للجميع الخاص بك   يحتاج التواصل عبر المجال. هذا   لديه بعض السلبيات التي يجب أن تؤخذ   بعين الاعتبار بشكل جدي قبل   تخصيص الموارد التنمية.   أولا وقبل كل شيء، ليس هناك خطأ   التعامل مع المكالمات JSONP. إذا كان   يعمل ديناميكية الإدراج النصي، ل   الحصول دعا. إن لم يكن، لا يحدث أي شيء.   انها مجرد فشل بصمت. فمثلا،   لم تكن قادرة على التقاط خطأ 404   من الخادم. ولا يمكنك إلغاء أو   إعادة تشغيل الطلب. يمكنك، ومع ذلك،   مهلة بعد انتظار معقولة   مقدار الوقت. (المستقبل مسج   قد يكون إصدارات ميزة إحباط ل   JSONP الطلبات.)

ولكن هناك jsonp في المكونات متاح في GoogleCode التي توفر الدعم للخطأ معالجة. لتبدأ، فقط قم بإجراء التغييرات التالية إلى التعليمات البرمجية.

ويمكنك إما تنزيل، أو مجرد إضافة مرجع نصي لفي المكونات.

<script type="text/javascript" 
     src="http://jquery-jsonp.googlecode.com/files/jquery.jsonp-1.0.4.min.js">
</script>

وبعد ذلك تعديل دعوة اياكس الخاص بك كما هو موضح أدناه:

$(function(){
    //var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne"; // correct URL
    var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne_______"; // this should throw a 404  
    $.jsonp({
        url: jsonFeed,
        data: { "lang" : "en-us",
                "format" : "json",
                "tags" : "sunset"
        },
        dataType: "jsonp",
        callbackParameter: "jsoncallback",
        timeout: 5000,
        success: function(data, status){
            $.each(data.items, function(i,item){
                $("<img>").attr("src", (item.media.m).replace("_m.","_s."))
                          .attr("alt", item.title)
                          .appendTo("ul#flickr")
                          .wrap("<li><a href=\"" + item.link + "\"></a></li>");
                if (i == 9) return false;
            });
        },
        error: function(XHR, textStatus, errorThrown){
            alert("ERREUR: " + textStatus);
            alert("ERREUR: " + errorThrown);
        }
    });
});

وهناك حل إذا كنت عالقا مع مسج 1.4:

var timeout = 10000;
var id = setTimeout( errorCallback, timeout );
$.ajax({
    dataType: 'jsonp',
    success: function() {
        clearTimeout(id);
        ...
    }
});

وهذا قد يكون "معروف" الحد من مسج. ومع ذلك، فإنه لا يبدو أن تكون موثقة جيدا. قضيت حوالي 4 ساعات اليوم في محاولة لفهم لماذا بلادي مهلة لم يكن يعمل.

وأنا تحولت إلى jquery.jsonp وعملت يحب سحر. شكرا لك.

يبدو أن حلها كما مسج 1.5.لقد حاولت رمز أعلاه و أحصل على رد.

أقول "يبدو" لأن الوثائق من الخطأ رد مسج.اياكس() لا يزال لديه الملاحظة التالية:

ملاحظة:هذا المعالج لا يسمى عبر المجال النصي JSONP الطلبات.

مسج-jsonp البرنامج المساعد مسج المذكورة في خوسيه باسيليو هو الجواب يمكن الآن العثور على جيثب.

للأسف الوثائق إلى حد ما المختلف لذا وفرت مثال بسيط:

    $.jsonp({
        cache: false,
        url: "url",
        callbackParameter: "callback",
        data: { "key" : "value" },
        success: function (json, textStatus, xOptions) {
            // handle success - textStatus is "success"   
        },
        error: function (xOptions, textStatus) {
            // handle failure - textStatus is either "error" or "timeout"
        }
    });

المهم وتشمل callbackParameter في مكالمة $.jsonp() خلاف ذلك لقد وجدت أن وظيفة رد الاتصال لم يحصل حقن سلسلة الاستعلام من استدعاء الخدمة (الحالي اعتبارا من الإصدار 2.4.0 مسج-jsonp).

أعرف أن هذا السؤال هو قديم ولكن مسألة معالجة الخطأ باستخدام JSONP لا يزال غير 'حل'.نأمل أن هذا التحديث سوف تساعد الآخرين على هذا السؤال هو أعلى مرتبة في جوجل عن "مسج jsonp معالجة الأخطاء".

وماذا عن الاستماع إلى الحدث onerror في البرنامج النصي؟ كان لي هذه المشكلة وحلها عن طريق تصحيح طريقة مسج حيث تم إنشاء العلامة النصي. هنا هو بت مثيرة للاهتمام من التعليمات البرمجية:

// Attach handlers for all browsers
script.onload = script.onreadystatechange = function( _, isAbort ) {

    if ( isAbort || !script.readyState || /loaded|complete/.test( script.readyState ) ) {

        cleanup();

        // Callback if not abort
        if ( !isAbort ) {
            callback( 200, "success" );
        }
    }
};

/* ajax patch : */
script.onerror = function(){
    cleanup();

    // Sends an inappropriate error, still better than nothing
    callback(404, "not found");
};

function cleanup(){
    // Handle memory leak in IE
    script.onload = script.onreadystatechange = null;

    // Remove the script
    if ( head && script.parentNode ) {
        head.removeChild( script );
    }

    // Dereference the script
    script = undefined;
}

ما رأيك في هذا الحل؟ هل من المحتمل أن يسبب مشاكل التوافق؟

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top