2011-09-25 10 views
6

द्वारा अनुमति नहीं है, मैं एक साधारण एमवीसी कंट्रोलर एक्शन बनाता हूं, जो कुछ जेसन डेटा लेता है - फिर सत्य या गलत लौटाता है।अजाक्स जेसन पोस्ट डोमेन पर नियंत्रक को पोस्ट करें, "एक्सेस-कंट्रोल-स्वीट-हेडर

[AllowCrossSiteJson] 
    public JsonResult AddPerson(Person person) 
    { 
      //do stuff with person object 
      return Json(true); 
    } 

मैं जावास्क्रिप्ट से यह कहते हैं:

 function saveData(person) { 
      var json = $.toJSON(person); //converts person object to json 
      $.ajax({ 
       url: "http://somedomain.com/Ajax/AddPerson", 
       type: 'POST', 
       dataType: 'json', 
       data: json, 
       contentType: 'application/json; charset=utf-8', 
       success: function (data) { 
        alert("ok"); 
       } 
      }); 
     } 

सब कुछ जब तक मैं एक ही डोमेन पर कर रहा हूँ काम करता है, लेकिन जैसे ही मैं इसे किसी अन्य डोमेन से कहते हैं, मैं समस्याओं में चलाते हैं।

नियंत्रक पर एक एक्शन फ़िल्टर "AllowCrossSiteJson" है जो हेडर "एक्सेस-कंट्रोल-ऑब्जेक्ट-ऑरिजन" को "*" पर सेट करता है, जिससे किसी भी उत्पत्ति को नियंत्रक क्रिया तक पहुंचने की अनुमति मिलती है।

public class AllowCrossSiteJsonAttribute : ActionFilterAttribute 
{ 
    public override void OnActionExecuting(ActionExecutingContext filterContext) 
    { 
     filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*"); 
     base.OnActionExecuting(filterContext); 
    } 
} 

हालांकि - मैं तो जब डोमेन के बीच बुला, फ़ायरबग में इस त्रुटि मिलती है:

विकल्प http://somedomain.com/Ajax/AddPerson?packageId=3 500 (आंतरिक सर्वर त्रुटि) XMLHttpRequest http://somedomain.com/Ajax/AddPerson लोड नहीं कर सकता। अनुरोध हेडर फ़ील्ड एक्सेस-कंट्रोल-स्वीकृति-हेडर द्वारा सामग्री-प्रकार की अनुमति नहीं है।

यहां क्या गलत है?

मैं घंटों के लिए संभावित समाधान देख रहा हूं, और ऐसा लगता है कि विकल्प का उपयोग कर jquery के साथ कुछ करना है (जैसा कि मैं उम्मीद करता हूं पोस्ट नहीं)।

यदि यह वास्तव में समस्या है, तो मैं इसे कैसे ठीक कर सकता हूं?

उत्तर

7

मैं आपको JSONP की सलाह दूंगा, यह क्रॉस डोमेन AJAX के लिए एकमात्र वास्तव में क्रॉस ब्राउज़र और विश्वसनीय समाधान है।

public class JsonpResult : ActionResult 
{ 
    private readonly object _obj; 

    public JsonpResult(object obj) 
    { 
     _obj = obj; 
    } 

    public override void ExecuteResult(ControllerContext context) 
    { 
     var serializer = new JavaScriptSerializer(); 
     var callbackname = context.HttpContext.Request["callback"]; 
     var jsonp = string.Format("{0}({1})", callbackname, serializer.Serialize(_obj)); 
     var response = context.HttpContext.Response; 
     response.ContentType = "application/json"; 
     response.Write(jsonp); 
    } 
} 

और उसके बाद:

public ActionResult AddPerson(Person person) 
{ 
    return new JsonpResult(true); 
} 

और अंत में क्रॉस डोमेन AJAX कॉल करते हैं:

$.ajax({ 
    url: 'http://somedomain.com/Ajax/AddPerson', 
    jsonp: 'callback', 
    dataType: 'jsonp', 
    data: { firstName: 'john', lastName: 'smith' }, 
    success: function (result) { 
     alert(result); 
    } 
}); 
तो तुम एक कस्टम क्रिया नतीजा यह है कि एक कॉलबैक साथ JSON उत्तर लपेटो जाएगा लिख ​​कर शुरू कर सकता है
+4

मैं:

http://www.w3.org/TR/cors/

"सामग्री प्रकार" क्योंकि "application/json" मूल्यों यहां बताए गए मेल नहीं खाता शामिल किया जाना चाहिए तुमसे प्यार करता हूँ और अपने बच्चों को रखना चाहता हूँ। – Kjensen

+0

क्या यह केवल अनुरोध प्राप्त करने के साथ काम नहीं करता है? –

+0

हां, JSONP का jQuery कार्यान्वयन केवल GET अनुरोधों के साथ काम करता है। –

21

एक्सेस-कंट्रोल-अनुमति-उत्पत्ति त्रुटि को ठीक करने के लिए, आपको अपनी प्रतिक्रिया में निम्न शीर्षलेख शामिल करने की आवश्यकता है:

Access-Control-Allow-Headers: Content-Type

असल में, किसी भी "गैर-सरल" शीर्षलेख को ऊपर दिए गए शीर्षलेख में अल्पविराम-सीमित सूची के रूप में शामिल करने की आवश्यकता है। अधिक जानकारी के लिए CORS कल्पना की जाँच करें:

http://www.w3.org/TR/cors/#terminology

+0

महान जवाब! JSONP से काफी बेहतर है। –

संबंधित मुद्दे