码迷,mamicode.com
首页 > Web开发 > 详细

Ajax上传File对象到服务器

时间:2020-07-16 11:47:13      阅读:82      评论:0      收藏:0      [点我收藏+]

标签:cti   jpg   request   ror   java代码   数据   method   web   multi   

HTML代码:

<input type="file" name="uploadFile" id="uploadFile">

JavaScript:

$("#uploadFile").on("change", function() {
  var formData = new FormData();                      // 创建一个form类型的数据
  formData.append(‘file‘,‘$("#uploadFile")[0].files);     // 获取上传文件的数据
  $.ajax({
    url: "/API/Face/SubmitFile",
    type: "POST",
    processData: false, // 将数据转换成对象,不对数据做处理,故 processData: false 
    contentType: false,    // 不设置数据类型
    xhrFields: {                // 这样在请求的时候会自动将浏览器中的cookie发送给后台
      withCredentials: true
    },
    data: formData,
    success: function(data) {
      console.log(data)
    },
    error: function(data) {
    }
  })
})

 java代码

    @RequestMapping(value ="/SubmitFile",method = RequestMethod.POST)
    public JsonResult SubmitFile(HttpServletRequest request, HttpServletResponse response) {
        try {
            String faceuid=UUID.randomUUID().toString();
            MultipartHttpServletRequest filerequest=(MultipartHttpServletRequest)request;
            MultipartFile file=filerequest.getFile("file");
       //保存file并返回路径 String localfilepath
= FileHelper.SaveMultipartFile(file, WebConfig.getUploaddir(), "face", faceuid + ".jpg"); return Json.getJsonResult(true,localfilepath); }catch(Exception ex) { return Json.getJsonResult(ex.getMessage()); } }

 

Ajax上传File对象到服务器

标签:cti   jpg   request   ror   java代码   数据   method   web   multi   

原文地址:https://www.cnblogs.com/icyhoo/p/13320773.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!