ueditor 上传文件到ftp

首先下载ue 请上官网自行下载

项目文件目录为

修改ueditor.config.js 文件的serverUrl

变成

serverUrl: getRealPath()+"/getUeditorConfig"

/**
 * 获取项目绝对路径
 *  http://127.0.0.1:8089/xxxx
 * @returns {string}
 */
function getRealPath() {
    var localObj = window.location;
    var contextPath = localObj.pathname.split("/")[1];
    var basePath = localObj.protocol + "//" + localObj.host + "/" + contextPath;
    return basePath;
}

修改config.json

添加两个参数

"useFtpUpload": "true", /* 是否使用FTP上传 */
"keepLocalFile": "false", /* 使用FTP上传后本地服务器是否保存 */

完整文件

/* 前后端通信相关的配置,注释只允许使用多行方式 */
{
    "useFtpUpload": "true", /* 是否使用FTP上传 */
    "keepLocalFile": "false", /* 使用FTP上传后本地服务器是否保存 */

    /* 上传图片配置项 */
    "imageActionName": "uploadimage", /* 执行上传图片的action名称 */
    "imageFieldName": "upfile", /* 提交的图片表单名称 */
    "imageMaxSize": 2048000, /* 上传大小限制，单位B */
    "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */
    "imageCompressEnable": true, /* 是否压缩图片,默认是true */
    "imageCompressBorder": 1600, /* 图片压缩最长边限制 */
    "imageInsertAlign": "none", /* 插入的图片浮动方式 */
    "imageUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 图片访问路径前缀 */
    "imagePathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
                                /* {filename} 会替换成原文件名,配置这项需要注意中文乱码问题 */
                                /* {rand:6} 会替换成随机数,后面的数字是随机数的位数 */
                                /* {time} 会替换成时间戳 */
                                /* {yyyy} 会替换成四位年份 */
                                /* {yy} 会替换成两位年份 */
                                /* {mm} 会替换成两位月份 */
                                /* {dd} 会替换成两位日期 */
                                /* {hh} 会替换成两位小时 */
                                /* {ii} 会替换成两位分钟 */
                                /* {ss} 会替换成两位秒 */
                                /* 非法字符 \ : * ? " < > | */
                                /* 具请体看线上文档: fex.baidu.com/ueditor/#use-format_upload_filename */

    /* 涂鸦图片上传配置项 */
    "scrawlActionName": "uploadscrawl", /* 执行上传涂鸦的action名称 */
    "scrawlFieldName": "upfile", /* 提交的图片表单名称 */
    "scrawlPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    "scrawlMaxSize": 2048000, /* 上传大小限制，单位B */
    "scrawlUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 图片访问路径前缀 */
    "scrawlInsertAlign": "none",

    /* 截图工具上传 */
    "snapscreenActionName": "uploadimage", /* 执行上传截图的action名称 */
    "snapscreenPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    "snapscreenUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 图片访问路径前缀 */
    "snapscreenInsertAlign": "none", /* 插入的图片浮动方式 */

    /* 抓取远程图片配置 */
    "catcherLocalDomain": ["127.0.0.1", "localhost", "img.baidu.com"],
    "catcherActionName": "catchimage", /* 执行抓取远程图片的action名称 */
    "catcherFieldName": "upfile", /* 提交的图片列表表单名称 */
    "catcherPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    "catcherUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 图片访问路径前缀 */
    "catcherMaxSize": 2048000, /* 上传大小限制，单位B */
    "catcherAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 抓取图片格式显示 */

    /* 上传视频配置 */
    "videoActionName": "uploadvideo", /* 执行上传视频的action名称 */
    "videoFieldName": "upfile", /* 提交的视频表单名称 */
    "videoPathFormat": "/ueditor/jsp/upload/video/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    "videoUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 视频访问路径前缀 */
    "videoMaxSize": 102400000, /* 上传大小限制，单位B，默认100MB */
    "videoAllowFiles": [
        ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
        ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid"], /* 上传视频格式显示 */

    /* 上传文件配置 */
    "fileActionName": "uploadfile", /* controller里,执行上传视频的action名称 */
    "fileFieldName": "upfile", /* 提交的文件表单名称 */
    "filePathFormat": "/ueditor/jsp/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    "fileUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 文件访问路径前缀 */
    "fileMaxSize": 51200000, /* 上传大小限制，单位B，默认50MB */
    "fileAllowFiles": [
        ".png", ".jpg", ".jpeg", ".gif", ".bmp",
        ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
        ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
        ".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
        ".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
    ], /* 上传文件格式显示 */

    /* 列出指定目录下的图片 */
    "imageManagerActionName": "listimage", /* 执行图片管理的action名称 */
    "imageManagerListPath": "/ueditor/jsp/upload/image/", /* 指定要列出图片的目录 */
    "imageManagerListSize": 20, /* 每次列出文件数量 */
    "imageManagerUrlPrefix": "http://localhost:8090/boot/showPhotoUE?path=", /* 图片访问路径前缀 */
    "imageManagerInsertAlign": "none", /* 插入的图片浮动方式 */
    "imageManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 列出的文件类型 */

    /* 列出指定目录下的文件 */
    "fileManagerActionName": "listfile", /* 执行文件管理的action名称 */
    "fileManagerListPath": "/ueditor/jsp/upload/file/", /* 指定要列出文件的目录 */
    "fileManagerUrlPrefix": "http://localhost:8090/boot/showPhotoUE?", /* 文件访问路径前缀 */
    "fileManagerListSize": 20, /* 每次列出文件数量 */
    "fileManagerAllowFiles": [
        ".png", ".jpg", ".jpeg", ".gif", ".bmp",
        ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
        ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
        ".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
        ".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
    ] /* 列出的文件类型 */

}

找到ueditor..jar包

下载地址》》》 ueditor.jar

添加到项目

找到actionenter文件

找到uploader 文件

创建FtpUploader 类

package com.baidu.ueditor.upload;

import com.baidu.ueditor.PathFormat;
import com.baidu.ueditor.define.BaseState;
import com.baidu.ueditor.define.FileType;
import com.baidu.ueditor.define.State;

import java.io.IOException;
import java.io.InputStream;
import java.util.Arrays;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.fileupload.FileItemIterator;
import org.apache.commons.fileupload.FileItemStream;
import org.apache.commons.fileupload.FileUploadException;
import org.apache.commons.fileupload.disk.DiskFileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
import org.springframework.web.multipart.commons.CommonsMultipartFile;

/**
 * Created by Administrator on 2018/5/29.
 */
public class FtpUploader
{

    public static final State save(HttpServletRequest request, Map<String, Object> conf)
    {
        //FileItemStream fileStream = null;
        boolean isAjaxUpload = request.getHeader("X_Requested_With") != null;

        if (!ServletFileUpload.isMultipartContent(request)) {
            return new BaseState(false, 5);
        }

        ServletFileUpload upload = new ServletFileUpload(
                new DiskFileItemFactory());

        if (isAjaxUpload) {
            upload.setHeaderEncoding("UTF-8");
        }
        try
        {
            String org="";
            InputStream ips = null;
            MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
            List<MultipartFile> fileList = multipartRequest.getFiles("upfile");
            for (MultipartFile m:fileList
                 ) {
                org = m.getOriginalFilename();
                ips = m.getInputStream();
            }

            if (fileList.size() <= 0) {
                return new BaseState(false, 7);
            }

            String savePath = (String)conf.get("savePath");
            String originFileName = org;
            String suffix = FileType.getSuffixByFilename(originFileName);

            originFileName = originFileName.substring(0,
                    originFileName.length() - suffix.length());
            savePath = savePath + suffix;

            long maxSize = ((Long)conf.get("maxSize")).longValue();

            if (!validType(suffix, (String[])conf.get("allowFiles"))) {
                return new BaseState(false, 8);
            }

            savePath = PathFormat.parse(savePath, originFileName);

            String remoteDir = "";

            int pos = savePath.lastIndexOf("/");
            if(pos > -1){
                remoteDir = savePath.substring(0,pos + 1);
            }

            String physicalPath = (String)conf.get("rootPath") + savePath;

            boolean keepLocalFile = "false".equals(conf.get("keepLocalFile")) ? false : true;
            InputStream is = ips;
            State storageState = StorageManager.saveFtpFileByInputStream(is, remoteDir,
                    physicalPath, maxSize, keepLocalFile);
            is.close();

            if (storageState.isSuccess()) {
                //storageState.putInfo("url", savePath);
                storageState.putInfo("type", suffix);
                storageState.putInfo("original", originFileName + suffix);
            }

            return storageState;
        } catch (IOException localIOException) {
        }
        return new BaseState(false, 4);
    }

    @SuppressWarnings("rawtypes")
    private static boolean validType(String type, String[] allowTypes) {
        List list = Arrays.asList(allowTypes);

        return list.contains(type);
    }
}

修改

StorageManager 文件

ftpUtils 文件请看我

》》》》 ftp工具

最后在controller添加

@ResponseBody
@RequestMapping(value = "/getUeditorConfig")
public String getUed(HttpServletRequest request,HttpServletResponse response) {
    String json="";
    try {
        //String rootPath=request.getServletContext().getRealPath("/");
        String rootPath = ClassUtils.getDefaultClassLoader().getResource("").getPath();
        //System.out.println(request.getParameter("action"));
        json = new ActionEnter( request, rootPath+"static\\content\\plugins\\ueditor\\" ).exec();;
        logger.info(json);
    } catch (Exception ex) {
        logger.error("showPhoto -=- {}", ex.toString());
    }
    return json;
}

地址对应自己的ueditor目录即可

到此 ftp上传就可以了

/**
 * UEditor 查看图片使用
 * @param response
 * @param path
 */
@RequestMapping("/showPhotoUE")
public void showPhotoUE(HttpServletResponse response, String path) {
    try {
        String newPath = "";
        if (path.contains("?") && StringUtils.isNotEmpty(path)){
            newPath = path.substring(0,path.lastIndexOf("?"));
        }else {
            newPath = path;
        }
        if (StringUtils.isNotEmpty(newPath)) {
            //Thread.sleep(500);
            new FtpUtils().showPhoto(response, newPath);
        }
    } catch (Exception ex) {
        logger.error("showPhoto -=- {}", ex.toString());
    }
}

添加方法为了会显示照片使用

查看在线照片功能

FileManager 类

public State listFile ( int index ) {
    List list = new ArrayList();
       try {
           list = new FtpUtils().getFileListNext(this.dir);
       } catch (IOException e) {
           e.printStackTrace();
       }
       //File dir = new File( this.dir );
   State state = null;

   /*if ( !dir.exists() ) {
      return new BaseState( false, AppInfo.NOT_EXIST );
   }
   
   if ( !dir.isDirectory() ) {
      return new BaseState( false, AppInfo.NOT_DIRECTORY );
   }*/
   
   //Collection<File> list = FileUtils.listFiles( dir, this.allowFiles, true );
   
   if ( index < 0 || index > list.size() ) {
      state = new MultiState( true );
   } else {
      Object[] fileList = Arrays.copyOfRange( list.toArray(), index, index + this.count );
      state = this.getState( fileList );
   }
   
   state.putInfo( "start", index );
   state.putInfo( "total", list.size() );
   
   return state;
   
}

修改主要部分

在修改

private State getState ( Object[] files ) {
   
   MultiState state = new MultiState( true );
   BaseState fileState = null;
   
   File file = null;
   
   for ( Object obj : files ) {
      if ( obj == null ) {
         break;
      }
      //file = (File)obj;
      fileState = new BaseState( true );
      //fileState.putInfo( "url", PathFormat.format( this.getPath( file ) ) );
           fileState.putInfo( "url", (String) obj);
      state.addState( fileState );
   }
   
   return state;
   
}

这就实现了图片查看功能

base64 涂鸦上传修改

public final class Base64Uploader {

    public static State save(String content, Map<String, Object> conf) {

        byte[] data = decode(content);

        long maxSize = ((Long) conf.get("maxSize")).longValue();

      if (!validSize(data, maxSize)) {
            return new BaseState(false, AppInfo.MAX_SIZE);
      }

        String suffix = FileType.getSuffix("JPG");

        String savePath = PathFormat.parse((String) conf.get("savePath"),
                (String) conf.get("filename"));

        savePath = savePath + suffix;
        boolean keepLocalFile = "false".equals(conf.get("keepLocalFile")) ? false : true;
        State storageState = StorageManager.saveBinaryFile(data, savePath, keepLocalFile);

        if (storageState.isSuccess()) {
            storageState.putInfo("type", suffix);
            storageState.putInfo("original", "");
        }

        return storageState;
    }

    private static byte[] decode(String content) {
        return Base64.decodeBase64(content);
    }


    private static boolean validSize(byte[] data, long length) {
        return data.length <= length;
    }

}

public static State saveBinaryFile(byte[] data, String path, boolean keepLocalFile) {
    File file = new File(path);

    State state = valid(file);
    String url = null;
    if (!state.isSuccess()) {
        return state;
    }
    try {
        BufferedOutputStream bos = new BufferedOutputStream(
                new FileOutputStream(file));
        bos.write(data);
        bos.flush();
        bos.close();
        String newFileName = path.substring(0, path.lastIndexOf("/") + 1);
        url = new FtpUtils().uploadsUeFile(file, newFileName);
        if (!keepLocalFile) {
            file.delete();
        }
    } catch (IOException ioe) {
        return new BaseState(false, 4);
    }

    state = new BaseState(true, file.getAbsolutePath());
    state.putInfo("url", url);
    state.putInfo("size", data.length);
    state.putInfo("title", file.getName());
    return state;
}

实现效果

ueditor 上传文件到ftp

猜你喜欢