java富文本編輯器KindEditor

在頁面寫一個編輯框：

<textarea name="content" class="form-control" id="content"  
required="true" style="width: 90%; height: 360px;"></textarea>      

頁面導入css和js檔案：

<link rel="stylesheet"
    href="/static/kindeditor/themes/default/default.css" target="_blank" rel="external nofollow"  />
<script charset="utf-8"
    src="/static/kindeditor/kindeditor-min.js"></script>
<script charset="utf-8" src="/static/kindeditor/lang/zh_CN.js"></script>      

富文本上傳圖檔的javascript代碼：

<script th:inline="javascript">
    var editor;
    KindEditor.ready(function(K) {
        editor = K.create('#content', {
            resizeType : 1,
            allowPreviewEmoticons : false,
            allowImageUpload : true,//允許上傳圖檔
            allowFileManager : true,//允許對上傳的圖檔進行管理
            uploadJson : 'kindEditorUpload?paFileName='+ (new Date()).valueOf(),//上傳圖檔至背景
            afterUpload : function(date) {//圖檔上傳完成後的邏輯操作
                //alert(date);
                this.sync();
            },
            afterCreate: function () { //是同步KindEditor的值到textarea文本框
                    this.sync();
            }, 
            afterBlur : function() {//失去焦點後，将圖檔同步到textarea
                this.sync();
            },
            items : [ 'source', 'fontname', 'fontsize', '|', 'forecolor',
                    'hilitecolor', 'bold', 'italic', 'underline',
                    'removeformat', '|', 'justifyleft', 'justifycenter',
                    'justifyright', 'insertorderedlist', 'insertunorderedlist',
                    '|', 'image', 'multiimage', 'emoticons', 'link',
                    'fullscreen', 'insertfile' ]
        });
    
    });
</script>      

圖檔上傳到ftp伺服器的背景java代碼：

public void kindEditorUploadFile(HttpServletRequest request, HttpServletResponse response,
            @RequestParam("imgFile") MultipartFile file) throws IOException {

        ModelMap map = new ModelMap();
        Gson gson = new Gson();
        // 圖檔的項目路徑
        paFileName = request.getParameter("paFileName");
        System.out.println("paFileName:" + paFileName);

        try {
            FtpUtil ftpUtil = new FtpUtil();
            FTPClient ftp = ftpUtil.getConnectionFTP(UploadFileUrlUtil.HOST_NAEM, UploadFileUrlUtil.PORT,
                    UploadFileUrlUtil.USER_NAME, UploadFileUrlUtil.PASSWORD);
            SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");
            // 圖檔上傳的檔案名
            String originalFilename = file.getOriginalFilename();
            String fileExt = originalFilename.substring(originalFilename.lastIndexOf(".") + 1).toLowerCase();
            newFileName = df.format(new Date()) + "_" + new Random().nextInt(1000) + "." + fileExt;
            dirName = request.getParameter("dir");
            if (dirName == null) {
                dirName = "image";
                dirName = "file";
            }
            String path = UploadFileUrlUtil.IMAGE_FILE + dirName + "/" + paFileName + "/";
            boolean bool = ftpUtil.uploadFile(ftp, path, newFileName, file.getInputStream());
            if (bool) {
                url = UploadFileUrlUtil.HOST + path + newFileName;
                String attAddress = path + newFileName;
                System.out.println(url);
                map.put("url", url);
                System.out.println("上傳成功！");
                boolean boolClose = ftpUtil.closeFTP(ftp);if (boolClose) {
                    System.out.println("關閉ftp連接配接成功！");
                } else {
                    System.out.println("關閉ftp連接配接失敗！");
                }
            } else {
                System.out.println("上傳失敗！");
            }

        } catch (Exception e1) {
            // TODO Auto-generated catch block
            e1.printStackTrace();
        }
        PrintWriter writer = response.getWriter();
        map.put("error", 0);
        writer.println(gson.toJson(map));
    }      

遠端ftp伺服器的配置資訊：

//    遠端伺服器的配置資訊
    public final static String HOST_NAEM="127.0.0.1";
    public final static Integer PORT=21;
    public final static String USER_NAME="123456";    //ftpuser
    public final static String PASSWORD="123456";
    public final static int LOCALHOST= 8080;
    public final static String IMAGE_FILE= "/upload/";//圖檔上傳的路徑
    public final static String HOST= "http://127.0.0.1:8080";//上傳的端口      

富文本KindEditor檔案下載下傳連結： https://pan.baidu.com/s/1RQ8EjEfN4YVw9Q5ds79Qkw 密碼: nyxd

轉載于:https://www.cnblogs.com/ajya/p/9487264.html