马勒戈壁的.net mvc webapi中的ajax 、post与 frombody

业务背景:帖子回帖,回帖框是富文本编辑器(ueditor),可以取到此富文本编辑器里的所有内容,然后传给后端保存。

关键点:

  1. ajax,post请求,发给 .net MVC (MVC5, .net 4.6.1)的后端函数,后端接收,保存。
  2. 前端的 contentType 和 dataType 该不该写,要怎么写
  3. 富文本编辑器的内容里面有很多html等内容,是否需要转义保存,或者序列化传输
  4. 后端是否需要写[FromBoyd],以及写了之后后端的这个函数里是单独每个属性作为参数呢,还是一个class作为参数

以上,都特么的是一个很sb很浪费时间的问题,而且每次遇到都很烦恼。

经测试,以下:


第一种测试成功的情况

js

				var htmlContent = self.ue.getContent();  //这里的htmlContent是很复杂的富文本内容
				var send = {
	                       "postId": 1,
	                       "content": htmlContent    //写成普通字符串如"xxxxxxxx"可成功(必要),写成htmlContent不可成功(充分)。
	                   };

                    $.ajax({
                        url: window.location.origin + "/bbs/reply",
                        type: "post",
                       //contentType: "application/json",  加上不能成功(充分),去掉可以成功(必要)
                        dataType: "json",
                        data: send,
                        success: function (data) {
                            debugger;
                        },
                        error: function (error) {
                            debugger;
                        }
                    });

cs

		[System.Web.Mvc.Route("reply")]
        [System.Web.Mvc.HttpPost]
        public JsonResult Reply( int postId,string content)
        {     
            return ...;
        }

第二种测试成功的情况

js

				var htmlContent = self.ue.getContent();

                    var send ={
                        "postId": 1,
                        "content": "xxxxx"  //写成普通字符串如"xxxxxxxx"可成功(必要),写成htmlContent不可成功(充分)。
                    };

                    $.ajax({
                        url: window.location.origin + "/bbs/reply",
                        type: "post",
                       //contentType: "application/json",  加上不能成功(充分),去掉可以成功(必要)
                        dataType: "json",
                        data: send,
                        success: function (data) {
                            debugger;
                        },
                        error: function (error) {
                            debugger;
                        }
                    });

cs


		[System.Web.Mvc.Route("reply")]
        [System.Web.Mvc.HttpPost]
        public JsonResult Reply( ReplyFormModel body)
        {     
            return ...;
        }

但不论如何,不能一直拿一串xxxxx字符串来糊弄啊,终究还是要把富文本编辑器里的复杂内容存进去的。

经尝试,如下:

第三种测试成功的情况:

这个才是最好的!!!!

js

				 var htmlContent = self.ue.getContent();  //很复杂的富文本内容

                    var send ={
                        "postId": 1,
                        "content": htmlContent  //可以这样写
                    };

                    $.ajax({
                        url: window.location.origin + "/bbs/reply",
                        type: "post",
                        contentType: "application/json",   //必须指明,否则后端可以进入请求,但各个属性未能成功赋值,因此必须写 ---- 关键点1
                        //dataType: "json",   //经测试,可写可不写,都不影响后端接到请求
                        data: JSON.stringify(send), //要写,否则匹配不到请求			--------关键点2
                        success: function (data) {
                            debugger;
                        },
                        error: function (error) {
                            debugger;
                        }
                    });

cs:

 [System.Web.Mvc.Route("reply")]
        [System.Web.Mvc.HttpPost]
        public JsonResult Reply(ReplyFormModel body)    //--------关键点3,如此可给body的各个属性依次正确赋值
        {
            ApiResultModel apiResult = new ApiResultModel();
            JsonResult jsonResult = new JsonResult();
            jsonResult.Data = apiResult;
            return jsonResult;
        }

后端另有:

public class ReplyFormModel
    {
        public int postId { get; set; }
        public string content { get; set; }
    }

另外,
此时后端如果写成一个个的参数的形式也可正确赋值,如下:

[System.Web.Mvc.Route("reply")]
        [System.Web.Mvc.HttpPost]
        public JsonResult Reply( int postId,string content)
        {     
            return ...;
        }

后记:

想写成

  public JsonResult Reply([FromBody]ReplyFormModel body) 

的形式吗,显得很厉害是吗?
去他妈的吧,试来试去也没成,一边去吧。

发布了177 篇原创文章 · 获赞 47 · 访问量 43万+

猜你喜欢

转载自blog.csdn.net/festone000/article/details/93631592
今日推荐