wangeditor(富文本编译器插件)

Posted 2023-02-23

参考技术A < link rel="stylesheet" href="plugins/wangeditor/min/wangEditor.min.css" />

< script src="plugins/wangeditor/min/wangEditor.min.js" ></ script >

< script src="jquery/jquery-2.1.1.min.js" ></ script >

< div id="editor" ></ div >

< input type="button" id="test1" value="拿html" />

< input type="button" id="test2" value="拿text" />

        var E = window.wangEditor;

        var editor =new E("#myEditor");

        //开启debug模式

        editor.customConfig.debug =true;

        // 关闭粘贴内容中的样式

        editor.customConfig.pasteFilterStyle =false;

        // 忽略粘贴内容中的图片

        editor.customConfig.pasteIgnoreImg =false;

        // 使用 base64 保存图片

        //editor.customConfig.uploadImgShowBase64 = true

        // 上传图片到服务器

        editor.customConfig.uploadFileName ='editorFile'; //设置文件上传的参数名称

        editor.customConfig.uploadImgServer ='upload1'; //设置上传文件的服务器路径

        editor.customConfig.uploadImgMaxSize =3 *1024 *1024; // 将图片大小限制为3M

        //自定义上传图片事件

        editor.customConfig.uploadImgHooks =

before:function(xhr, editor, files)

,

            success:function(xhr, editor, result)

console.log("上传成功");

            ,

            fail:function(xhr, editor, result)

console.log("上传失败,原因是" + result);

            ,

            error:function(xhr, editor)

console.log("上传出错");

            ,

            timeout:function(xhr, editor)

console.log("上传超时");

           



editor.create();

        $("#btnGetHtml").bind("click",function()

//            alert("hello world");

            var content = editor.txt.html();

            alert(content);

        );

    </script>

static StringUPLOAD_PATH ="/static/upload/";

@ResponseBody

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

public Mapupload1(MultipartFile editorFile, HttpServletRequest request)

System.out.println("inner upload1");

    Map result =new HashMap();

    // 获取文件后缀

    String fileName = editorFile.getOriginalFilename();

    String fileSuffix = fileName.substring(fileName.lastIndexOf("."));

    // 文件存放路径

    String filePath = request.getSession().getServletContext().getRealPath(UPLOAD_PATH);

    //网络地址类

    InetAddress ia=null;

    try

//获取本机网络地址

        ia = ia.getLocalHost();

        System.out.println(ia.getHostAddress());

    catch (UnknownHostException e)

e.printStackTrace();

   

// 判断路径是否存在，不存在则创建文件夹

    File file =new File(filePath);

    if (!file.exists())

file.mkdirs();

   

// 将文件写入目标

    file =new File(filePath, UUID.randomUUID() + fileSuffix);

    try

editorFile.transferTo(file);

    catch (IOException e)

e.printStackTrace();

   

// 获取服务端路径（拼接图片上传以后的网络访问地址）

    String serverPath = String.format("%s://%s:%s%s%s", request.getScheme(), ia.getHostAddress(), request.getServerPort(), request.getContextPath(), UPLOAD_PATH);

    System.out.println(serverPath);

    // 返回给 wangEditor 的数据格式

    result.put("errno", 0);

    result.put("data", new String[]serverPath + file.getName());

    return result;