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可逆加密函数(分享)
Jun 06 PHP
PHP使用GIFEncoder类生成gif动态滚动字幕
Jul 01 PHP
ThinkPHP连接数据库及主从数据库的设置教程
Aug 22 PHP
Thinkphp将二维数组变为标签适用的一维数组方法总结
Oct 30 PHP
phpmyadmin中禁止外网使用的方法
Nov 04 PHP
php过滤所有的空白字符(空格、全角空格、换行等)
Oct 27 PHP
Smarty模板引擎缓存机制详解
May 23 PHP
header与缓冲区之间的深层次分析
Jul 30 PHP
PHP使用FFmpeg获取视频播放总时长与码率等信息
Sep 13 PHP
highchart数据源纵轴json内的值必须是int(详解)
Feb 20 PHP
php从数据库中读取特定的行(实例)
Jun 02 PHP
浅谈Laravel模板实体转义带来的坑
Oct 22 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
一道求$b相对于$a的相对路径的php代码
2010/08/08 PHP
php三元运算符知识汇总
2015/07/02 PHP
php自动载入类用法实例分析
2016/06/24 PHP
tp5(thinkPHP5框架)时间查询操作实例分析
2019/05/29 PHP
firefox中JS读取XML文件
2006/12/21 Javascript
Javascript 获取字符串字节数的多种方法
2009/06/02 Javascript
javascript+css 网页每次加载不同样式的实现方法
2009/12/27 Javascript
加载 Javascript 最佳实践
2011/10/30 Javascript
js select option对象小结
2013/12/20 Javascript
js的隐含参数(arguments,callee,caller)使用方法
2014/01/28 Javascript
jQuery中选择器小问题(新人难免遇到)
2014/03/31 Javascript
跟我学习javascript的函数和函数表达式
2015/11/16 Javascript
javascript实现checkbox复选框实例代码
2016/01/10 Javascript
Vue2几种常见开局方式详解
2017/09/09 Javascript
原生JS与jQuery编写简单选项卡
2017/10/30 jQuery
JavaScript实现的简单加密解密操作示例
2018/06/01 Javascript
浅谈Node.js 中间件模式
2018/06/12 Javascript
详解在vue-cli中使用graphql即vue-apollo的用法
2018/09/08 Javascript
如何能分清npm cnpm npx nvm
2019/01/17 Javascript
9102年webpack4搭建vue项目的方法步骤
2019/02/20 Javascript
vue-cli3自动消除console.log()的调试信息方式
2020/10/21 Javascript
[02:16]深扒TI7聊天轮盘语音出处2
2017/05/11 DOTA
python中管道用法入门实例
2015/06/04 Python
使用PyCharm配合部署Python的Django框架的配置纪实
2015/11/19 Python
Python实现运行其他程序的四种方式实例分析
2017/08/17 Python
Python读取Pickle文件信息并计算与当前时间间隔的方法分析
2019/01/30 Python
Python如何实现动态数组
2019/11/02 Python
Django-rest-framework中过滤器的定制实例
2020/04/01 Python
python下对hsv颜色空间进行量化操作
2020/06/04 Python
Window10上Tensorflow的安装(CPU和GPU版本)
2020/12/15 Python
Free People中国官网:波西米亚风格女装服饰
2016/08/30 全球购物
Dyson加拿大官方网站:购买戴森吸尘器,风扇,冷热器及配件
2016/10/26 全球购物
2014年教研活动总结范文
2014/04/26 职场文书
学校党的群众路线教育实践活动个人整改方案
2014/10/31 职场文书
房贷工资证明范本
2015/06/12 职场文书
python利用while求100内的整数和方式
2021/11/07 Python