ueditor集成135编辑器并将外部图片地址自动转成自己的业务域名地址

老鬼M

已于 2024-07-05 15:09:08 修改

阅读量152

点赞数 1

分类专栏：富文本编辑器文章标签：编辑器

于 2023-11-08 13:14:57 首次发布

本文链接：https://blog.csdn.net/weixin_38393321/article/details/134287085

版权

富文本编辑器专栏收录该内容

2 篇文章 0 订阅

订阅专栏

文章目录

- ueditor集成135编辑器并将外部图片地址自动转成自己的业务域名地址

ueditor集成135编辑器并将外部图片地址自动转成自己的业务域名地址

一：介绍

常用的富文本编辑器有百度符文本ueditor，kingeditor等，只能实现简单的功能，
针对要排版的东西很难操作，所以这里介绍使用ueditor集成135编辑器的插件，代替
原本的富文本编辑器

ueditor官方文档
135系统继承文档

二：最终目的

ueditor原关于图片，视频等的功能实现自定义上传到文件服务
集成135编辑器插件
实现135编辑器的外部地址自动上传到自己的文件服务器

三：步骤

3.1 后台自定义server

需要实现原本ueditor demo中的jsp的接口，下面是入口的地址，详情代码联系作者。

3.2 修改ueditor.config.js

1.修改SERVER_URL为自己新写的server后台地址
2.设置catchRemoteImageEnable=true

四：演示效果

点击查看预览效果

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

老鬼M

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
2
评论
ueditor集成135编辑器并将外部图片地址自动转成自己的业务域名地址

ueditor集成135编辑器并将外部图片地址自动转成自己的业务域名地址
复制链接

扫一扫

专栏目录

vue-ueditor-wrap集成135编辑器

beanLau的博客

03-15

2587

需求说明在本次项目中，百度富文本编辑器主要是用来编辑微信公众号页面内容。为了方便运营工作，决定集成135编辑器（自带模板、图片等）。第一步clone组件代码首先下载vue-ueditor-wrap源代码安装依赖（github项目主页有使用方法）然后如下： ueditor/dialog 下添加135editor文件夹以及内容。 ueditor文件夹添加135editor.js文件。 ued...

UEditor（集成 135 编辑器插件）（附源码）

源码好优多

09-08

2309

效果图可以看到第一个菜单是135，点击135跳到135编辑器，点击完成编辑即可准备工作 1.npm npm install vue-ueditor-wrap // 或者 yarn add vue-ueditor-wrap 2下载UEditor， UEditor 官网下载链接我这边后台是java我下载jsp版本解压将解压的文件夹重命名为 UEditor 并移动到你项目的静态资源目录下引入且使用VueUeditorWrap组件 import VueUeditorWrap from 'vu

2 条评论您还未登录，请先登录后发表或查看评论

vue 后台管理系统富文本组件（四）UEditor（集成 135 编辑器插件）

前端开发者

01-08

1万+

vue 后台管理系统富文本组件（四）UEditor（集成 135 编辑器插件）简介 135 编辑器应用于微信文章、企业网站、以及论坛等多种平台，支持秒刷、一键排版、全文配色、公众号管理、微信变量回复、48 小时群发、定时群发、云端草稿、文本校对等 40 多项功能与服务，像拼积木一样组合排版的文章。 135 编辑器应其简单的操作，强大的功能和美观的排版深受广大用户喜爱。135 编辑器插本质是基于...

Ueditor中集成135编辑器

最新发布

snow_love_xia的博客

06-27

476

在资讯项目平台运营过程中，资讯需要排版，一般都是在135编辑器排好以后，复制到平台中UEditor编辑器中，所以，他们建议集成一下135哈。唤起135编辑器后，在编辑区域排版内容，点击右侧“完成编辑” 就会将所有内容自动返回到自己的编辑器里面。中toolbars项里增加一个135editor菜单项，开始调研了解135编辑器，发现人家就支持集成哈，在自己的项目调用编辑器的网页里中增加一段CSS。，点击这里可以看到，其实很简单。Ueditor中集成135编辑器

