java - 通过 AngularJS 上传文件后从 Spring Controller 返回 Json

Question

前端:带有 AngularJS 的 jsp后端:Spring MVC/Java

我正在使用 ng-flow、angularJS 上传文件。来源:https://github.com/flowjs/ng-flow

文件上传成功。我需要从我的 Spring Controller 返回一个 json。任何线索如何去做？附言找不到放置 .success() 函数的位置(如果适用的话)。

Spring Controller :

@RequestMapping(value = "/upload", method = RequestMethod.POST)
        public String uploadFileHandler(@RequestParam("file") MultipartFile file, Model model) {
       //Upload file and process

       JsonObject jo = Json.createObjectBuilder().add(path, folderPath.toString())
                                .add(aContentsAttrib, aContents)
                                .add(bContentsAttrib, bContents).build();
}

app.js 代码:

(function() {
    var app = angular.module('app', ['flow'])
    .config(['flowFactoryProvider', function (flowFactoryProvider) {
      flowFactoryProvider.defaults = {
        target: 'upload',
        permanentErrors: [404, 500, 501],
        maxChunkRetries: 4,
        chunkRetryInterval: 500,
        simultaneousUploads: 4
      };
      flowFactoryProvider.on('catchAll', function (event) {
        console.log('catchAll', arguments);
      });
      // Can be used with different implementations of Flow.js
      // flowFactoryProvider.factory = fustyFlowFactory;
    }]);

  app.controller('PageController', function() {
    //this.products = gems;
  });

  app.controller("TabController", function() {
    this.tab = 1;
    this.showOutput = false;
    this.viewEvents = false;

    this.isSet = function(checkTab) {
      return this.tab === checkTab;
    };

    this.changeVal = function() {
        this.viewEvents = true;
    };

    this.setTab = function(setTab) {
      this.tab = setTab;
    };
  });

})();

spring Controller 究竟应该返回什么？ (String/@ResponseBody 字符串等)如何在 angular 中收集 json？

Answer 1

在你的 Controller 上 @ResponseBody 应该被添加并且 jo 作为字符串返回:

@RequestMapping(value = "/upload", method = RequestMethod.POST)
        public @ResponseBody String uploadFileHandler(@RequestParam("file") MultipartFile file, Model model) {
       //Upload file and process

       JsonObject jo = Json.createObjectBuilder().add(path, folderPath.toString())
                                .add(aContentsAttrib, aContents)
                                .add(bContentsAttrib, bContents).build();


       return jo.toString();
}

在 AngularJS 中，你应该做 this能够发布文件然后检索数据:

$http({url: '/url', 
      method: 'POST',
      data: $scope.myFile,
      headers: {'Content-Type': undefined },
      transformRequest: angular.identity
}).success(data){
   $scope.myData = data;

});