1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > php中html富文本编辑器 php + wangEditor 富文本编辑器的配置

php中html富文本编辑器 php + wangEditor 富文本编辑器的配置

时间:2022-09-07 07:32:11

相关推荐

php中html富文本编辑器 php  + wangEditor 富文本编辑器的配置

小编最近做了一个项目,在用户发表文章的模块上,考虑到用户编写文章时的排版需求。要借助富文本编辑器。搜索发现,现在有很多免费的编辑器插件。例如:百度的Ueditor、Summernote 。但是这几个插件的入手难度比较高,而且文档说明不详细。

最后发现一个国内的编辑器wangEditor,配置起来非常简单,漂亮的UI,而且开发者很用心的写了详细的文档说明。在这里也算是一个推荐吧,对于我这种刚刚接触 富文本编辑器的小白来说,能够马上使用,马上看到效果。何尝不是天下一大幸事。

1.png

对于编辑器的基本配置,大家可以参考文档说明,我在此就不一一赘述。

而在“ 图片上传 ” 环节,困扰我许久。由于我使用的是php作为服务器端的接收语言。恰巧开发文档中对于php这一块没有做过多说明。我反复调试,依然不能很好的接收到图片。没办法只能百度,也顺利的在一篇文章中找到了问题所在,非常感谢这位博主的分享:/kf/05/507003.html

接收 图片上传 的配置流程:

1.第一处配置:

editor.config.uploadImgUrl = 'upload.php';

注意:这里的upload.php,是指在服务器上,用于接收图片的文件。

(重点,千万别当成服务器接收图片的文件夹。)

2.第二处配置:

editor.config.uploadImgFileName = 'myFileName';

// 统一指定文件名,类似于标签的name属性,文档中有说明。

3.简单的 upload.php 脚本:

$imgInfo = $_FILES['myFileName'];

// 图片名称

$oldname = $imgInfo['name'];

// 临时文件

$tmp_name = $imgInfo['tmp_name'];

// 错误信息

$error = $imgInfo['error'];

// 分割字符串,得到数组。

$temp = explode(".",$oldname);

// 用时间戳 + 文件后缀 重命名文件。

$newname = time().".".$temp[count($temp)-1];

// 在服务上移动图片到指定目录。

move_uploaded_file($tmp_name,'backend/uploads/'.$newname);

// 返回图片路径,类似ajax的响应流程。

echo $dir = "backend/uploads/".$newname;

ps:到这里就完成配置,可以上传图片了。在编辑器中进行图文并茂的排版了。( 不推荐,直接复制粘贴。)

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。