ueditor 百度编辑器 自定义图片上传路径和格式化上传文件名

今天项目中需要自定义图片上传的保存路径,并且不需要按照日期自动创建存储文件夹和文件名,我的ueditor版本是1.3.6。下面记录一下我配置成功的方法,如果有什么不对的地方欢迎指出,共同学习:

1:我在本地项目的根目录下新建一个文件夹,比如:upload。

2:打开ueditor/php/config.php,改成如下代码后保存:


<?php

return array(

//图片上传允许的存储目录
/*‘imageSavePath‘ => array (
‘upload1‘, ‘upload2/‘
)*/

  //图片上传允许的存储目录,可配置多个,我这里配置的是到根目录下的upload文件夹
‘imageSavePath‘ => array (
‘../../upload‘
)
);

3:打开ueditor/php/imageUp.php,加入将../../去掉的代码:

找到:$info = $up->getFileInfo(); 在这后面加入下面代码:

$info["url"]=str_replace(‘../../‘,‘‘,$info["url"]); //将../../替换掉。

4:打开ueditor/php/Uploader.class.php,这一步将修改按照日期自动创建存储文件夹的代码,修改后将不会自动生成日期文件夹:


/**
* 按照日期自动创建存储文件夹
* @return string
*/
private function getFolder()
{
$pathStr = $this->config[ "savePath" ];
if ( strrchr( $pathStr , "/" ) != "/" ) {
$pathStr .= "/";
}
//$pathStr .= date( "Ymd" ); //将这行代码注释掉
if ( !file_exists( $pathStr ) ) {
if ( !mkdir( $pathStr , 0777 , true ) ) {
return false;
}
}
return $pathStr;
}

这里遇到一个问题:上传后路径upload后面多了一个“/”,比如:/ueditor/php/upload//1396072919176817.jpg。要去掉这个/,修改如下代码:


private function upFile( $base64 )
{
...
//找到这行代码(大概在103行):
$this->fullName = $this->getFolder() . ‘/‘ . $this->getName();

//将上面这行中的代码修改成下面这样,去掉/:
$this->fullName = $this->getFolder() . $this->getName();
}

5:打开ueditor/ueditor.all.min.js,这步将格式化上传文件名,先搜索“fileNameFormat”:


将fileNameFormat:"{time}{rand:6}"} 改成:fileNameFormat:"{filename}"}

//格式化字符串的参数
{filename} //会替换成文件名
{rand:6} //会替换成随机数,后面的数字是随机数的位数
{time} //会替换成时间戳
{yyyy} //会替换成四位年份
{yy} //会替换成两位年份
{mm} //会替换成两位月份
{dd} //会替换成两位日期
{hh} //会替换成两位小时
{ii} //会替换成两位分钟
{ss} //会替换成两位秒

//例子:
//配置项为:
//fileNameFormat = "{yyyy}-{mm}-{dd}_{rand:4}_{filename}"
//上传的文件名可能是这样:
//"2013-12-16_7126_照片.jpg"

//配置项为:
//fileNameFormat = "{time}_{rand:5}"
//上传的文件名可能是这样:
//"1387191121817_29461.jpg"

6:打开ueditor/ueditor.config.js,找到34行左右:

 //,imagePath:URL + "php/"    //图片修正地址,引用了fixedImagePath,如有特殊需求,可自行配置

//将上面的改成(这里是相对路径,可根据你自己需求修改):
,imagePath:"/"

好了,刷新上传的框架,测试上传看看吧,效果如图:

时间: 2024-10-13 12:03:03

ueditor 百度编辑器 自定义图片上传路径和格式化上传文件名的相关文章

angularjs利用指令调用ueditor百度编辑器

ueditor中文是百度编辑器,而angularjs是一款优秀的前端JS框架了,下面我们来介绍在angularjs调用ueditor百度编辑器例子,有兴趣的可一起来看看. 一直以来,angularjs的富文本编辑器都比较难做,主要是第三方的编辑器很难集成进来,今天花时间研究了一下,发现ueditor主要加载两个js文件 ueditor.config.js ueditor.all.js 能不能把这两个文件异步加载呢?答案是肯定的.我们新建一个服务用来异步加载资源,并设置必要的回调方法. 服务代码:

