summernote 上传图片到图片服务器的解决方案（springboot 成功）
Posted lovestart
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了summernote 上传图片到图片服务器的解决方案（springboot 成功）相关的知识，希望对你有一定的参考价值。
遇到的可以连接成功但是拒绝登录的问题
前提说一下，我自己在自己的服务器上配置了nginx的反向代理，所以请求的时候才会直接写的是我的ip地址，要配置nginx的话，可以看我的nginx的笔记
当代码感觉没有问题的时候，但还是无法上传，首先问自己是不是被拒绝登陆了（还真是）
这个问题是当你使用特定的用户的时候才会被拒绝请求
可以在ftpusers & user_list 中把你用到的用户给注释掉（不建议这么干，不能保证安全性）
1.首先检查系统是否开启了vsftp服务，如果没有开启，先开启该服务。
2.查看配置
vsftpd的配置，配置文件中限定了vsftpd用户连接控制配置。
vsftpd.ftpusers：位于/etc/vsftpd目录下。它指定了哪些用户账户不能访问FTP服务器，例如root等。
vsftpd.user_list：位于/etc/vsftpd目录下。该文件里的用户账户在默认情况下也不能访问FTP服务器，仅当vsftpd .conf配置文件里启用userlist_enable=NO选项时才允许访问。
vsftpd.conf：位于/etc/vsftpd目录下。来自定义用户登录控制、用户权限控制、超时设置、服务器功能选项、服务器性能选项、服务器响应消息等FTP服务器的配置。
3.配置修改完成后，执行service vsftpd restart重启vsftpd服务。下面是正式的代码
前台代码
用到的富文本编辑器是summernote前端代码如下
用到的云服务器是阿里云的Centos 7
window.onload = function ()
var summernote = $('.summernote').summernote(
lang: 'zh-CN',
height: 300,
minHeight: 300,
placeholder: '请输入通知的内容',
callbacks: // 回调函数
// 上传图片时使用的回调函数
onImageUpload: function (files, editor, $editable)
console.log(files)
sendFile(files[0], editor, $editable);
,
);
function sendFile(files, editor, welEditable)
data = new FormData();
data.append("file", files);
$.ajax(
data: data,
type: "POST",
url: '/image/notice_add',
//请求路径
cache: false,
contentType: false,
processData: false,
dataType: "json",
success: function (data)
alert(data.message)
// data.message
let url = 'http://xxx.xxx.xxx.xxx/';
//上面是服务器的地址
$('.summernote').summernote('insertImage',url+data.message);
//xxx的地方是图片url的前缀 key为上传后图片的名字
,error:
function (url)
alert(JSON.stringify(url.message))
);
后台代码（springboot）
首先是用到的工具类FtpFileUtil
public class FtpFileUtil
//ftp服务器ip地址
private static final String FTP_ADDRESS = "39.96.11.225";
//端口号
private static final int FTP_PORT = 21;
//用户名 这里用到的是root 可以切合上面遇到的问题，实际开发中需要单独创建一个用户
private static final String FTP_USERNAME = "root";
//密码
private static final String FTP_PASSWORD = "XXXXXXXXXX";
//图片路径
private static final String FTP_BASEPATH = "/soft/code/images";
public static boolean uploadFile(String originFileName, InputStream input)
boolean success = false;
FTPClient ftp = new FTPClient();
ftp.setControlEncoding("GBK");
try
int reply;
ftp.connect(FTP_ADDRESS, FTP_PORT);// 连接FTP服务器
ftp.login(FTP_USERNAME, FTP_PASSWORD);// 登录
reply = ftp.getReplyCode();
if (!FTPReply.isPositiveCompletion(reply))
ftp.disconnect();
return success;
ftp.setFileType(FTPClient.BINARY_FILE_TYPE);
ftp.makeDirectory(FTP_BASEPATH );
ftp.changeWorkingDirectory(FTP_BASEPATH );
ftp.storeFile(originFileName,input);
input.close();
ftp.logout();
success = true;
catch (IOException e)
e.printStackTrace();
finally
if (ftp.isConnected())
try
ftp.disconnect();
catch (IOException ioe)
return success;
上传比较大的图片的时候需要在springboot下配置ImageResolverConfig
@Configuration
public class ImageResolverConfig
@Bean
public MultipartResolver multipartResolver()
CommonsMultipartResolver resolver=new CommonsMultipartResolver();
// resolver.setDefaultEncoding("utf-8");
resolver.setMaxInMemorySize(1048576);
resolver.setMaxUploadSize(20971520);
return resolver;
@RestController
@RequestMapping("/image/")
public class ImageUploadController
@ResponseBody
@RequestMapping(value = "notice_add", headers = ("content-type=multipart/*"), method = RequestMethod.POST)
public ResponseResult MyselfImageUpload(@RequestParam("file") CommonsMultipartFile file, HttpServletRequest request)
try
String path = ImageUploadPathConstant.UPLOAD_PATH;
String fileName = UUID.randomUUID().toString().replace("-", "") + file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
// File destFile = new File(path + "/" + fileName);
// FileUtils.copyInputStreamToFile(file.getInputStream(), destFile);
//上面代码是拷贝到本地的，但是因为感觉并不人性化，所以采取了上传到图片服务器的思路
InputStream inputStream=file.getInputStream();
// String url = destFile.getAbsolutePath();
String url = null;
Boolean flag= FtpFileUtil.uploadFile(fileName,inputStream);
if(flag)
url = fileName;
//ResponseResult 是一个进行结果封装的类
return ResponseResult.success(url);
catch (Exception e)
return null;
ResponseResult //这个类可以不进行使用，但是为了系统的其他功能的使用，尽量加上。用于结果的封装
public class ResponseResult
//状态码
private int status;
//消息
private String message;
//返回数据
private Object data;
public ResponseResult(int status, String message, Object data)
this.status = status;
this.message = message;
this.data = data;
//成功
public static ResponseResult success(Object data)
return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_SUCCESS, "success", data);
public static ResponseResult success(String message)
return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_SUCCESS, message, null);
public static ResponseResult success()
return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_SUCCESS, "success", null);
//失败
public static ResponseResult fail()
return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_FAIL, "fail", null);
public static ResponseResult fail(Object data)
return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_FAIL, "fail", data);
public static ResponseResult fail(String message)
return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_FAIL, message, null);
public int getStatus()
return status;
public void setStatus(int status)
this.status = status;
public String getMessage()
return message;
public void setMessage(String message)
this.message = message;
public Object getData()
return data;
public void setData(Object data)
this.data = data;
以上是关于summernote 上传图片到图片服务器的解决方案（springboot 成功）的主要内容，如果未能解决你的问题，请参考以下文章