ckeditor 图片上传 小记

最新推荐文章于 2024-11-15 14:43:33 发布
原创 最新推荐文章于 2024-11-15 14:43:33 发布 · 491 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了解决CKEditor中图片上传功能缺失及图片无法在编辑器中正常显示的问题。通过修改image.js文件并配置文件上传路径，最终实现了图片上传与显示的功能。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

郁闷 .. 刚配置好后发现没有图片上传功能


找了半天 找到 ckeditor/plugins/image/dialogs/image.js 文件中一部分

id:"upload“，hidden:!0

该文件时一个压缩版 看起来很费劲

hidden:!0 则是 hidden:true  看起来有点可疑就直接删后发现 出现了upload 选项卡。


配置好上传路径 config.js 中添加

config.filebrowserUploadUrl = 图片处理地址


图片是可以上传 但无法吧图片显示在预览中... 又郁闷半天..


在php 中图片处理之后 输出

window.parent.CKEDITOR.tools.callFunction("$_GET['CKEditorFuncNum']" , “图片路径 +　名称”)


问题解决．．．．．．．．　郁闷。。

CKEditor实现图片上传
itmyhome的专栏
12-13 6万+
本人用的CKEditor版本为4.3 CKEditor配置和部署参考XXX。 CKEditor编辑器的工具栏中初始的时候应该是这样子的，没有图片上传按钮 并且预览中有一堆火星文，可以修改相应配置删除它。 第一种方法：打开ckeditor/plugins/image/dialogs/image.js文件，搜索“b.config.image_previewText”，(b.confi
CKeditor图片上传
友桥的博客
07-27 357
config.js配置：config.filebrowserImageUploadUrl= "xxxxxx"; （进入到相应的上传图片的类） 图片上传处理类： // ckeditor图片上传     @RequestMapping(value = "xxxxx", method = RequestMethod.POST)     public String cked...
ckeditor上传图片
01-14
ckeditor包,js,代码,说明全都在里面.
CKEditor图片上传
我爱编程持之以恒
07-18 1109
1.根据实际需要下载指定的CKEditor 2.删除文件ckeditor/plugins/image/dialogs/image.js预览框中文本内容，并修改hidden属性值为显示上传选项卡 删除image.js中包含在双引号中的上述文本 将image.js中的hidden属性值改为0 3.修改ckeditor/config.js文件，配置“上
CKEditor上传图片
LeDao的博客
02-25 390
在 ckeditor 文件夹中找到 config.js 文件，设置上传图片的请求地址，参考代码如下。在 CKEditor 编辑器工具栏找到图像按钮并点击。选择图片要显示的尺寸，并点击确定即可完成图片上传。选择上传标签页，选择文件并上传到服务器。
限制ckeditor上传图片文件大小的方法
12-19
本篇文章主要介绍两种限制CKEditor上传图片文件大小的方法，一种是通过修改PHP配置文件，另一种是直接修改Fckeditor的源码。 首先，我们可以通过修改PHP的配置文件`php.ini`来限制上传文件的大小。默认情况下，PHP...
PHP CKEditor 上传图片实现代码
12-18
通过集成PHP上传脚本，我们可以让CKEditor具备上传图片并嵌入到编辑内容中的能力。 首先，我们需要在CKEditor的配置文件`config.js`中设置图片上传的URL。在这个例子中，我们看到以下代码： ```javascript ...
PHPMyWind更换编辑器ckeditor批量上传图片
09-29
在本文中，我们将深入探讨如何在PHPMyWind项目中替换默认编辑器为CKEditor，并实现批量上传图片的功能。PHPMyWind是一款开源的基于PHP和MySQL的内容管理系统，它提供了丰富的功能和自定义选项。CKEditor则是一款强大...
新版CKEditor实现图片上传，绝对靠谱
02-23
近日要用到CKEditor实现图片上传，网上找了好多代码，要么跑不起来，要么不全，比如不知道如何返回值。跳了不少坑，现在彻底搞定。 目前上传用的是ASP.NET,可以随便切换成PHP、JAVA或其它的语言 只需要把ckeditor...
ckeditor图片上传,视频上传
08-02
ckeditor实现 视频上传CKEditor 是新一代的 FCKeditor，是一个重新开发的版本。CKEditor 是全球最优秀的网页在线文字编辑器之一，因其惊人的性能与可扩展性而广泛的被运用于各大网站。
ckeditor 粘贴图片并上传
02-09
拷到plugins目录下 配置config.js config.extraPlugins = 'uploadimage'; config.imageUploadUrl= '上传路径'; 详细请看：http://blog.youkuaiyun.com/weixin_30512027/article/details/79295921
用ckeditor实现图片上传
xiaobc1234的专栏
07-28 730
很感谢http://blog.163.com/ytrtfhj@126/blog/static/890531092010226023136/的作者 ckeditor基本上都用过，一些基本配置我就不多说了，不太清楚的看上面的那篇文章。 在编辑文章时，很多时候都要在文章中插入图片，ckeditor本身带有插入图片的功能，但只能用网络上的图片资源，而没有图片上传的功能。现在就来实现ckeditor图片
CKEDITOR改造WORD文档快速发帖，一键转存
最新发布
alisky119的博客
11-15 1080
编辑器：ckeditor前端：vue2,vue3.vue-cli后端：asp,jsp,php,asp.net,.net core功能：复制粘贴word内容图片该说不说最近这个需求挻火的，今天早上又有网友加我QQ，实际上之前QQ号码就已经在网上公开了，但是还是有很多网友找不到，这个说实话就真没办法了，除了公布QQ号码以外我还公开了微信号码，应该是随便一搜就能够搜到的。有一说一，网友的动手能力还是要稍微加强一下。
ckeditor java 上传_java使用CKEditor实现图片上传功能
weixin_31192609的博客
02-21 357
java如何使用ckeditor实现图片上传功能，具体内容如下1.根据实际需要下载指定的ckeditor2.删除文件ckeditor/plugins/image/dialogs/image.js预览框中文本内容，并修改hidden属性值为显示上传选项卡删除image.js中包含在双引号中的上述文本将image.js中的hidden属性值改为03.修改ckeditor/config.js文件，配置“...
ckeditor 4 上传图片
weixin_52517502的博客
02-19 1093
在web/js/ckeditor/config.js配置文件中增加：（其中imageUpload是下面写的servlet的url）拿到一个项目后台用ckeditor4,根据实际需求要添加上传图片功能。4、eclipese热部署自动刷新设置。2、编写servlet处理图片上传。3、配置上传文件路径。
XHEDITOR 从WORD中复制内容带多张图片
weixin_42467088的博客
08-13 117
昨天晚上论坛里面的一个网友给我发私信，想了解一下如何解决word内容图片复制粘贴的问题，主要是想一起探讨一下这块的技术问题，他用的是xhEditor这个富文本编辑器，这位老哥说他也是刚开始学习，很多知识都不太懂，所以先开始花了大概半个小时左右的时间给他讲解了一下这块的基础知识，如何实现文件上传，如何实现文件存储功能，如何返...
CKEditor粘贴图片上传功能
Mr_Zang666的博客
06-16 228
Chrome+IE默认支持粘贴剪切板中的图片，但是我要发布的文章存在word里面，图片多达数十张，我总不能一张一张复制吧？ Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能。但是无法处理多张图片。而且转换成BASE64后是作为内容一起提交给服务器，不能够将图片单独保存在另外一台服务器中。如果需要单独保存则需要自已进行处理。比较麻烦。我希望打开Word或者WPS文档后，复制内容然后直接粘贴到富文本编辑器中，编辑器自动将图片批量上传到服务器中，无论文档中有多少张图片，编辑器都全部自动上传，不
通过ckeditor组件在vue2中实现上传图片
Heartnottowake的博客
04-12 1073
2，下载sdk，https://ckeditor.com/ckeditor-5/online-builder/#，打开这个地址，配完就可以下载。3，启动sdk，运行npm install ,npm run build,在build文件夹下就有一个ckeditor.js。1，配置图片上传，其实就是imageUpload这个插件，首先在组件ckeditor添加属性config。直接将这个js放到我们的项目public下，通过script引入即可。5，在我们的组件中引入即可，这样上传图片就完成了，整体代码。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值