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;
}
}
ZGC说:有什么能比不给牛吃草,还挤牛奶更快乐的事情呢?