यह jQuery AJAX PUT क्रोम में क्यों काम करता है लेकिन एफएफ

Question

क्रोम में यह एक HTTP PUT ऐसा ही करता है, लेकिन फ़ायरफ़ॉक्स 21 में ऐसा नहीं होता है। जावास्क्रिप्ट कंसोल में या बैकएंड में कोई त्रुटि नहीं है। यहाँ

<div id="createTeamModal" class="small reveal-modal"> 
     <form id="createTeamForm"> 
      <div class="row"><p id="teamFlavorText" class="lead">Building a new team</p></div> 
      <div class="row"> 
       <div class="small-4 large-4 columns"><label>Team Name:</label></div> 
       <div class="small-6 large-6 columns"><input name="teamName" id="teamName" type="text" size="20"/></div> 
      </div> 
      <div class="row"><p class="lead">Does this team work for a business?</p></div> 
      <div class="row"> 
       <div class="small-4 large-4 columns"><label>Business Size:</label></div> 
       <div class="small-6 large-6 columns"> 
        <select id="businessSizeSelect" name="businessSizeSelect"> 
        <option value="1">Nope, I work alone</option><option value="2">2 to 49</option><option value="3">50 to 99</option><option value="4">100 to 999</option><option value="5">1,000+</option> 
        </select> 
       </div> 
      </div> 
      <div id="businessLocationDiv" class="row" style="display: none; margin-top: 20px;"> 
       <div class="small-4 large-4 columns"><label>Business Location:</label></div> 
       <div class="small-6 large-6 columns"> 
        <select id="businessLocationSelect" name="businessLocationSelect"> 
        </select> 
       </div> 
      </div> 
      <div id="businessTypeDiv" class="row" style="display: none; margin-top: 20px;"> 
       <div class="small-4 large-4 columns"><label>Industry:</label></div> 
       <div class="small-6 large-6 columns"> 
        <select id="businessTypeSelect" name="businessTypeSelect">      
        </select> 
       </div> 
      </div> 
      <div class="row" style="margin-top: 20px;"> 
       <div class="large-offset-10 small-1 large-1 columns"> 
        <button id="createTeamButton" class="small button">Create</button> 
       </div> 
      </div> 
     </form> 
     <a class="close-reveal-modal">&#215;</a> 
    </div> 

और है jQuery:

यहाँ HTML है

$("#createTeamButton").click(function() { 
    var teamObject = new Team(); 
    teamObject.description = $("#teamName").val(); 
    teamObject.businessSize = $("#businessSizeSelect").val(); 
    teamObject.businessType = $("#businessTypeSelect").val(); 
    teamObject.businessLocation = $("#businessLocationSelect").val(); 

    $.ajax({ 
     type: "PUT", 
     url: "/ajax/rest/team", 
     dataType: "json", 
     data: JSON.stringify(teamObject), 
     success: function() { 
      // Reload the team select box 
      loadTeamSelectBox(); 

      // Pop up the site create modal 
      $('#createSiteModal').foundation('reveal', 'open'); 
     }, 
     error: ajaxErrorHandler 
    }); 
}); 

मैं उन्हें फ़िडलर में देखा है, और (क्रोम) काम कर रहा है और काम कर के बीच अंतर (Firefox) यह है कि HTTP PUT क्रोम में आग लगती है और फ़ायरफ़ॉक्स में आग नहीं होती है।

अब, मुझे पता है कि jQuery.ajax PUT सभी ब्राउज़रों में गारंटी नहीं है।

मैं

• Are the PUT, DELETE, HEAD, etc methods available in most web browsers?
• http://annevankesteren.nl/2007/10/http-method-support

इन साइटों कि PUT सभी ब्राउज़रों में काम नहीं कर सकता पुष्टि पढ़ा है, लेकिन एफएफ में काम करना चाहिए।

अंत में, मैं FF21 साथ निम्नलिखित मारा और PUT

• http://www.mnot.net/javascript/xmlhttprequest/

मैं निश्चित रूप से इस के आसपास इंजीनियर सकता है काम करता है, लेकिन यह इस काम करना चाहिए मुझे लगता है। मैं बल्कि जेरी-रिग कुछ नहीं, बल्कि jQuery के .ajax ठीक से काम करने के लिए मिलता है।

अन्य विवरण: * jQuery संस्करण 2.0.0 * बैकएंड Spring3

है

[HTML संपादित करें जोड़ने के लिए]

Answer 1

