栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

将数据作为Angular JS中的表单数据发布到Java REST Web服务时遇到问题

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

将数据作为Angular JS中的表单数据发布到Java REST Web服务时遇到问题

是的,所以我认为使用表单编码的数据行不通。原因是它主要用于键值对,形式为

key1=value7&key2=value2&key3=value3...

您正在执行的操作仅使用两个键,listA和listB。因此,想象一下发送整个列表所需的值是什么样的。不好看 对于复杂数据,以JSON之类的格式发送数据更为可行。对于您的特定用例,此问题是需要发送两个不相关的对象(或数组)。为此,一种解决方案是使用多部分。您很幸运,因为我昨天刚刚发布了一个较晚的答案,说明了如何使用Angular进行处理。

我不会在这里对代码进行解释。一切都在该链接中说明。在阅读此答案时,请仔细阅读。我将使用Jersey和JAX-RS实现(链接中的示例也是如此-但它还提供其他替代实现)

资源资源

import java.util.List;import javax.ws.rs.Consumes;import javax.ws.rs.POST;import javax.ws.rs.Path;import javax.ws.rs.Produces;import org.glassfish.jersey.media.multipart.FormDataParam;@Path("/form")public class FormResource {    @POST    @Consumes("multipart/form-data")    @Produces("text/plain")    public String addIssuancesForFP(@FormDataParam("listA") List<TypeA> list1,     @FormDataParam("listB") List<TypeB> list2) {        StringBuilder response = new StringBuilder();        for(TypeA a: list1) { response.append(a.toString()).append("; ");        }        for (TypeB b: list2) { response.append(b.toString()).append("; ");        }        System.out.println("Service is called correctly");        return response.toString();    }}

角度的

<!DOCTYPE html><html ng-app="formApp">    <head>        <title>TODO supply a title</title>        <meta charset="UTF-8">        <meta name="viewport" content="width=device-width, initial-scale=1.0">        <script src="js/libs/jquery/jquery.js"></script>        <script src="js/libs/angular.js/angular.js"></script>        <script> angular.module("formApp", []) .controller("defaultCtrl", function($scope, $http) {     $scope.sendData = function() {         var myList1 = [];         var obj = {};         obj["val1"] = "value1";         obj["val2"] = "value2";         myList1.push(obj);         var myList2 = [];         var obj = {};         obj["val11"] = "value11";         obj["val12"] = "value12";         myList2.push(obj);         var obj = {};         obj["val11"] = "value211";         obj["val12"] = "value212";         myList2.push(obj);         var list1 = JSON.stringify(myList1);         var list2 = JSON.stringify(myList2);         var boundary = Math.random().toString().substr(2);         var header = "multipart/form-data; charset=utf-8; boundary=" + boundary;         $http({  url: "/api/form",  headers: {"Content-Type": header},  data: createRequest(list1, list2, boundary),  method: "POST"         }).then(function(response) {  $scope.result = response.data;         });         function createRequest(list1, list2, boundary) {  var multipart = "";  multipart += "--" + boundary      + "rnContent-Disposition: form-data; name=listA"      + "rnContent-type: application/json"      + "rnrn" + list1 + "rn";  multipart += "--" + boundary      + "rnContent-Disposition: form-data; name=listB"      + "rnContent-type: application/json"      + "rnrn" + list2 + "rn";      multipart += "--" + boundary + "--rn";  return multipart;         }     };  });        </script>    </head>    <body>        <div ng-controller="defaultCtrl"> <button ng-click="sendData()">Send</button> <p>{{result}}        </div>    </body></html>

结果

TypeA{val1=value1, val2=value2}; TypeB{val1=value11, val2=value12}; TypeB{val1=value211, val2=value212};这是预料之中的,因为我刚刚从toString()方法中构建了一个字符串,并在TypeA和TypeB类中实现了这些方法。public class TypeA {    public String val1;    public String val2;    @Override    public String toString() {        return "TypeA{" + "val1=" + val1 + ", val2=" + val2 + '}';    }}public class TypeB {    public String val11;    public String val12;    @Override    public String toString() {        return "TypeB{" + "val1=" + val11 + ", val2=" + val12 + '}';    } }

希望这可以帮助。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/569819.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号