ajax上传img files,ajax,MultipartFile图片上传

你的名字 2022-09-03 11:16 283阅读 0赞

1.html 结构

uploadimg

2.js

$("\#uploadimg").on("click", function () \{

var file = $('\#file')\[0\].files\[0\];

var formData = new FormData();

formData.append("file\_data", file);

formData.append("type", "1");

$.ajax(\{

url: url,//请求路径

type: 'POST',

cache: false,

data: formData,

processData: false,

contentType: false,

success: function (data) \{

\},

error: function (err) \{

\}

\});

\});

3.controller

@RequestMapping(value = "/fileUpload",method = RequestMethod.POST)

public JSONObject fileUpload(@RequestParam("file\_data") MultipartFile file\_data, @RequestParam("type") String type,

HttpServletRequest request)\{

JSONObject result = new JSONObject();

Path tempPath =Paths.get(Commonconstants.FILE\_TEMP\_PATH);

tempPath = tempPath.resolve(type);

Path realPath = Paths.get(rootPath,tempPath.toString());

if (!Files.exists(realPath))\{

try \{

Files.createDirectories(realPath);

\} catch (IOException e) \{

result.put(Commonconstants.CODE,1);

result.put(Commonconstants.MESSAGE,e.getLocalizedMessage());

e.printStackTrace();

return result;

\}

\}

String fileName = UUID.randomUUID().toString().replace("-","")+".jpg";

tempPath = tempPath.resolve(fileName);

realPath = realPath.resolve(fileName);

try \{

file\_data.transferTo(realPath.toFile());

\} catch (IOException e) \{

result.put(Commonconstants.CODE,1);

result.put(Commonconstants.MESSAGE,e.getLocalizedMessage());

e.printStackTrace();

return result;

\}

result.put(Commonconstants.CODE,0);

result.put("url",tempPath.toString());

return result;

\}

参考的原文：https://blog.csdn.net/q394503873/article/details/80737323

发表评论取消回复

表情：

评论列表（有 0 条评论，283人围观）

还没有评论，来说两句吧...

相关阅读

相关 springboot 上传批量上传图片

Spring Boot 上传图片的方法有多种，这里介绍一种使用 Apache Commons FileUpload 库的方法。首先，在项目的 pom.xml 文件中添加依赖

墨蓝/ 2024年03月25日 17:22/ 0 赞/ 68 阅读

相关 Ajax上传图片

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

本是古典何须时尚/ 2023年09月23日 16:14/ 0 赞/ 68 阅读

相关默认form上传图片/AJAX上传

默认form上传\--------------------------------------------------------- index.html <!DO

左手的ㄟ右手/ 2023年05月21日 07:12/ 0 赞/ 28 阅读

相关 apiclod 上传图片_apiCloud上传图片

Hello APP height:100%; \} \wrap\{ height:100%; display:-webkit-box; display:-webki

野性酷女/ 2022年10月31日 00:57/ 0 赞/ 346 阅读

相关 ajax上传img files,ajax,MultipartFile图片上传

1.html 结构 uploadimg 2.js $("\uploadimg").on("click", function () \{ var file = $('\f

你的名字/ 2022年09月03日 11:16/ 0 赞/ 284 阅读

相关 c ajax 上传图片插件,ajax实现图片上传和预览

图片上传功能 html结构： !\[\](6f4fbfb7/addimg.png) 在html中input的type=file就可以实现文件的上传功能，在其属性中也包含一

喜欢ヅ旅行/ 2022年09月03日 07:21/ 0 赞/ 319 阅读

相关 $.ajax动态上传图片,基于ajax实现上传图片代码示例解析

js源码： /// /// /\! \ jQuery upload \ 用于上传单个文件，上传成功后,返回文件路径。 \ 本插件依赖jQuery，jquery.fo

素颜马尾好姑娘i/ 2022年09月03日 06:22/ 0 赞/ 226 阅读

相关 ajax上传图片

index.html <!DOCTYPE html> <html> <head> <title>Ajax 上传文件</title>

向右看齐/ 2022年06月05日 08:17/ 0 赞/ 262 阅读

相关 jquery的ajax上传图片并且显示上传进度

jquery上传文件用的formdata，上传进度条需要添加xhr的onprogress html代码如下： <!DOCTYPE html> <html l

小咪咪/ 2022年05月08日 12:10/ 0 赞/ 254 阅读

相关图片上传

文件上传流程： 1、定义 <input type="file" name="file" accept="image/\" onchange="uploadimage(th

ゝ一世哀愁。/ 2022年04月02日 11:46/ 0 赞/ 425 阅读