PHP集成百度Ueditor 1.4.3


Posted in PHP onNovember 23, 2014

最近很多群友都来问我怎么集成百度UE(ueditor 1.4.3),实在回答不过来,所以在这写一下集成百度UE的思路,本文内使用的最新版的UE1.4.3。

下载安装

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

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

解压文件到你的项目

PHP集成百度Ueditor 1.4.3

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。

好了,小伙伴们已经明白了如何集成百度Ueditor了吧,本文是自己的一些经验,希望能帮到大家

PHP 相关文章推荐
PHP4实际应用经验篇(5)
Oct 09 PHP
初品cakephp 入门基础
Feb 16 PHP
Zend的AutoLoad机制介绍
Sep 27 PHP
浅析application/x-www-form-urlencoded和multipart/form-data的区别
Jun 22 PHP
PHP 读取和编写 XML
Nov 19 PHP
PHP中让curl支持sock5的代码实例
Jan 21 PHP
PHP使用CURL模拟登录的方法
Jul 08 PHP
php上传图片并压缩的实现方法
Dec 22 PHP
Zend Framework教程之Application和Bootstrap用法详解
Mar 10 PHP
PHP微信分享开发详解
Jan 14 PHP
PHP实现合并两个排序链表的方法
Jan 19 PHP
php微信开发之图片回复功能
Jun 14 PHP
php jsonp单引号转义
Nov 23 #PHP
php常用文件操作函数汇总
Nov 22 #PHP
ThinkPHP中公共函数路径和配置项路径的映射分析
Nov 22 #PHP
ThinkPHP中I(),U(),$this-&gt;post()等函数用法
Nov 22 #PHP
ThinkPHP中处理表单中的注意事项
Nov 22 #PHP
php中convert_uuencode()与convert_uuencode函数用法实例
Nov 22 #PHP
php常用hash加密函数
Nov 22 #PHP
You might like
PHP安装问题
2006/10/09 PHP
实现树状结构的两种方法
2006/10/09 PHP
PHP中call_user_func_array回调函数的用法示例
2016/11/26 PHP
浅谈php常用的7大框架的优缺点
2020/07/20 PHP
jQuery与ExtJS之选择实例分析
2010/08/19 Javascript
document.execCommand()的用法小结
2014/01/08 Javascript
PHP守护进程实例
2015/03/06 Javascript
JavaScript判断是否为数组的3种方法及效率比较
2015/04/01 Javascript
判断输入的字符串是否是日期格式的简单方法
2016/07/11 Javascript
基于jstree使用AJAX请求获取数据形成树
2017/08/29 Javascript
使用Node.js实现ORM的一种思路详解(图文)
2017/10/24 Javascript
Layui数据表格之获取表格中所有的数据方法
2018/08/20 Javascript
vue-router判断页面未登录自动跳转到登录页的方法示例
2018/11/04 Javascript
微信小程序实现页面下拉刷新和上拉加载功能详解
2018/12/03 Javascript
JavaScript算法学习之冒泡排序和选择排序
2019/11/02 Javascript
js判断非127开头的IP地址的实例代码
2020/01/05 Javascript
BootStrap前端框架使用方法详解
2020/02/26 Javascript
Angular利用HTTP POST下载流文件的步骤记录
2020/07/26 Javascript
VUE 实现element upload上传图片到阿里云
2020/08/12 Javascript
js闭包和垃圾回收机制示例详解
2021/03/01 Javascript
Python列出一个文件夹及其子目录的所有文件
2016/06/30 Python
用Python解决计数原理问题的方法
2016/08/04 Python
浅谈python正则的常用方法 覆盖范围70%以上
2018/03/14 Python
从多个tfrecord文件中无限读取文件的例子
2020/02/17 Python
Django REST 异常处理详解
2020/07/15 Python
Pytorch框架实现mnist手写库识别(与tensorflow对比)
2020/07/20 Python
pandas按条件筛选数据的实现
2021/02/20 Python
如何写毕业求职自荐信
2013/11/06 职场文书
餐厅经理岗位职责和岗位目标
2014/02/13 职场文书
2014年幼儿园安全工作总结
2014/11/10 职场文书
2014年驻村干部工作总结
2014/11/17 职场文书
暑期社会实践证明书
2014/11/17 职场文书
2014年学前班工作总结
2014/12/08 职场文书
用基于python的appium爬取b站直播消费记录
2021/04/17 Python
python之PySide2安装使用及QT Designer UI设计案例教程
2021/07/26 Python
Python实现Excel文件的合并(以新冠疫情数据为例)
2022/03/20 Python