إنشاء طلبات JSONP من JavaScript بدون مكتبات خارجية

بالنسبة لطلبات JSONP عبر النطاقات في JavaScript، المكتبات الخارجية مثل jQuery ليست ضرورية دائمًا. فيما يلي دليل لتحقيق ذلك باستخدام جافا سكريبت خالص:

الخطوة 1: إنشاء وظيفة رد اتصال

ابدأ بتحديد وظيفة رد اتصال لتلقي استجابة JSONP ومعالجتها. في المثال المقدم، تؤدي الدالة foo هذه المهمة:

function foo(data) {
  // Do something with the JSON response here
}

الخطوة 2: إنشاء عنصر البرنامج النصي ديناميكيًا

بعد ذلك، قم بإنشاء عنصر

var script = document.createElement('script');
script.src = '//example.com/path/to/jsonp?callback=foo';

الخطوة 3: إلحاق عنصر البرنامج النصي بـ DOM

بمجرد العنصر

document.getElementsByTagName('head')[0].appendChild(script);

بالنسبة للمتصفحات الحديثة، يمكنك تبسيط هذا السطر إلى:

document.head.appendChild(script);

مثال

بدمج هذه الخطوات معًا، إليك مثال كامل لإنشاء طلب JSONP في JavaScript بدون مكتبة خارجية :

function foo(data) {
  // Do stuff with JSON
}

var script = document.createElement('script');
script.src = '//example.com/path/to/jsonp?callback=foo'

document.head.appendChild(script);