vue项目百度ueditor编辑器集成135和秀米，主题图标美化

江拥羡橙的博客

05-18

2186

本文介绍vue项目里引入百度Ueditor富文本编辑器，集成135编辑器和秀米编辑器，使内容编辑更加丰富，跳转体验更加丝滑。再封装成组件，使用更加快捷。

Vue项目玩转Ueditor（百度富文本编辑器），解决图片需要上传服务器的问题，将图片转存base64字符串。

小马哥的博客

11-06

5629

文章目录1. 场景描述2. 问题描述3.较为流行的几个富文本编辑器比较3.1、wangEditor3.2、百度的ueditor3.3、KindEditor3.4、bootstrap-wysiwyg3.5、QuillEditor4.Ueditor的集成 1. 场景描述最近在做一个网站，里面有发布文章的功能。需要使用到富文本编辑器来发布文章。实现思路：富文本编辑排版=》转存html=》服务器存储为txt文件=》数据库存储访问地址=》前端访问后台服务拿到访问地址=》请求url拿到文章内容=》渲染到页面。

ueditor上传图片回调_ueditor（vue-ueditor-wrap）集成秀米踩坑记录vue-cli4

weixin_39598584的博客

11-25

600

一个不断学习的前端菜鸟，欢迎指正，别喷。。。前言首先， KB编辑器! ，官网都提莫的没了。然后得感谢某某某等大佬，因为确实查了好久的资料，你问我为什么不换个编辑器，？？？（手动问号），我没这个权力......，业务需要，开搞吧（项目是vue-cli4）。试水第一选择肯定是打开ueditor官网地址看下文档吧？？？？？？然后去github https://github.com/fex...

js获取UEditor富文本编辑器中的图片地址

10-15

主要介绍了js获取UEditor富文本编辑器中的图片地址,最简单的思路应该是先获取UEditor中的内容再将获取到的字符串转换成jquery对象，选择器找到img元素，获取src值

Laravel框架集成UEditor编辑器的方法图文与实例详解

01-20

【Laravel框架集成UEditor编辑器】在Laravel框架中集成UEditor编辑器，可以极大地提升用户在编辑内容时的体验。UEditor是一款强大的富文本编辑器，支持多种功能如图片上传、视频插入等，广泛应用于网站内容管理。...

百度UEditor 整合135所需要的文件

10-08

- **实现接口交互**：可能需要编写JavaScript代码来实现UEditor与135编辑器之间的数据交互，例如，当用户选择135编辑器的样式后，能自动在UEditor中应用。 4. **文件列表解析** 压缩包中的“135文件”很可能包含...

百度UEditor编辑器如何关闭抓取远程图片功能

12-12

这个功能会在用户复制并粘贴非白名单内的图片到编辑器时自动将远程图片转存为本地服务器上的图片。要关闭百度UEditor的远程图片抓取功能，首先需要理解编辑器的工作原理。UEditor在内部使用了一系列插件来实现其...

135富文本编辑器

05-30

内含135editor源代码，编辑器源码，此资源为研究学习使用

（微信编辑器）UEditor富文本嵌入135编辑器

热门推荐

LeeGene的博客

06-08

1万+

UEditor简介 UEditor是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器，具有轻量，可定制，注重用户体验等特点，开源基于MIT协议，允许自由使用和修改代码。本文以最新版本的1.4.3.3版本为教程来讲述具体文档参见：http://fex.baidu.com/ueditor/ 135编辑器简介 135编辑器是一款提供微信公众号文章排版和内容编辑的在线工具,样式丰富,支持...

百度UEditor 整合135编辑器到功能栏

轻庐踏雪

10-08

615

