في الآونة الأخيرة ، واجه Ajax مشاكل عبر المجال عند زيارة WebService. ابحث عن المعلومات عبر الإنترنت وتلخيصها على النحو التالي (يعتقد الكثير منهم أنهم قاموا بنسخها جيدًا)
<< استخدم JSON لنقل البيانات ، تعتمد على JSONP إلى المجال المتقاطع >>
أولاً ، سأضيف الرمز الذي تم تنفيذه:
رمز الواجهة الأمامية:
$ .ajax ({type: "get" ، url: "http: //localhost/service1.asmx/getelevatorstatusjsondata؟ jsoncallback =؟ i ++) {ALERT (DATA [i]رمز الخادم:
/// <summary> /// الحصول على معلومات بيانات الحالة /// </summary> /// <returns> </returns> [WebMethod] public void getEleVatorStatusjsondata () {list <list <DeviceInfo >> elevatordatas = new list <list <listinfo >> () ؛ قائمة <SrendDicDate> SearchList = xmlserializeHelper.xmldeserializeFromFile <list <SrendDicDate >> (@configutil.servicepath + configutil.getConfigByKey ("xmlpath") + "معلومات التوجيه. foreach (عنصر sendDicDate في قائمة البحث) {string key = item.portno + "-" + item.bordrate + "-" + item.SendType ؛ قائمة <CuperInfo> deviceInfolist = (list <PuctionInfo>) context.cache.get (key) ؛ Elevatordatas.Add (DeviceInfolist) ؛ } string result = "" ؛ datacontractjsonserializer json = datacontractjsonserializer (eventordatas.gettype ()) ؛ باستخدام (MemoryStream Stream = new MemoryStream ()) {json.writeObject (Stream ، elevatordatas) ؛ النتيجة = الترميز. utf8.getString (Stream.toarray ()) ؛ } String jsoncallback = httpcontext.current.request ["jsoncallback"] ؛ النتيجة = jsoncallback + '(' + result + ')' ؛ httpcontext.current.response.write (النتيجة) ؛ httpcontext.current.response.end () ؛ }ج#
ما ورد أعلاه هو رمز التنفيذ الذي يدعو خادم C# ، وما يلي هو جانب Java. قد تكون المعلمات مختلفة ، لكن المبادئ هي نفسها
جافا:
سلسلة callbackfunname = context.request ["CallbackParam"] ؛ context.Response.write (callbackfunname + "([{/" name/":/" john/"}])") ؛PS: يتم استخدام معلمة JSONP للعميل لتمرير المعلمات من خلال عنوان URL وتمرير اسم المعلمة لمعلمة JSONPCallback. من الصعب نطقها ، وبعوبة بسيطة:
JSONP: ""
jsonpcallback: ""
بالمناسبة: في متصفح Chrome ، يمكنك أيضًا تعيين سياق معلومات الرأس. Response.addHeader ("Access-Control-Opping-Origin" ، "*") ؛ على الخادم لتحقيق الغرض من طلبات المجال المتقاطع ، وليس هناك حاجة لتعيين المعلمات التالية من Ajax
نوع البيانات: "JSONP" ، JSONP: "CallbackParam" ، JsonpCallback: "JsonpCallback1"
يمكن الحصول على البيانات في وضع طلب AJAX العادي.
ما يلي هو المبدأ. إنه شعور معقول للغاية عندما تقرأ ما شرحه الآخرون:
1. مشكلة معروفة. تطلب AJAX مباشرة ملفات عادية بدون إذن للوصول عبر المجالات. بغض النظر عما إذا كنت صفحة ثابتة ، أو صفحة ويب ديناميكية ، أو خدمة ويب ، أو WCF ، طالما أنها طلب عبر المجال ، فلن يكون صحيحًا ؛
2. ومع ذلك ، وجدنا أنه عند استدعاء ملفات JS على صفحة الويب ، لا يتأثرون بما إذا كانت مداولة (ليس فقط ذلك ، وجدنا أيضًا أن جميع العلامات مع السمة "SRC" لها قدرات عبر المجال ، مثل
3. لذلك يمكن الحكم على أنه في هذه المرحلة ، إذا كنت ترغب في الوصول إلى البيانات عبر المجالات من خلال Web Pure (عناصر تحكم ActiveX ، وكيل الخادم ، و WebSockets المستقبلية HTML5 ، وما إلى ذلك ، فإن محاولة تحميل البيانات في ملف تنسيق JS على الخادم البعيد حتى يتصل العميل بمزيد من المعالجة ؛
4. نعلم أن هناك تنسيق بيانات حرف نقي يسمى JSON يمكنه وصف البيانات المعقدة بشكل إنتاجه. والأفضل من ذلك هو أن JSON مدعوم أصليًا من قبل JS ، بحيث يمكن للعميل معالجة البيانات بهذا التنسيق كما تريد ؛
5. هذا الحل يخرج. يقوم عميل الويب باستدعاء ملف تنسيق JS (عادةً مع JSON باعتباره اللاحقة) التي تم إنشاؤها ديناميكيًا على خادم المجال المتقاطع بنفس طريقة برنامج الاتصال. من الواضح أن السبب في أن الخادم يرغب في إنشاء ملفات JSON ديناميكيًا هو تحميل البيانات التي يحتاجها العميل.
6. بعد أن نجح العميل في استدعاء ملف JSON ، يحصل على البيانات التي يحتاجها. الباقي هو معالجة وعرضه وفقا لاحتياجاته الخاصة. تبدو طريقة الحصول على البيانات عن بُعد مشابهة جدًا لـ Ajax ، لكنها مختلفة بالفعل.
7. من أجل تسهيل العميل لاستخدام البيانات ، تم تشكيل بروتوكول نقل غير رسمي تدريجياً. الناس يطلقون عليه jsonp. تتمثل إحدى النقاط الرئيسية لهذا البروتوكول في السماح للمستخدمين بتمرير معلمة رد الاتصال إلى الخادم. عندما يقوم الخادم بإرجاع البيانات ، فإنه سيستخدم معلمة رد الاتصال هذه كاسم دالة للف بيانات JSON ، بحيث يمكن للعميل تخصيص وظائفه الخاصة لمعالجة بيانات الإرجاع تلقائيًا.
من السهل على المطورين الأذكياء الاعتقاد أنه طالما أن البرنامج النصي JS الذي يوفره الخادم يتم إنشاؤه ديناميكيًا ، يمكن للمتصل تمرير المعلمة وإخبار الخادم "أريد قطعة من رمز JS تستدعي وظيفة XXX ، يرجى إرجاعها إلي" ، حتى يتمكن الخادم من إنشاء البرنامج النصي JS والرد وفقًا لاحتياجات العميل.
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3 xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> </title> <script type = "text/javaScript"> "+'yu piao'+data.tickets+'Zhang. } ؛ // توفير عنوان url لخدمة JSONP (بغض النظر عن نوع العنوان ، فإن قيمة الإرجاع النهائية هي جزء من رمز JavaScript) var url = "http://flightquery.com/jsonp/flightresult.aspx؟code=ca1998&callback=flightlerler" ؛ // قم بإنشاء علامة نصية وقم بتعيين سمات Var Script = document.createElement ('script') ؛ script.setAttribute ('src' ، url) ؛ // أضف علامة البرنامج النصي إلى الرأس ، وبدأت المكالمة //document.getElementSbyTagName('head') budap00. </script> </head> <body> </body> </html> <! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> page بدون عنوان </title> <script type = "text/javaScript" src = jquery.min.js "> </script> <script type =" text/javascript " $ .ajax ({type: "get" ، async: false ، url: "http://flightquery.com/jsonp/flightresult.aspx؟code=ca1998" jsonpcallback: "Flighthandler" ، // اسم وظيفة الاتصال JSONP المخصصة ، الافتراضي هو اسم الوظيفة العشوائية التي تم إنشاؤها تلقائيًا بواسطة jQuery ، أو يمكنك الكتابة "؟" ، ستعمل jQuery على معالجة البيانات تلقائيًا لك النجاح: وظيفة (json) Zhang. ') ؛أليس هذا غريبا بعض الشيء؟ لماذا لم أكتب وظيفة flighthandler هذه المرة؟ وقد ركض بالفعل بنجاح! هاها ، هذا هو ائتمان jQuery. عندما يتعامل jQuery مع JSONP نوع Ajax (لا يسعني إلا أن أشتكي. على الرغم من أن JQuery يصنف JSONP أيضًا في AJAX ، فهي في الواقع ليست نفس الشيء) ، فإنها ستقوم تلقائيًا بإنشاء وظيفة رد اتصال وإخراج البيانات الخاصة بطريقة سمة النجاح للاتصال بها. أليس هذا جيد جدا؟