dedecms织梦添加ueditor百度编辑器(支持本地图片水印)

本站所有附件均为UTF-8版本,GBK版本的童学请自行转码: 教程最下面有解决栏目内容添加失败的解决方法和本地上传图片加水印方法. 最终效果 1.直接到百度编辑器官方下载PHP对应的版本 ueditor官方地址:http://ueditor.baidu.com/website/download.html 2.dedecms 程序 include文件夹下,创建 ueditor 文件夹 把下载到的ueditor文件扔进去(index.html不要) 3.include\inc\inc_fun_fun

百度编辑器在服务器置顶路径 解决上传图片创建目录失败的方法(Thinkphp)

1.设置文件夹权限 2.修改 /* 前后端通信相关的配置,注释只允许使用多行方式 */ { /* 上传图片配置项 */ "imageActionName": "uploadimage", /* 执行上传图片的action名称 */ "imageFieldName": "upfile", /* 提交的图片表单名称 */ "imageMaxSize": 2048000, /* 上传大小限制,单位B */ &qu

ueditor 百度编辑器 配置如何上传图片

1.准备工作 下载地址  http://ueditor.baidu.com/website/ 下载出来 你所需要的udditor版本 2.解压出来 3.导包 解压出来文件jsp下的lib导入  到项目中web-inif 下的lib中 注意: 如果导入包仍然报 inser... server  ... 这种错误,把包导入 服务器 lib下 4.修改配置文件 ueditor.config.js window.UEDITOR_HOME_URL = "/default/eos/"; 从注释中取

Ueditor百度编辑器中的 setContent()方法的使用

百度编辑器Ueditor所提供的setContent()方法作用是:设置或者改变编辑器里面的文字内容或html内容 函数说明:setContent(string,boolean); 参数string 是需要设置到编辑器里面的内容,可以含有HTML代码,最后插入到编辑器中的内容是经过 编辑器内置过滤器过滤后的内容,同时该函数会出发selectionchange 事件. 参数:boolean,(true/false) true表示清空编辑器俩面的内容,在内容后面添加内容,不传,默认是true:fal

百度编辑器 多图片批量上传 顺序混乱问题 ueditor

前言 ueditor的介绍我就不多说了,大家可直接访问 http://ueditor.baidu.com/website/index.html 正文 问题: ueditor在进行多图上传时,会出现图片书序错乱的问题. 原因: ueditor自从1.4.2版以后,前端上传模块统一改用webuploader,而webuploader是多线程上传的,ueditor对"uploadSuccess"的处理是上传成功一张,就加入到数组中,这样如果图片上传完成顺序是乱的,最终加入文本框的顺序也乱了.

ueditor百度编辑器中,多图上传后,图片顺序乱掉的处理方法

上传后,图片的顺序和预期的不一致,需要修改ueditor的源码. 一.找到editor/dialogs/attachment/attachment.js文件 1.将_this.fileList.push(json);修改为_this.fileList[$file.index()] = json; 2.考虑上传失败的情况,加上一个判断,避免在上传失败后,数组中出现undefined项 二.找到editor/dialogs/image/image.js文件 1.将_this.imageList.pu

mui 获取本地的图片的绝对路径本,上传到OSS上

mui(".img ul").on("tap", "li.addImgge", function() { if (mui.os.plus) { var a = [{ title: "拍照" }, { title: "从手机相册选择" }]; plus.nativeUI.actionSheet({ title: "请选择图片来源", cancel: "取消", butt

ueditor 百度编辑器,自定义右键菜单

如图:有2种自定义方法,一种是改源码,一种是初始化 初始化,如下代码: var ue = UE.getEditor('XXXid',{ // contextMenu:[ {label:'', cmdName:'selectall'}, { label:'', cmdName:'cleardoc', exec:function () { this.execCommand( 'cleardoc' ); } }, {label:'这里添加一个菜单',cmdName:'cleardoc', icon:'