下载安装

1.首先到官网下载最新版的UE1.4.3
UE官方下载地址:http://ueditor.baidu.com/website/download.html#ueditor

这里我下载的是1.4.3PHP版本。下载你所使用的版本就行。

解压文件到你的项目

2.部署.在前端Html页面引入UE  所需的JS文件,然后使用getEditor 实例化

<body>
<!-- 加载编辑器的容器 -->
<script id="container" name="content" type="text/plain">
这里写你的初始化内容
</script>
<!-- 配置文件 -->
<script type="text/javascript" src="ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="ueditor.all.js"></script>
<!-- 实例化编辑器 -->
<script type="text/javascript">
var ue = UE.getEditor('container');
</script>
</body>

浏览你的页面,即可见Ueditor 。是不是很简单的说。

配置Ueditor

UEditor 的配置项分为两类:前端配置项 和 后端配置项。
前后端的配置统一写在后端(PHP版本的config在php/config.json),编辑器实例化时,异步读取后端配置信息,覆盖到前端的配置里。

后端获取的配置项 > 实例化传入的配置项 > ueditor.config.js文件的配置项

前端配置项:官方提供了两种配置方法,静态配置、动态配置。

静态配置:即配置ueditor 目录下的 ueditor.config.js  具体配置项就参考  http://fex-team.github.io/ueditor/#start-config

动态配置:即在实例化UE的时候,通过动态传入配置参数。

var ue = UE.getEditor('container', {
//这里写你的自定义配置项
toolbars: [
['fullscreen', 'source', 'undo', 'redo', 'bold']
],
autoHeightEnabled: true,
autoFloatEnabled: true
});

后端配置项:
在这里先说一下UE的请求:UE所有的操作都是通过get方式请求serverUrl传递action变量的值来进行下一步操作。获取配置、上传图片、获取图片等等其它的操作。

UE默认是通过读取目录下的ueditor.config.js 中的serverUrl 参数然后通过get方法传递action=config来获取后端的配置项的。默认请求是:serverUrl?action=config 来获取配置项的。serverUrl 可以在前端页面动态配置和ueditor.config.js静态配置都是可以的。

你可以测试你的网站下的路径 ueditor/php/controller.php?action=config 是否正常返回了json格式(其它格式也可以,具体请看官方文档)的后端配置内容,格式大致如下。如果这个请求出错,出现400、500等错误,编辑器上传相关的功能将不能正常使用。

{
"imageUrl": "http://localhost/ueditor/php/controller.php?action=uploadimage",
"imagePath": "/ueditor/php/",
"imageFieldName": "upfile",
"imageMaxSize": 2048,
"imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"]
"其他配置项...": "其他配置值..."
}

集成

前面已经说过了UE所有的操作都是通过get方式请求serverUrl传递action变量的值来进行下一步操作。获取配置、上传图片、获取图片等等其它的操作。了解了这一点,对于集成PHP。或者其它的语言都很简单了。具体代码可以参考官方提供的Demo。

htmlspecialchars_decode() 函数把预定义的 HTML 实体转换为字符。

会被解码的 HTML 实体是:

  • & 解码成 & (和号)
  • " 解码成 " (双引号)
  • ' 解码成 ' (单引号)
  • < 解码成 < (小于)
  • > 解码成 > (大于)

htmlspecialchars_decode() 函数是 htmlspecialchars() 函数的反函数。

把预定义的 HTML 实体转换为字符:

<?php
$str = "Bill & 'Steve'";
echo htmlspecialchars_decode($str, ENT_COMPAT); // 只转换双引号
echo "<br>";
echo htmlspecialchars_decode($str, ENT_QUOTES); // 转换双引号和单引号
echo "<br>";
echo htmlspecialchars_decode($str, ENT_NOQUOTES); // 不转换任何引号
?>

以上代码的 HTML 输出如下(查看源代码):

<!DOCTYPE html>
<html>
<body>
Bill & &#039;Steve'<br>
Bill & 'Steve'<br>
Bill & &#039;Steve'
</body>
</html>

