ueditor 图片上传路径配置

ueditor的图片上传路径配置文件是 ueditor/php/config.json

 

 

以下是我遇到的一些因为ueditor默认设置引起的图片上传路径配置的问题，特此拿出来与大家分享，如果有说的不对的，欢迎批评指正

 

一、ueditor 的图片上传保存路径 默认在网站根目录下，最前面的 '/' 就是网站根目录的绝对路径，

如果把最前面的 '/' 删掉 改为 './'之类的 那也是

/ueditor/php/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}

原本ueditor这样的设定是为了便于项目调取上传上来的图片视频等文件

然而有些情况下 我们做项目往往客户只会给我们一个子目录的权限 不会给我们根目录的权限

这时只要修改上图的最后一行

 

"imagePathFormat": "/(你的项目目录)/ueditor/php/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}"

 

二、ueditor上传到数据库的图片路径即为上面的"imagePathFormat"

然而这样的设定会不利于项目的迁移，试想你的数据库中都是上面"imagePathFormat"这样绝对定位，如果一旦你的项目目录发生改变，

那就会出现读不到图片的问题。

     （ps.当然如果你的图片位置放在网站根目录，而且没有什么权限问题，那就没有什么问题，下面的内容也可以不用看了）

在我看来，还是不要把图片上传的路径设的太死，设为项目的相对路径会比较好

 

以下是我自己想出的解决方法，如果有知道更简便方法的或者可以重构以下的代码，还是希望可以多多指教

      (ps. 下面的代码用到了一些ueditor 的API 如果不太了解的话, 可以移步http://ueditor.baidu.com/doc/ 进行查阅)

 

var content = ue.getContent();     //获取编辑器内容

var root1 = UE.htmlparser(content, true);     //将上面获得的html字符串转换成uNode节点 便于之后进行dom操作

var imgs = root1.getNodesByTagName('img');     //取所有img标签

//遍历所有的img标签 修改src

for (var i in imgs) {

    var src = changeImgUrl(imgs[i].getAttr('src'));

    imgs[i].setAttr('src', src);

}

 

//取“imagePathFormat” 中'/ueditor'之后的目录路径

function changeImgUrl(string) {

    var index=string.indexOf('ueditor');

    var result="/"+string.substring(index,string.length);

    return result;

}

 

上面代码的逻辑就是通过ueditor 提供的API进行dom操作 修改img的src，

筛选掉'imagePathFormat'中的项目路径，得到去掉'/ueditor/..'的路径(当然不要去修改imagePathFormat， 不然你还是会下载到相对于根目录的路径下的！)

将修改后的内容提交到数据库，便于之后进行拼接相对路径

 

接下来就要开始获取项目目录，准备开始拼接，

不过js没有可以获取项目目录的方法，需要借助后端语言，如php、java等

     (当然如果我说错了的话，还请指正，共同进步嘛)

 

这里我以php为例，来讲讲如何获取项目目录（java肯定也有类似的方法，可惜我才疏学浅，对java着实涉猎有限）

php需要借助$_SERVER 这个服务器变量，不太了解的小伙伴可以移步 http://www.5idev.com/p-php_server.shtml  进行了解

你也可以直接var_dump($_SERVER); 看下里面究竟有哪些东西

 

通过了解我们可以发现 $_SERVER['PHP_SELF']、$_SERVER['SCRIPT_NAME'] 与 $_SERVER['REQUEST_URI'] 三者非常相似，返回的都是与当前 URL 或 PHP 程序文件相关的信息，这可能就使我们需要的项目目录

 

我们再来看一看这三个变量的区别

$_SERVER['PHP_SELF']：相对于网站根目录的路径及 PHP 程序名称。

$_SERVER['SCRIPT_NAME']：相对于网站根目录的路径及 PHP 程序文件名称。

$_SERVER['REQUEST_URI']：访问此页面所需的 URI 

 

下面是我基于thinkphp做的项目的一个url，学过相关知识的童鞋是不是特别熟悉

http://localhost/guzhen/index.php/Admin/Message/lst?cid=2

分别echo 上面的三个变量

• $_SERVER['PHP_SELF'] 得到：/guzhen/index.php/Admin/Message/lst
• $_SERVER['SCRIPT_NAME'] 得到：/guzhen/index.php
• $_SERVER['REQUEST_URI'] 得到：/guzhen/index.php/Admin/Message/lst?cid=2

 

这里我们可以借助dirname($_SERVER['SCRIPT_NAME']) 得到 /guzhen 这就是我们需要的项目路径

之后只有将 项目路径 和前面筛选好的 '/ueditor'这样的路径进行拼接

拼接的方式也很多，可以后端取到数据传给前端的时候进行拼接，也可以前端通过ueditor的API进行拼接