当前位置: 首页 > 面试题库 >

AngularJS文件上传不起作用

华乐逸
2023-03-14
问题内容

Java控制器类:

@RequestMapping(value = "/upload" , method = RequestMethod.POST , consumes="multipart/form-data")
public void upload(@RequestParam MultipartFile file1) {
        System.out.println("*****"+ file1);
  }

html文件:

<input id="file-0a" class="file" type="file" file-model="myFile"/>
     <button ng-click="uploadFile()">upload me</button>

角js:

$scope.uploadFile = function(){
          var file = $scope.myFile;
          console.log('file is ' + JSON.stringify(file));
          var fd = new FormData();
          fd.append('file', file);
          var resource = /upload;    
            $http.post(resource, fd, {
                transformRequest: angular.identity,
                headers: {'Content-Type': undefined}
            }).success(function(){ }).error(function(){ }); 
         }

这是我在服务器日志中无法理解的错误:

INFO: Server startup in 38138 ms
Feb 14, 2015 11:45:17 PM org.apache.catalina.core.ApplicationDispatcher invoke
SEVERE: Servlet.service() for servlet dispatcher threw exception
java.lang.IllegalStateException: Cannot forward after response has been committed
    at org.apache.catalina.core.ApplicationDispatcher.doForward(ApplicationDispatcher.java:348)
    at org.apache.catalina.core.ApplicationDispatcher.forward(ApplicationDispatcher.java:338)
    at org.springframework.web.servlet.resource.DefaultServletHttpRequestHandler.handleRequest(DefaultServletHttpRequestHandler.java:122)
    at org.springframework.web.servlet.mvc.HttpRequestHandlerAdapter.handle(HttpRequestHandlerAdapter.java:51)
    at org.springframework.web.servlet.DispatcherServlet.doDispatch(DispatcherServlet.java:938)
    at org.springframework.web.servlet.DispatcherServlet.doService(DispatcherServlet.java:870)
    at org.springframework.web.servlet.FrameworkServlet.processRequest(FrameworkServlet.java:961)
    at org.springframework.web.servlet.FrameworkServlet.doPost(FrameworkServlet.java:863)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:646)
    at org.springframework.web.servlet.FrameworkServlet.service(FrameworkServlet.java:837)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:727)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:303)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:208)
    at org.apache.catalina.core.ApplicationDispatcher.invoke(ApplicationDispatcher.java:748)
    at org.apache.catalina.core.ApplicationDispatcher.doInclude(ApplicationDispatcher.java:604)
    at org.apache.catalina.core.ApplicationDispatcher.include(ApplicationDispatcher.java:543)
    at org.apache.catalina.core.StandardHostValve.custom(StandardHostValve.java:467)
    at org.apache.catalina.core.StandardHostValve.status(StandardHostValve.java:342)
    at org.apache.catalina.core.StandardHostValve.throwable(StandardHostValve.java:434)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:205)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:103)
    at org.apache.catalina.valves.AccessLogValve.invoke(AccessLogValve.java:950)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:116)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:421)
    at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp11Processor.java:1070)
    at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:611)
    at org.apache.tomcat.util.net.JIoEndpoint$SocketProcessor.run(JIoEndpoint.java:316)
    at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1145)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:615)
    at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61)
    at java.lang.Thread.run(Thread.java:745)

Feb 14, 2015 11:45:17 PM org.apache.catalina.core.StandardHostValve custom
SEVERE: Exception Processing ErrorPage[errorCode=0, location=/error.html]
org.springframework.web.util.NestedServletException: Request processing failed; nested exception is java.lang.IllegalStateException: Cannot forward after response has been committed
    at org.springframework.web.servlet.FrameworkServlet.processRequest(FrameworkServlet.java:973)
    at org.springframework.web.servlet.FrameworkServlet.doPost(FrameworkServlet.java:863)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:646)
    at org.springframework.web.servlet.FrameworkServlet.service(FrameworkServlet.java:837)

