jQuery的 – 如何使$ .post()使用contentType =应用程序/ json?
我注意到,当在jQuery中使用$ .post()默认的contentType是application / x-www-form-urlencoded – 当我的asp.net mvc代码需要有contentType = application / json
(看到这个问题,为什么我必须使用应用程序/ JSON: ASPNET MVC – 为什么是ModelState.IsValid假“该字段是必需的”,当该字段确实有一个值? )
我怎样才能让$ .post()发送contentType = application / json? 我已经有了大量的$ .post()函数,所以我不想更改为$ .ajax(),因为它会花费太多的时间
如果我尝试
$.post(url, data, function(), "json")
它仍然有contentType = application / x-www-form-urlencoded。 那么,如果“json”参数不将contenttype更改为json,究竟做了什么呢?
如果我尝试
$.ajaxSetup({ contentType: "application/json; charset=utf-8" });
这工作,但会影响我的每一个$ .get和$ .post,并导致一些打破。
那么有什么办法可以改变$ .post()的行为来发送contentType = application / json?
我想你可能要
1.修改源文件使$ .post始终使用JSON数据types,因为它实际上只是预先configuration的$.ajax
调用的快捷方式
要么
2. 定义您自己的效用函数,这是您要使用的$.ajax
configuration的快捷方式
要么
你可以用你自己的实现通过猴子修补来覆盖$.post function
。
示例中的JSON数据types引用从服务器返回的数据types,而不是发送到服务器的格式。
$.ajax({ url:url, type:"POST", data:data, contentType:"application/json; charset=utf-8", dataType:"json", success: function(){ ... } })
请参阅: jQuery.ajax()
最后,我find了解决scheme,这对我有用:
jQuery.ajax ({ url: myurl, type: "POST", data: JSON.stringify({data:"test"}), dataType: "json", contentType: "application/json; charset=utf-8", success: function(){ // } });
我结束了在我的脚本中添加以下方法jQuery:
jQuery["postJSON"] = function( url, data, callback ) { // shift arguments if data argument was omitted if ( jQuery.isFunction( data ) ) { callback = data; data = undefined; } return jQuery.ajax({ url: url, type: "POST", contentType:"application/json; charset=utf-8", dataType: "json", data: data, success: callback }); };
并使用它
$.postJSON('http://url', {data: 'goes', here: 'yey'}, function (data, status, xhr) { alert('Nailed it!') });
这是通过简单地从原始JQuery源代码复制“get”和“post”代码并硬编码几个参数来强制JSON POST来完成的。
谢谢!
只用
jQuery.ajax ({ url: myurl, type: "POST", data: mydata, dataType: "json", contentType: "application/json; charset=utf-8", success: function(){ // } });
已更新 @JK:如果您只用$ .post写一个代码示例 ,您可以在答案中find一个相应的示例。 我不想重复您已经研究过的相同信息直到知道:$ .post和$ .get是$ .ajax的简写forms。 因此,只需使用$ .ajax即可使用全部参数,而无需更改任何全局设置。
顺便说一下,我不会build议覆盖标准$ .post。 这是我的个人意见 ,但对我来说,这是非常重要的,不仅是程序的工作,而且所有读你程序的人都以同样的方式理解它。 在没有很重要的理由的情况下重写标准方法会导致程序代码的阅读误解 。 所以我再次重复我的build议:只需使用原始的$ .ajax表单jQuery而不是jQuery.get
和jQuery.post
并且您接收的程序不仅能够完美工作,而且可以被人们阅读而不会有任何误解。
可以作为post()的最后一个parameter passing的“json”数据types指示函数在服务器的响应中需要的数据types,而不是在请求中发送的数据types。 具体来说,它设置“接受”标题。
老实说,你最好的select是切换到ajax()调用。 post()函数是为了方便起见; ajax()调用的简化版本,当你只是做一个简单的表单发布。 你不是。
如果你真的不想切换,你可以创build自己的函数,比如说,xpost(),并且只需将给定的参数转换为jQuery ajax()调用的参数,并带有内容types集。 这样,而不是重写所有这些post()函数到ajax()函数,你只需要将它们全部从后期更改为xpost(或其他)。
我知道这是一个迟到的答案,我实际上有一个捷径的方法,我用来张贴/读取/从基于MS的服务..它与MVC以及ASMX等工程…
使用:
$.msajax( '/services/someservice.asmx/SomeMethod' ,{} /*empty object for nothing, or object to send as Application/JSON */ ,function(data,jqXHR) { //use the data from the response. } ,function(err,jqXHR) { //additional error handling. } );
//sends a json request to an ASMX or WCF service configured to reply to JSON requests. (function ($) { var tries = 0; //IE9 seems to error out the first ajax call sometimes... will retry up to 5 times $.msajax = function (url, data, onSuccess, onError) { return $.ajax({ 'type': "POST" , 'url': url , 'contentType': "application/json" , 'dataType': "json" , 'data': typeof data == "string" ? data : JSON.stringify(data || {}) ,beforeSend: function(jqXHR) { jqXHR.setRequestHeader("X-MicrosoftAjax","Delta=true"); } , 'complete': function(jqXHR, textStatus) { handleResponse(jqXHR, textStatus, onSuccess, onError, function(){ setTimeout(function(){ $.msajax(url, data, onSuccess, onError); }, 100 * tries); //try again }); } }); } $.msajax.defaultErrorMessage = "Error retreiving data."; function logError(err, errorHandler, jqXHR) { tries = 0; //reset counter - handling error response //normalize error message if (typeof err == "string") err = { 'Message': err }; if (console && console.debug && console.dir) { console.debug("ERROR processing jQuery.msajax request."); console.dir({ 'details': { 'error': err, 'jqXHR':jqXHR } }); } try { errorHandler(err, jqXHR); } catch (e) {} return; } function handleResponse(jqXHR, textStatus, onSuccess, onError, onRetry) { var ret = null; var reterr = null; try { //error from jqXHR if (textStatus == "error") { var errmsg = $.msajax.defaultErrorMessage || "Error retreiving data."; //check for error response from the server if (jqXHR.status >= 300 && jqXHR.status < 600) { return logError( jqXHR.statusText || msg, onError, jqXHR); } if (tries++ < 5) return onRetry(); return logError( msg, onError, jqXHR); } //not an error response, reset try counter tries = 0; //check for a redirect from server (usually authentication token expiration). if (jqXHR.responseText.indexOf("|pageRedirect||") > 0) { location.href = decodeURIComponent(jqXHR.responseText.split("|pageRedirect||")[1].split("|")[0]).split('?')[0]; return; } //parse response using ajax enabled parser (if available) ret = ((JSON && JSON.parseAjax) || $.parseJSON)(jqXHR.responseText); //invalid response if (!ret) throw jqXHR.responseText; // d property wrap as of .Net 3.5 if (ret.d) ret = ret.d; //has an error reterr = (ret && (ret.error || ret.Error)) || null; //specifically returned an "error" if (ret && ret.ExceptionType) { //Microsoft Webservice Exception Response reterr = ret } } catch (err) { reterr = { 'Message': $.msajax.defaultErrorMessage || "Error retreiving data." ,'debug': err } } //perform final logic outside try/catch, was catching error in onSuccess/onError callbacks if (reterr) { logError(reterr, onError, jqXHR); return; } onSuccess(ret, jqXHR); } } (jQuery));
注意:我也有一个JSON.parseAjax方法,它是从json.org的JS文件中修改的,它为MS添加处理“/Date(…)/”date…
修改后的json2.js文件不包含在内,它在IE8的情况下使用基于脚本的parsing器,因为在扩展数组和/或对象的原型时,本地parsing器会崩溃。
我一直在考虑修改这个代码来实现promises接口,但是它对我来说真的很好。
问题的关键在于,在撰写本文时,JQuery没有postJSON方法,而getJSON存在并且做得正确。
postJSON方法将执行以下操作:
postJSON = function(url,data){ return $.ajax({url:url,data:JSON.stringify(data),type:'POST', contentType:'application/json'}); };
并可以像这样使用:
postJSON( 'path/to/server', my_JS_Object_or_Array ) .done(function (data) { //do something useful with server returned data console.log(data); }) .fail(function (response, status) { //handle error response }) .always(function(){ //do something useful in either case //like remove the spinner });
你自己的适配器/包装怎么样?
//adapter.js var adapter = (function() { return { post: function (url, params) { adapter.ajax(url, "post", params); }, get: function (url, params) { adapter.ajax(url, "get", params); }, put: function (url, params) { adapter.ajax(url, "put", params); }, delete: function (url, params) { adapter.ajax(url, "delete", params); }, ajax: function (url, type, params) { var ajaxOptions = { type: type.toUpperCase(), url: url, success: function (data, status) { var msgType = ""; // checkStatus here if you haven't include data.success = true in your // response object if ((params.checkStatus && status) || (data.success && data.success == true)) { msgType = "success"; params.onSuccess && params.onSuccess(data); } else { msgType = "danger"; params.onError && params.onError(data); } }, error: function (xhr) { params.onXHRError && params.onXHRError(); //api.showNotificationWindow(xhr.statusText, "danger"); } }; if (params.data) ajaxOptions.data = params.data; if (api.isJSON(params.data)) { ajaxOptions.contentType = "application/json; charset=utf-8"; ajaxOptions.dataType = "json"; } $.ajax($.extend(ajaxOptions, params.options)); } })(); //api.js var api = { return { isJSON: function (json) { try { var o = JSON.parse(json); if (o && typeof o === "object" && o !== null) return true; } catch (e) {} return false; } } })();
而且非常简单的用法:
adapter.post("where/to/go", { data: JSON.stringify(params), onSuccess: function (data) { //on success response... } //, onError: function(data) { //on error response... } //, onXHRError: function(xhr) { //on XHR error response... } });
该文档目前显示从3.0开始,$ .post将接受设置对象,这意味着您可以使用$ .ajax选项。 3.0还没有发布,他们正在谈论隐藏在文档中的引用,但在未来的期待!
我有一个与以下JavaScript代码类似的问题:
var url = 'http://my-host-name.com/api/Rating'; var rating = { value: 5, maxValue: 10 }; $.post(url, JSON.stringify(rating), showSavedNotification);
在提琴手的地方,我可以看到请求:
- 头文件:
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
- 正文:
{"value":"5","maxValue":"5"}
因此,我的服务器无法将对象映射到服务器端types。
在把最后一行改成这个之后:
$.post(url, rating, showSavedNotification);
在提琴手我仍然可以看到:
- 头文件:
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
- 正文:
value=5&maxValue=10
但是,服务器开始返回我所期望的。
你不能直接发送application/json
– 它必须是一个GET / POST请求的参数。
所以像
$.post(url, {json: "...json..."}, function());