整体上该整合过程分为三个步骤：下载两个文件分别是 135editor.js 和 135EditorDialogPage.html 。修改ueditor.config.js中toolbars项里增加一个135editor菜单项。在自己的项目调用编辑器的网页里中增加一段CSS。第一步：点击【下载】两个文件。第二步：在toolbars中新增字段 ‘135editor’ ，表示添加135入口图标。 toolbars:[ ['bold','italic', 'underline', 'fontb

vue---uedito---135

qq_33743799的博客

09-14

923

135、vue、富文本、ueditor

PHP Ueditor 百度富文本编辑器 CDN 远程服务器配置流程

cqn2bd2b的博客

10-28

577

最近公司有个项目需要把文件存放到CDN上，而在网上找的Ueditor百度编辑器大多数都是在同一台电脑上进行操作了。而用php的就更加难找了。原理就和平时的上传图片到远程服务器一样，这样看来，其实百度富文本编辑器是一开始就支持上传图片到cdn上的。其实用到的只有这个文件夹，理论上只需要这个，本人比较懒就整个复制过去了。然后剩下的就是根据自己的需要在php文件夹里面配置一下图片访问的路径。只是没有认真看清楚他的结果导致走了很多的坑。然后在本地的修改掉所指向的服务器文件的地址。加上这两条一般就跨域解决了。

百度UEditor编辑器整合实录

chenpenghuan的博客

03-06

1818

百度UEditor编辑器整合实录在Laravel中手动引入最新版UEditor编辑器。1. 在官网下载的Ueditor编辑器的代码包中根目录下有index.html示例文件，打开该文件，复制head标签中引入css、js的部分，粘贴到你要引入的代码文件中（模板或者html）<script type="text/javascript" charset="utf-8" src="ueditor.conf

thinkphp 接Ueditor 自定义上传路径（oss）

靳某某

11-04

573

1下载好Ueditor后修改ueditor.config.js 修改serverUrl为你自己的接口路径 serverUrl: “http://wechat.bluewhale.com/Ueditor/index” 2后端Ueditor/index <?php namespace app\wechat\controller; use Chichoyi\ThinkOss\Facade\Oss;//引用oss use think\Controller; /** * Ueditor */ class

JAVA中将WORD转换为HTML导入到UEDITOR编辑器中

06-03

在Java中将Word转换为HTML需要使用Apache POI和JodConverter库。而将HTML导入到UEditor编辑器中，需要在前端使用UEditor富文本编辑器，并在后端使用Java Web框架（如Spring MVC）来处理上传文件和保存HTML内容。以下是一个简单的Java代码示例，演示如何将Word文档转换为HTML，并将HTML保存到服务器上的文件中： ```java import java.io.File; import java.io.FileOutputStream; import java.io.IOException; import org.apache.poi.hwpf.HWPFDocument; import org.jodconverter.JodConverter; import org.jodconverter.office.LocalOfficeManager; import org.jodconverter.office.OfficeException; import org.jodconverter.office.OfficeManager; public class WordToHtmlConverter { public static void main(String[] args) { // Start the office manager OfficeManager officeManager = LocalOfficeManager.builder().officeHome("/usr/lib/libreoffice").install().build(); try { officeManager.start(); // Load the Word document HWPFDocument document = new HWPFDocument(new FileInputStream("document.doc")); // Create a temporary file for the HTML output File tempFile = File.createTempFile("document", ".html"); // Convert the document to HTML JodConverter.convert(document).to(tempFile).execute(); // Save the HTML content to a file on the server FileOutputStream fos = new FileOutputStream("output.html"); fos.write(Files.readAllBytes(tempFile.toPath())); fos.close(); // Delete the temporary file tempFile.delete(); } catch (IOException | OfficeException e) { e.printStackTrace(); } finally { // Stop the office manager officeManager.stop(); } } } ``` 在上述代码中，我们使用JodConverter将Word文档转换为HTML，并将HTML内容保存到服务器上的文件中。然后，我们可以在Java Web应用程序中使用Spring MVC等框架来处理上传文件，并将HTML内容保存到数据库中。最后，在前端使用UEditor富文本编辑器时，我们可以将HTML内容加载到编辑器中，让用户进行编辑和保存。