问题答案:

尝试以下方法。对我来说很好。

HTML你应该有

<input id="file-0a" class="file" type="file" file-model="myFile" name="myFile" />
     <button ng-click="uploadFile()">upload me</button>

注意输入的名称。

然后在JS控制器方法中

$scope.uploadFile = function(){
    var formData=new FormData();
    formData.append("file",myFile.files[0]); //myFile.files[0] will take the file and append in formData since the name is myFile.
    $http({
        method: 'POST',
        url: '/upload', // The URL to Post.
        headers: {'Content-Type': undefined}, // Set the Content-Type to undefined always.
        data: formData,
        transformRequest: function(data, headersGetterFunction) {
            return data;
        }
    }).success(function(data, status) {  
    })
    .error(function(data, status) {
    });
}

现在在您的Java Controller类中

@RequestMapping(value = "/upload" , method = RequestMethod.POST)
public void upload(HttpServletRequest request) {

    //org.springframework.web.multipart.MultipartHttpServletRequest
    MultipartHttpServletRequest mRequest;
    mRequest = (MultipartHttpServletRequest) request;

    Iterator<String> itr = mRequest.getFileNames();
    while (itr.hasNext()) {
        //org.springframework.web.multipart.MultipartFile
        MultipartFile mFile = mRequest.getFile(itr.next());
        String fileName = mFile.getOriginalFilename();
        System.out.println("*****"+ fileName);

        //To copy the file to a specific location in machine.
        File file = new File('path/to/new/location');
        FileCopyUtils.copy(mFile.getBytes(), file); //This will copy the file to the specific location.
    }
}

希望这对您有用。并且也要进行异常处理。



 类似资料:
  • 问题内容: Java控制器类: html文件: 角js: 这是我在服务器日志中无法理解的错误: 问题答案: 尝试以下方法。对我来说很好。 HTML你应该有 注意输入的名称。 然后在JS控制器方法中 现在在您的Java Controller类中 希望这对您有用。并且也要进行异常处理。

  • 这是我的超文本标记语言形式: 我想从本地机器上传图像,并希望读取上传文件的内容。所有这些我都想使用AngularJS来完成。 当我试图打印它是未定义的。

  • 问题内容: 这是我的HTML表单: 我想从本地计算机上传图像,并想读取上传文件的内容。我想使用AngularJS进行的所有操作。 当我尝试打印时,它的值是未定义的。 问题答案: 这里的一些答案建议使用,但不幸的是,这是Internet Explorer 9及更低版本中不可用的浏览器对象。如果需要支持那些较旧的浏览器,则需要使用或使用Flash 的备份策略。 已经有许多Angular.js模块可以执

  • 我正在开发一个带有文件上传的web应用程序。 我只是写了一个PHP代码来上传一个图像。 当我运行此代码时,我可以在文件上传时获得输出,如果上传错误 我给了777权限来访问pic文件夹 有什么问题,有什么想法吗,, 类型 Print_R 数组 谢啦

  • 问题内容: 我正在尝试将AngularJS用于我的第一个项目(锦标赛经理),并且筛选器不起作用:(我已阅读了有关该文档的所有文档,但无济于事:/ 所以,我在上面定义了vars : 现在,在我看来,我正在尝试重新排序(首先只有一个订单项),但是再也无法工作… 第二次,我要重新排序,从2条信息:和如果第一是平等的。我尝试更换这样的,但如果一个代码没有工作,他绝不会与2工作… 谢谢大家的阅读,对于帖子的

  • 问题内容: 我有一个Java Spring MVC Web应用程序作为服务器。并且基于AngularJS的应用程序作为客户端。 在AngularJS中,我必须上传文件并发送到服务器。 这是我的 html 这是我的 UploadController.js 它要发送到服务器。这是我的 DocumentUploadController.java 运行此命令时,出现以下异常 在我的 application