مشهد
إذا كان هناك خادمان لهما أسماء مختلفة ، A.COM و B.com ، في واجهة b.com/b_return_js.php ، يمكن الحصول على بعض البيانات. بالطبع ، إذا كان على صفحة B.com ، فيمكنك استخدام AJAX لطلب هذه الواجهة مباشرة ، ولكن ماذا لو تم طلبها على صفحة A.COM.
رمز واجهة B_RETURN_JS.PHP:
نسخة الكود كما يلي:
$ a = صفيف (
Array ('username' => 'Tony' ، 'Age' => 25) ،
Array ('username' => 'Yimeng' ، 'Age' => 23) ،
Array ('username' => 'ermeng' ، 'Age' => 22) ،
Array ('username' => 'Sanmeng' ، 'Age' => 21) ،
) ؛
خلط ورق اللعب ($ a) ؛
echo 'var userData =' .json_encode ($ a). '؛' ؛ // عمومًا ، إذا كان طلب موقع من B.com ، فسيتم إرجاع JSON_ENCODE مباشرة ($ a). ومع ذلك ، إذا كنت ترغب في استخدام سمة SRC لتحقيق المجال المتقاطع ، نحتاج هنا إلى تعيين هذه القيمة لمتغير JS للتأكد من أنه يمكن الحصول على هذه البيانات واستخدامها في الصفحة المحملة بواسطة علامة البرنامج النصي.
تنفيذ بسيط
هناك طريقة سهلة للذهاب مباشرة على الصفحة تحت A.COM
نسخة الكود كما يلي:
<script src = "http://b.com/b_return_js.php"> </script>
وبهذه الطريقة ، يمكن الحصول على البيانات التي يتم إرجاعها في هذه الواجهة مباشرة من صفحة A.COM.
ولكن هناك عيب هنا. لا يمكن الحصول على هذه البيانات إلا عند تحميل الصفحة. إذا أردنا استخدام AJAX ، فإن الطريقة التي يمكنها الحصول على بيانات واجهة جديدة في أي وقت غير مناسبة للغاية. على سبيل المثال ، النقر فوق زر للحصول على بيانات تم تحديثها جزئيًا من هذه الواجهة ، فإن هذه الطريقة غير ملائمة إلى حد ما.
تنفيذ فئة AJAX
في الواقع ، فإن فكرة تنفيذ فئة Ajax المذكورة أعلاه هي تجديد العلامة أعلاه عند تشغيل حالة AJAX ، وذلك للحصول على بيانات من الواجهة مرة أخرى. ومع ذلك ، في الواقع ، لا يزال من الصعب بعض الشيء تنفيذها (على الأقل استغرق الأمر الكثير من الجهد بالنسبة لي).
على الرمز:
إذا كان هناك زر أسفل صفحة A.com/scriptsrc.php
<type type = "button" id = "ajax_request_from_b" value = "request from B.com"/>
ستحصل كل نقرة على بيانات من واجهة b.com/b_return_js.php ، على غرار رمز تنفيذ AJAX:
نسخة الكود كما يلي:
وظيفة إنشاء الوصرف ()
{
//console.log(le) ؛
ele.src = 'http://b.com/b_return_js.php' ؛
ele.type = 'text/javaScript' ؛
ele.language = 'javaScript' ؛
}
وظيفة getData ()
{
console.log (userData) ؛
}
$ ('#ajax_request_from_b'). انقر فوق (function () {
// يجب إعادة تحميل علامة البرنامج النصي في كل مرة ، لذلك يجب إعادة تنشيط علامة نصية جديدة في كل مرة لضمان الحصول على البيانات من خادم المجال المتقاطع.
إذا (ele && ele.parentnode)
{
//ele.parentnode.removechild(le) ؛ // لا يمكن لهذا النوع من الحذف حذف ELE تمامًا من الذاكرة ، ولكن فقط قم بإزالة الموقع في DOM
لـ (خاصية var في ELE) {
حذف ele [property] ؛ // حذف تماما
}
}
eLe = document.createElement ('script') ؛ // هذا إله جديد
CreateScript () ؛
document.getElementsByTagName ("Head") [0] .AppendChild (eLE) ؛
ele.onload = function () {getData ()} ؛ // يمكن الحصول على userData بعد تحميل عنصر البرنامج النصي. في كل مرة يتم الحصول على معلومات المستخدم بترتيب عشوائي.
}) ؛
وبهذه الطريقة ، في كل مرة تنقر فيها على الزر ، ستحصل على البيانات من الواجهة مرة أخرى ، والتأثير يشبه Ajax ، ولكن هذه طريقة متعددة المجال لـ JS. على الرغم من أنه لا يكرر قليلاً ، إلا أنه لا يزال وسيلة للتفكير.