混合POST从AngularJS向春RestController [英] Mixed POST submit from AngularJS to Spring RestController

问题描述

基本上，我希望能够张贴形式某些字段（JSON）和附件（多部分）。
以下是实际工作code，问题是，我不喜欢它，所以它主要是解决方法的功能。

Basically I want to be able to post a form with some fields (JSON) and an attachment (multipart). Following is actually working code, the problem is that I don't like it so it mainly functions because of workarounds.

的角器的

$http({
    method: 'POST',
    url: 'rest/store/logo',
    headers: {'Content-Type': undefined },
    transformRequest: function (data) {
        var formData = new FormData();
        //need to convert our json object to a string version of json otherwise the browser will do a 'toString()' on the object which will result in the value '[Object object]' on the server.
        formData.append("store", angular.toJson(data.store));
        formData.append("file", data.file);
        return formData;
    },
    data: { store: $scope.selectedStore, file: $scope.myFile } //not important but $scope.myFile comes from a directive: http://jsfiddle.net/JeJenny/ZG9re/
});

的春季控制器的

@RequestMapping(value = "/logo", method = RequestMethod.POST)
public @ResponseBody void updateLogo(HttpServletRequest request, @RequestParam(value = "store", required = false) String store, @RequestPart("file") MultipartFile file) {
    System.err.println("store: " + store); //the JSON 
    StoreEditTO storeEditTO = new Gson().fromJson(store, StoreEditTO.class);
    System.err.println("storeEditTO: " + storeEditTO);
}

所以，尽管这个工程有2个东西，我敢肯定，可以简化：

So, although this works there are 2 things that I'm sure could be simplified:

1. 角：不算太坏，但code似乎更复杂的话，应该是


2. 春：这是最令人不安的;该文件是确定的，但我需要商店的参数类型设置为字符串或春季都会给我的'没有匹配编辑或转换战略发现的。不知怎的，请求参数没有被识别为JSON，我猜是因为内容类型设置为不确定的，但如果我不这么做，我得到：'org.springframework.web.multipart.MultipartException：当前请求不是multipart请求的？

1. Angular: not too bad but the code seems to more complicated then it should be
2. Spring: this is the most disturbing; the file is OK but I need to set the parameter type of store to String or Spring will give me a 'no matching editors or conversion strategy found'. Somehow the request parameter is not recognized as being JSON which I guess is because of setting the content-type to undefined but if I don't I get: 'org.springframework.web.multipart.MultipartException: The current request is not a multipart request'?

发布两个单独的方式工作得很好。将JSON被转换为正确的类型和在接收到的文件。我已经没有运气度过小时得到的混合模式工作（在一个干净的方式）为止...

Posting both separately works just fine by the way. The JSON is converted to the correct type and the file is received. I've already spent hours an getting the mixed mode to work (in a clean way) with no luck so far...

推荐答案

由于上述评论/链接，我得到了它的工作干净。我其实已经很接近，但缺少 {类型：应用/ JSON}

Thanks to above mentioned comment/link I got it working cleanly. I was actually already very close but was missing {type: "application/json"}.

完整的解决方案：

@RequestMapping(value = "/logo", method = RequestMethod.POST, consumes = {"multipart/form-data"})
public @ResponseBody void updateLogo(@RequestPart(value = "store") StoreEditTO store, @RequestPart("file") MultipartFile file) {
}

$http({
    method: 'POST',
    url: 'rest/store/logo',
    headers: {'Content-Type': undefined },
    transformRequest: function (data) {
        var formData = new FormData();

        formData.append('store', new Blob([angular.toJson(data.store)], {
            type: "application/json"
        }));
        formData.append("file", data.file);
        return formData;
    },
    data: { store: $scope.selectedStore, file: $scope.myFile }

}).
success(function (data, status, headers, config) {
});

这篇关于混合POST从AngularJS向春RestController的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！