编辑器Ueditor和SpringBoot 的整合方法-6ren

编辑器Ueditor和SpringBoot 的整合方法

转载作者：qq735679552 更新时间：2022-09-28 22:32:09

CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章编辑器Ueditor和SpringBoot 的整合方法由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.

1.先导入ueditor所有的包:在springboot static下。

编辑器Ueditor和SpringBoot 的整合方法

2.导入需要的ueditor的js 。

编辑器Ueditor和SpringBoot 的整合方法

3.配置ueditor.config.js的// 服务器统一请求接口路径://, serverurl:(这个路径是个java类,和config.js的内容相同) 。

4.js里面执行1.var ue = ue.geteditor('editor');函数。

5.上传图片: 。

 
    ? 
   
         /* ueditor里面的上传图片 */ 
        
         ue.editor.prototype._bkgetactionurl=ue.editor.prototype.getactionurl; 
        
         //action是config.json配置文件的action 
        
         ue.editor.prototype.getactionurl=function(action){ 
        
         if (action == 'uploadimage'){ 
        
         return [[@{/common/upload/image}]]; /* 这里填上你自己的上传图片的action */ 
        
         } 
         else 
         if 
         (action ==  
         'uploadvideo' 
         ){ 
        
         return 
         [[@{/common/upload/image}]];  
        
         } 
         else 
         { 
        
         return 
         this 
         ._bkgetactionurl.call( 
         this 
         , action); 
        
         } 
        
         };

6.上传图片的方法

 
    ? 
   
         @requestmapping 
         (value =  
         "/upload/image" 
         , method = requestmethod.post, produces = mediatype.application_json_value) 
        
         @responsebody 
        
         public 
         map<string,object> save(httpservletrequest req){ 
        
         map<string,object> rs =  
         new 
         hashmap<string, object>(); 
        
         multiparthttpservletrequest mreq =  
         null 
         ; 
        
         multipartfile file =  
         null 
         ; 
        
         string filename =  
         "" 
         ; 
        
         // 原始文件名 ueditor创建页面元素时的alt和title属性 
        
         string originalfilename =  
         "" 
         ; 
        
         try 
         { 
        
         mreq = (multiparthttpservletrequest)req; 
        
         // 从config.json中取得上传文件的id 
        
         file = mreq.getfile( 
         "upfile" 
         ); 
        
         if 
         (!file.isempty()){  
        
         // 取得文件的原始文件名称 
        
         filename = file.getoriginalfilename(); 
        
         originalfilename = filename; 
        
         string ext = (filenameutils.getextension(file.getoriginalfilename())).tolowercase(); 
        
         string storepath =  
         "" 
         ; 
        
         if 
         ( 
         "jpg" 
         .equals(ext) ||  
         "png" 
         .equals(ext) ||  
         "jpeg" 
         .equals(ext) ||  
         "bmp" 
         .equals(ext)) { 
        
         storepath =  
         "upload/image/" 
         ; 
        
         } 
         else 
         { 
        
         storepath =  
         "upload/video/" 
         ; 
        
         } 
        
         //将图片和视频保存在本地服务器  
        
         string pathroot = req.getsession().getservletcontext().getrealpath( 
         "" 
         );  
        
         string path = pathroot +  
         "/" 
         + storepath;  
        
         file.transferto( 
         new 
         file(path+filename));  
        
         string domain = readproperties.getfiledomain(); 
        
         string httpimgpath = domain + storepath + filename; 
        
         rs.put( 
         "state" 
         ,  
         "success" 
         ); 
         // ueditor的规则:不为success则显示state的内容 
        
         rs.put( 
         "url" 
         ,httpimgpath);   
         //能访问到你现在图片的路径 
        
         rs.put( 
         "title" 
         , originalfilename); 
        
         rs.put( 
         "original" 
         , originalfilename);  
        
         }  
        
         }  
         catch 
         (exception e) { 
        
         e.printstacktrace(); 
        
         rs.put( 
         "state" 
         ,  
         "文件上传失败!" 
         );  
         //在此处写上错误提示信息，这样当错误的时候就会显示此信息 
        
         rs.put( 
         "url" 
         , 
         "" 
         ); 
        
         rs.put( 
         "title" 
         ,  
         "" 
         ); 
        
         rs.put( 
         "original" 
         ,  
         "" 
         ); 
        
         } 
        
         return 
         rs; 
        
         }

总结。

以上所述是小编给大家介绍的编辑器ueditor和springboot 的整合方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我网站的支持！。

原文链接：http://blog.csdn.net/cwl_0514/article/details/77451135 。

最后此篇关于编辑器Ueditor和SpringBoot 的整合方法的文章就讲到这里了,如果你想了解更多关于编辑器Ueditor和SpringBoot 的整合方法的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！。

文章推荐： Java如何实现长图文生成的示例代码

文章推荐：中秋节关于月亮的诗句空间图片默不作声的眺望着正午的月亮

文章推荐： java selenium 常见web UI 元素操作及API使用

