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 相关文章推荐
php中批量删除Mysql中相同前缀的数据表的代码
Jul 01 PHP
PHP函数篇之掌握ord()与chr()函数应用
Dec 05 PHP
phpmail类发送邮件函数代码
Feb 20 PHP
PHP连接MySQL的2种方法小结以及防止乱码
Mar 11 PHP
PHP实现即时输出、实时输出内容方法
May 27 PHP
php在数据库抽象层简单使用PDO的方法
Nov 03 PHP
session 加入redis的实现代码
Jul 15 PHP
yii2.0实现创建简单widgets示例
Jul 18 PHP
Laravel学习教程之request validation的编写
Oct 25 PHP
利用PHP判断是手机移动端还是PC端访问的函数示例
Dec 14 PHP
phpstorm激活码2020附使用详细教程
Sep 25 PHP
imagettftext() 失效,不起作用
Mar 09 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中cookie的作用域
2008/03/27 PHP
需要注意的几个PHP漏洞小结
2012/02/05 PHP
PHP取二进制文件头快速判断文件类型的实现代码
2013/08/05 PHP
PHP利用二叉堆实现TopK-算法的方法详解
2017/04/24 PHP
PHP实现一个多功能购物网站的案例
2017/09/13 PHP
PHP检查文件是否存在,不存在自动创建及读取文件内容操作示例
2020/01/23 PHP
禁止选中文字兼容IE、Chrome、FF等
2013/09/04 Javascript
javascript在子页面中函数无法调试问题解决方法
2014/01/17 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
2014/04/06 Javascript
详谈jQuery中的this和$(this)
2014/11/13 Javascript
浅谈jQuery中的事件
2015/03/23 Javascript
JS版元素周期表实现方法
2015/08/05 Javascript
javascript获取系统当前时间的方法
2015/11/19 Javascript
理解Javascript图片预加载
2016/02/23 Javascript
轻松掌握jQuery中wrap()与unwrap()函数的用法
2016/05/24 Javascript
Bootstrap学习系列之使用 Bootstrap Typeahead 组件实现百度下拉效果
2016/07/07 Javascript
JavaScript中document.referrer的用法详解
2017/07/04 Javascript
Vue中计算属性computed的示例解读
2017/07/26 Javascript
jQuery实现base64前台加密解密功能详解
2017/08/29 jQuery
你真的了解Python的random模块吗?
2017/12/12 Python
详解python-图像处理(映射变换)
2019/03/22 Python
使用python从三个角度解决josephus问题的方法
2020/03/27 Python
Django Form设置文本框为readonly操作
2020/07/03 Python
pycharm 使用anaconda为默认环境的操作
2021/02/05 Python
html5标记文字_动力节点Java学院整理
2017/07/11 HTML / CSS
微软香港官网及网上商店:Microsoft HK
2016/09/01 全球购物
女士时装鞋:Chinese Laundry
2018/08/29 全球购物
Europcar澳大利亚官网:全球汽车租赁领域的领导者
2019/03/24 全球购物
欧洲领先的技术商店:eibmarkt.com
2019/05/10 全球购物
大学四年学习的自我评价分享
2013/12/09 职场文书
人事主管岗位职责
2014/01/30 职场文书
岗位廉洁从业承诺书
2014/03/28 职场文书
法学专业求职信
2014/07/15 职场文书
Python pandas读取CSV文件的注意事项(适合新手)
2021/06/20 Python
关于redisson缓存序列化几枚大坑说明
2021/08/04 Redis
SQLServer RANK() 排名函数的使用
2022/03/23 SQL Server