欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

WebService :前后端数据传递

程序员文章站 2022-07-02 22:32:01
...

这一篇主要总结前端传递的数据和后端的接收方式:

1.前端JSON字符串–后端String

function filter() {
//json字符串
      var workJsonString = "{\"name\":\"张三\",\"age\":1,\"classname\":\"一年级\"}";
     $.post('http://localhost/test/json',{
              json : workJsonString,
              name : "gang"
       },
       function (data) {
               console.log(data);
       }, "json");
}

后端接收:

//测试接收json,返回json
    @POST
    @Path("json")
    @Produces({MediaType.APPLICATION_JSON})
    public String Code2(@FormParam("json")String json,@FormParam("name")String name) {
        log.debug(json);
        log.debug(name);
        return json;
    }

2.前端对象–后端对象

        function firstFilter(type) {
            let firstfilter = {};
            firstfilter.filterMain = filterMain;
            firstfilter.filterBig = filterBig;
            firstfilter.filterSmall = clist;
            firstfilter.filtertype = type;
            $.ajax({
                type: "POST",
                dataType: "json",
                url: test.url + "test/filter",
                contentType: "application/json",
                data: JSON.stringify(firstfilter),
                success: function (data) {
                    console.log(data);
                }
            });
        }
@POST
@Path("filter")
public String filterBig(Filter filter) {}
//此处后端有一个Filter的实体类,且属性量>=前台的属性量(属性同名)
//当前端传递的是后端已有的Model的时候,是可以直接接收的,前提是对应的属性名称要一样

//属性值可以缺失,但是不能多!!!

//当多的时候通常会报400错误

3.前端对象–后端对象(传递额外参数)

有时我们不仅仅需要对象,还需要得到其他的参数作为辅助,这个时候前端的AJAX的data如果写入多个就可能出现错误

我的解决思路是使用@Formparam 和@Queryparam传递多个参数

let firstfilter = {};
firstfilter.filterMain = filterMain;
firstfilter.filterBig = filterBig;
firstfilter.filterSmall = clist;
firstfilter.filtertype = type;
let param = "param1=" + param.param1+ "&param2=" + param.param2+ "&param3=" +param.param3;
//这里将数据以参数的形式设置
    $.ajax({
        type: "POST",
        dataType: "json",
        url: test.url + "test/filter?" + param,
        contentType: "application/json",
        data: JSON.stringify(Filter),
        success: function (data) {
            console.log(data);
        }
    });
//webService中后端直接使用
    @POST
    @Path("filter")
    public String returnid(Filter filter , @QueryParam("param1") String param1, @QueryParam("param2") String param2, @QueryParam("param2") String param2) {}
同理还可以使用Pathparam
 $.ajax({
        type: "POST",
        dataType: "json",
        url: staticmessage.url + "test/filter/" + param1,
        contentType: "application/json",
        data: JSON.stringify(Filter),
        success: function (data) {
            console.log(data);
        }
    });
    @POST
    @Path("filter/{param1}")
    public String returnid(Filter filter , @PathParam("param1") String param1) {}

4.前端数组对象–后端List对象

注意:前端的array就是后端的List

//数组 clist.push("001"); clist.push("002");
     $.ajax({
         type: "POST",
         url: "http://localhost/test/array",
         dataType: "json",
         contentType: "application/json",
         data: JSON.stringify(clist),
         success: function (data) {
                console.log(data);
         }
});


//这里直接用List接收前端数据
//测试接收数组,返回数组
    @POST
    @Path("array")
    @Produces({MediaType.APPLICATION_JSON})
    public String Code1(List<String> array) {
        log.debug("array"+array.size());
        for(String a :array){
            log.debug(a);
        }
        return "1111";
    }

5.前端对象–后端JSON对象

这种方法是最灵活的,前端直接将对象转换为JSON字符串,后端用字符串接收,然后转成对象或者其他数据


//前端 :
//注意 :这被转换为字符串JSON.stringify(jsonitem)
//包含两个对象
    let jsonitem = {};
     jsonitem.param1= "11";
     jsonitem.param2="118";
     $.ajax({
          type: "POST",
          dataType: "json",
          url: "http://127.0.0.1/test/url",
          contentType: "application/json",
          data: JSON.stringify(jsonitem),
          success: function (data) {
               console.log(data);
        }
     });




//后端 :

    @POST
    @Path("url")
    public String urlTest(JSONObject json) {
        JSONObject node = new JSONObject();
        log.debug(json.toString());
        log.debug(json.toJSONString());
        log.debug(json.getString("param1"));
        log.debug(json.getString("param2"));
        return node.toJSONString();
    }
//信息:   [DEBUG] [http-listener-1(1)] com.yuntuo.dc.api.AppPurchase - {"param1":"11","param2":"118"}

6.总结

webservice 前后的传递大概就这些,有新的会补充进去
代码有些许删减,可能会出现之前没碰到的错误