文章推荐：详解java中this.getClass()和super.getClass()的实例

php - php 中的 css 编辑器，类似于 wordpress css 编辑器
我想像 wordpress 的 css 管理器一样为我的网站制作 css 管理器。我想在 textarea 中打开 css 文件，这样我就可以编辑它，而不是在按下提交按钮后，应该保存 css 文件中的
javascript - CKEDITOR: "CKEDITOR.plugins.add(' ...，{ init:函数(编辑器)。 ."in this what is "编辑器”。？
我不知道这是一个有效的问题。我见过大多数插件和对话框定义的 CKEditor 示例都使用变量“editor”。我想知道它是什么以及它的值来自哪里。例如 CKEDITOR.plugins.add( '
26、XML 编辑器
如果你希望极认真地学习和使用 XML，那么一定想要找一款称手的 XML 编辑器 XML 是基于文本的 XML是基于文本的标记语言 XML可被类似记事本这样的简单的文本编辑器来创建和编辑不过在
Meteor:有没有人成功使用过Summernote 编辑器？
有没有人成功地将 Summernote 编辑器与 Meteor 一起使用？见 http://hackerwins.github.io/summernote/ 我在我的模板中包含了以下 div:
JSON 编辑器/格式化程序？
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he
jquery - PrimeFaces 编辑器
如何使文本默认从右向左对齐(p:editor)。当前使用 primefaces 3.0.M2-SNAPSHOT。现在无法更新到新版本吗？这是阿拉伯语版本应用程序所必需的。谢谢最佳答案在 we
Eclipse XSD 编辑器
如何启动或安装 Eclipse XSD 编辑器？根据this看来它应该开箱即用。我创建了 XMLExamples 项目，当我打开 Catalogue.xsd 时，Eclipse 将其视为文本文件。如
wysihtml5 编辑器 - 如何简单地向元素添加类？
我爱wysihtml5但我找不到任何关于向元素添加类这样简单的文档。基本上我正在寻找的是一种允许 blockquote 元素有 2 种不同变体的方法: blockquote.pull-leftblo
Django Markdown 编辑器
我真的很想要一个在 Django 中实现文本编辑器的清晰直接的示例，就像提议的 pagedown 或 markdownx 一样。我无法在 Django 2.0 中使用这些解决方案中的任何一个，并且我找
ide - ClojureCLR 编辑器
是否有支持 REPL 和大括号匹配的 ClojureCLR 编辑器？我找到了一个将对 ClojureCLR 的支持添加到 Visual Studio 的项目:vsClojure ，但无法构建它。还有其
用于只读和编辑模式的 GWT 编辑器
GWT 的编辑器框架非常好用，它不仅可以用于编辑POJO，还可以用于只读显示。但是，我并不完全确定进行内联编辑的最佳做法是什么。假设我有一个 PersonProxy 并且我有一对 Presente
验证 primefaces 编辑器
我对 primefaces 编辑器的第一个问题是它不接受来自 Chrome 和资源管理器中的 MS word 文档的文本，但在 Firefox 中工作正常。有没有办法让它直接接受来自 MS word
jQuery noConflict 编辑器
我使用 Prototype JS 作为主要 JS 库，并且我已将最后一个 RedactorJS 与 jQuery 以无冲突模式集成，但我无法启动如下功能: jQuery('#redactor').re
具有良好智能感知的 latex 编辑器？
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。想改善这个问题吗？更新问题，使其成为 on-topic对于堆栈溢出。 5年前关闭。 Improve thi
jquery - 编辑器:模糊事件导致错误
我正在 Laravel 项目上使用 redactor 作为文本编辑器。每当编辑器位于页面上并初始化时，每当我单击任意位置时都会收到此错误。 Uncaught TypeError: $(...).cl
jQuery 幻灯片动画和tinyMCE 编辑器
我在带有 jQuery .show("slide") 动画的界面设计中使用tinyMCE 时遇到问题。由于表单的复杂性，它像向导一样被分为多个页面，但它不使用下一步和后退按钮。相反，它使用部分名称
php - 拖放，编辑器
如何制作像 wufoo.com 表单编辑器中那样的拖放式编辑器最佳答案通常客户端应用程序是使用某种客户端框架构建的。比较流行的是(排名不分先后): GWT YUI jQuery 首先检查这些内容，
具有可折叠区域的 CSS 编辑器
已关闭。此问题旨在寻求有关书籍、工具、软件库等的建议。不符合Stack Overflow guidelines .它目前不接受答案。我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题，以
具有语法错误检查和调试功能的 JavaScript 编辑器
有人建议我使用具有语法错误检查和调试功能的 Javascript 编辑器吗？ Eclipse IDE 有可用的插件吗？或者您可以建议最适合错误检查和调试的任何编辑器。提前致谢。最佳答案您可以安装
具有文本格式化和上下文感知功能的 C 编辑器
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题，以便用事实和引用来回答。关闭 7 年前。

qq735679552

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

编辑器Ueditor和SpringBoot 的整合方法