PHP集成百度Ueditor 1.4.3的更多相关文章

  1. 网站如何集成百度UEditor编辑器

    在平时的网站维护使用过程中,富文本编辑器是网站必不可少的元素之一.现在市面上各种编辑器功能设计参差不齐,自己做了几个网站都是用蝉知建站系统做的,而蝉知默认内置的编辑器是KindEditor,功能简单, ...

  2. 【军哥谈CI框架】之CI中集成百度UEditor

    Hello,各位亲,新的一周来临啦,很高兴这么快又跟大家伙见面!话说上一回,军哥带大家用JQuery写了一个城市级联菜单的例子 ,不知道亲们学会了多少,是否自己可以独立写出来了呢. 军哥很是期待大家学 ...

  3. vue集成百度UEditor富文本编辑器

    在前端开发的项目中.难免会遇到需要在页面上集成一个富文本编辑器.那么.如果你有这个需求.希望可以帮助到你 vue是前端开发者所追捧的框架,简单易上手,但是基于vue的富文本编辑器大多数太过于精简.于是 ...

  4. Spring Boot集成百度Ueditor

    遇到的问题: 1.将ueditor加入/static目录下,能正常显示,但是出现“请求后台配置项http错误,上传功能将不能正常使用!”(解决在下面,都是自定义上传的,如果需要官方的示例,我也无能为力 ...

  5. SpringBoot集成百度UEditor图片上传后直接访问404解决办法

    SpringBoot项目上传图片一般是上传至远程服务器存储,开发过程中可能会上传至当前项目的某个静态目录中,此时就会遇到这个问题,文件在上传之后直接访问并不能被访问到,必须重新加载项目. 首先分析一下 ...

  6. 集成百度编辑器 ueditor 后端配置项没有正常加载,上传插件不能正常使用!

    项目要用到编辑器,于是集成了ueditor,集成ok,但一直显示 ‘’后端配置项没有正常加载,上传插件不能正常使用!‘’ 各种查: 网上说的无非就是那么集中情况 1. 因为百度官方的问题,php/co ...

  7. django之百度Ueditor富文本编辑器后台集成

    Python3 + Django2.0 百度Ueditor 富文本编辑器的集成 百度富文本编辑器官网地址:http://fex.baidu.com/ueditor/ 疑问:为什么要二次集成? 答案:因 ...

  8. vue集成百度富文本编辑器

    1.前期工作,访问百度富文本官网下载相应的百度富文本文件,根据后端用的技术下载相应的版本,建议下载最新版UTF-8版 (有图有真相,看图) https://ueditor.baidu.com/webs ...

  9. 百度UEditor在线编辑器的配置和图片上传

    前言 最近在项目中使用了百度UEditor富文本编辑器,配置UEditor过程中遇到了几个问题,在此记录一下解决方案和使用方法,避免以后使用UEditor出现类似的错误. 基本配置 一.下载UEdit ...

随机推荐

  1. Java--super关键字用法

    看了马老师的视频,百度了一下,随即敲了一些代码,super是超人,超级的意思,层面上理解为父类 class Person { Person(){             System.out.prin ...

  2. mybatis实战教程(mybatis in action)之三:实现数据的增删改查

    前面已经讲到用接口的方式编程.这种方式,要注意的一个地方就是.在User.xml  的配置文件中,mapper namespace="com.yihaomen.mybatis.inter.I ...

  3. 真机调试时遇到“Could not launch *** process launch failed: Security”的解决办法

    半年没写ios程序了,打算重新将这块技术捡回来.谁知道写的第一个测试程序在真机上就跑出来因为安全问题不能加载的情况. ios的版本是9.2的.看提示信息是app的启动被ios的安全机制阻挡了. 在手机 ...

  4. delphi locate多字段查询

    简单格式: IF MSQ_NewBillQuantity.Locate('FStockID;FMarchID', VarArrayOf([FStockID, FMarchID]), []) = Fal ...

  5. 集合Collection

    /* * 集合的由来: * 我们学习的是面向对象语言,而面向对象语言对事物的描述是通过对象体现的,为了方便对多个对象进行操作,我们就必须把这多个对象进行存储. * 而要想存储多个对象,就不能是一个基本 ...

  6. 栈,队列的java实现

    介绍 http://501565246-qq-com.iteye.com/blog/2047078 实现: http://blog.csdn.net/zsw101259/article/details ...

  7. [源码]ObjectIOStream 对象流 ByteArrayIOStream 数组流 内存流 ZipOutputStream 压缩流

    1.对象流 import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputStream; import java.io.File ...

  8. Solr导入MySql中的数据

    1.参照 http://www.cnblogs.com/luxh/p/5016894.html 部署好solr的环境 2.在solr_home下建立一个core_item目录 [root@iZ23ex ...

  9. 使用delphi+intraweb进行微信开发1~4代码示例

    前几讲重点阐述的是使用iw进行微信开发的技术难点及解决方法,提供的都是代码片段(微信消息加解密是完整代码),实际上我始终感觉按照教程实作是掌握一门技术的最重要的方法!不过对于刚刚接触这类开发的朋友来说 ...

  10. 72. Generate Parentheses && Valid Parentheses

    Generate Parentheses Given a string containing just the characters '(', ')', '{', '}', '[' and ']', ...