यहां एक निराशाजनक उत्तर है। बटन क्लिक फॉर्म सबमिट कर रहा था, भले ही वह ऐसा करने के लिए बाध्य न हो। मैंने ऑनसबिट = "झूठी वापसी;" रूप में और समस्या हल हो गई थी।

Answer 2

मुझे लगता है कि आप कुछ और अनुपलब्ध हो सकता है - इस jsFiddle पर एक PUT अनुरोध करता है नवीनतम Chrome और Firefox 21:

http://jsfiddle.net/QKkQg/

 var teamObject = new Object(); 
    teamObject.description = $("#teamName").val(); 
    teamObject.businessSize = $("#businessSizeSelect").val(); 
    teamObject.businessType = $("#businessTypeSelect").val(); 
    teamObject.businessLocation = $("#businessLocationSelect").val(); 

    $.ajax({ 
     type: "PUT", 
     url: "/ajax/rest/team", 
     dataType: "json", 
     data: JSON.stringify(teamObject), 
     success: function() { 
      // Reload the team select box 
      loadTeamSelectBox(); 

      // Pop up the site create modal 
      $('#createSiteModal').foundation('reveal', 'open'); 
     }, 
     error: function() { } 
    }); 

Answer 3

मैं ग an't खिड़कियों पर फ़ायरफ़ॉक्स 21.0 पर अपने दावे का उत्पादन, जब मैं google.com और प्रेस F12 (फ़ायरबग) के लिए जाना फिर उसके बाद निम्न कोड चलाएँ:

var s = document.createElement("script"); 
s.src="http://code.jquery.com/jquery-1.9.1.js"; 
document.body.appendChild(s); 
//allow some time to load and then run this 
$.ajax({ 
    type: "PUT", 
    url: "/search", 
    dataType: "json", 
    data: JSON.stringify({hi:"there"}), 
    success: function (data) { 
    console.log(data); 
    }, 
    error: function(e) { 
    console.log(e); 
    } 
    }); 

मैं प्रतिक्रिया 405 पद्धति की अनुमति लेकिन अधिक महत्वपूर्ण नहीं मिल; कंसोल में कनेक्शन के विवरण खोलते समय मैं PUT देख सकता हूं, पोस्ट नहीं।

जब मैं http://jqueryui.com/autocomplete/#remote पर जाता हूं और यूआरएल का उपयोग करके कोड (JQuery शामिल किए बिना) चलाता हूं: "/ संसाधन/डेमो/स्वतः पूर्ण/search.php" एक्सएमएल सफल होता है और फ़ायरबग शो पुट अनुरोध करता है।

मुझे ऐसी साइट नहीं पता है जहां मैं जांच कर सकता हूं कि सर्वर साइड कोड PUT अनुरोध का पता लगाता है (Google POST को भी अस्वीकार करता है, इसलिए यह एक पोस्ट हो सकता है) लेकिन फायरबग रिपोर्टिंग के रूप में यह एक पुट अनुरोध भेज रहा है।

[अद्यतन]

मैं फ़ायरफ़ॉक्स 21.0 पर कोड ऊपर 100% यकीन है कि एक PUT अनुरोध कर रहा है कि इस बात की पुष्टि कर सकते हैं। बस इसे एक .net ऐप के साथ परीक्षण किया गया और क्रोम 27.0.1453.9 4 एफएफ दोनों ने एक पुट अनुरोध सेट किया।

Answer 4

आप यह निर्दिष्ट नहीं कर रहे हैं कि आप सर्वर पर किस प्रकार की सामग्री भेज रहे हैं। मुझे एक ऐसी ही समस्या थी जहां सर्वर ने क्वेरी से डेटा को पढ़ने की कोशिश भी नहीं की थी क्योंकि यह नहीं पता था कि प्रदत्त प्रारूप क्या था, इसलिए इसे अभी अनदेखा कर दिया गया।

एक jQuery अनुरोध पर dataType निर्दिष्ट करते समय, आप केवल jQuery को बता रहे हैं कि सर्वर को आपको अपेक्षित प्रारूप क्या है। सर्वर क्या डेटा स्वरूप आप भेज रहे हैं बताने के लिए, आपको वह एक contentType:

$.ajax({ 
    type: "PUT", 
    url: "/ajax/rest/team", 
    dataType: "json", 
    contentType: "application/json", 
    data: JSON.stringify(teamObject) 
}).done(function() { 
    // Reload the team select box 
    loadTeamSelectBox(); 

    // Pop up the site create modal 
    $('#createSiteModal').foundation('reveal', 'open'); 

}).fail(ajaxErrorHandler); 

Backbone.js एक अच्छा RESTful API कि आप as reference का उपयोग कर सकते है।