zoukankan      html  css  js  c++  java
  • ueditor与springboot结合使用

    记录是为了更好的成长!

    1、概述

    在项目用到ueditor插件来编辑信息,初次接触,遇到各种问题,到目前为止,也只是基本实现了功能,简单记录一下过程,希望对初次使用ueditor的朋友们有所帮助。

    2、项目构建

    什么是ueditor,或对ueditor还不了解的朋友请先百度,看看资料......

    项目中使用SSM加jsp构建,这里我以springBoot+thymeleaf为例说明,后面我会给出demo的github地址。

    3、先来分析一下Ueditor

    Ueditor官网

    ueditor只提供了jsp的引用,并没有html的用法,都没有关系,jsp的内容可以用控制器来替换。

    ueditor.config.js是配置文件,我们最后要修改请求路径,就是在这个文件里

    config.json 配置文件,定义了图片的大小格式等相关信息

    现在整理一下我们的需求?

    第一:要上传的图片在页面显示

    第二:将一切对图片的上传处理都交给我们自定义的controller来做

    第三:上传的图片我们可能会保存到阿里云或其他服务器,并给ueditor传回地址,怎么实现?

     

    4、实现过程分析

    1) 看代码会发现,ueditor插件有他自己的控制,图片保存的路径,图片请求的控制器,路径都需要修改

    2) 修改完图片的请求路径以后会发现页面控制台报错,找不到映射。原因就是官网的demo是jsp示例,修改了请求路径之后就找不到config.json;解决: 我在这里将config.json放在了springboot的resource中,但是找不到;通过路径都能获取到文件,但ueditor取不到,不知道为什么! config.json最终也是要给ueditor.config.js中使用的,没有config.json的配置,图片提交出错,所以就将config.json中的配置信息复制到ueditor.config.js中,就解决了问题。

    3)上传图片,修改了配置文件以后,上传图片就可以请求到自定义的控制器, 最后图片要在页面显示需要回传地址,此时在controller中通过一个map封装信息,返回到页面即可。

     github地址-springboot+nginx

    以上内容代表个人观点,仅供参考,不喜勿喷。。。

  • 相关阅读:
    Objective-C多线程-02
    Objective-C多线程-01
    Objective-C的属性与实例变量
    KVO的内部实现原理
    ASIHTTPRequest 和 AFNetWorking 的比较
    Python类和函数_规划式开发
    禁用密码登录,改用key秘钥对登录
    Python类和函数_时间与纯函数
    Python类和对象_调试与术语
    Python类和对象_修改和复制
  • 原文地址:https://www.cnblogs.com/newbest/p/11215345.html
Copyright © 2011-2022 走看看