Ueditor删除无用图片详解

一、前言

      在上一篇文章 yii2.0使用ueditior完成上传单张，多张图片，上传视频等操作 之后，博主进行了大量的测试，偶然发现图片文件夹越来越大。。

      是的，比如上传了a.png和b.jpg，等到要提交的时候，又把a.png在编辑器中给删除了（backspace），此时我们获取的文档中只有b.jpg，但是存储图片文件夹中，a.png是依然存在的，此时它就是无用的图片。当我们添加的量多的时候，这些无用图片就十分烦人了，占用空间，而且看起来也心烦。

二、删除无用图片的逻辑

      首先，这部分无用图片我们是没有存储在数据库的，理论上来说呢，其实应该弄个临时的文件存储上传的图片，然后再弄个文件夹存储正式的图片。只是文件目录这种东西，特别是在开发的差不多的时候，能不动就不动最好。所以博主这边采用另一种方案，使用临时json数据存储图片名，根据对比来进行删除。

1、add逻辑

（1）图片上传的时候，图片名称存入到img.json
（2）提交表单的时候，获取contont,匹配content中图片的src部分，获取数组$add_img;
	
（3）遍历json文件，获取所有的图片名称，然后和$add_img做比较，获取到$add_img中没有的图片名称$del_img_arr
（4）遍历删除$del_img_arr,同时删除img_json文件。

2、edit逻辑

（1）编辑的提交的时候，同样获取一下content中的图片为add_img。然后获取json文件中的$json_arr，再获取数据库存储的的content中的$arr_img。
	（2）array_merge($json_arr,$arr_img)为$arr_img，然后执行的操作就和新增时候一样了，对比两个数组中的图片名，找到$add_img中没有的图片名，删除即可

OK，大致逻辑明确之后，接下来就是正式的代码部分

三、删除无用过程

1、通过正则匹配图片的src

  /**
     * @param $content
     * @params:根据html内容获取图片的src ,$type是为了区分add和edit，因为存在转义，所以截取的长度不同
     * @author:ljf
     * @date:2019/7/5
     * @time:16:03
     */
    public function getImgSrc($content,$type)
    {
        $add_img = [];
        $pattern='/<img.*?src=[\"|\']?(.*?)[\"|\']?\s.*?>/i';
        preg_match_all($pattern,$content,$res);
        if(count($res[1]) > 0){//代表匹配到图片了，截取字符串，获取图片名称即可
            foreach($res[1] as $v){
                if($type == 1) {
                    $src = substr($v, -21);
                    $img_name = substr($src, 0, strlen($src) - 1);
                }else{
                    $src = substr($v, -20);
                    $img_name = $src;
                }
                //$add_img[$img_name] = $img_name;
                $add_img[]=[
                    'name'=>$img_name,
                ];
            }
        }
        return $add_img;
    }

      这里的$type变量是博主业务需求加上去的，大家不加就行，主要是正则匹配，返回图片的src数组。

2、去Uploader.php中，找到上传图片的方法upFile()，修改上传成功之后的逻辑，即存入img.json文件。

  if (!(move_uploaded_file($file["tmp_name"], $path) && file_exists($path))) { //移动失败
            $this->stateInfo = $this->getStateInfo("ERROR_FILE_MOVE");
        } else { //移动成功,把图片名称写入json
            $path = \Yii::getAlias('@out_news');
            $path_img = $path."/img/img.json";
            $all_img = [];
            $data[] = [
                'name'=> substr($this->imgName,5),
            ];
            if(file_exists($path_img)){
                $json_string = file_get_contents($path_img);// 从文件中读取数据到PHP变量
                $arr_img = json_decode($json_string, true);// 把JSON字符串转成PHP数组
                if(count($arr_img) > 0){
                    $all_img = array_merge($arr_img,$data);
                }else{
                    $all_img = $data;
                }
            }else{
                $all_img = $data;
            }
            $img_all = json_encode($all_img,JSON_UNESCAPED_UNICODE);
            file_put_contents($path_img, $img_all);
            $this->stateInfo = $this->stateMap[0];
        }

3、edit的时候相关操作

      add和delete的操作比较简单，这里就不列出来了，具体是edit的时候，要对比传入的conten中的图片名称，以及数据库中和json文件中的图片名称，综合对比，删除文件夹中无用的图片。

  $path_img = $path."/img/img.json";  //json文件的路径
                    if(file_exists($path_img)) {
                        $json_string = file_get_contents($path_img);// 从文件中读取数据到PHP变量
                        $img_json_arr = json_decode($json_string, true);// 把JSON字符串转成PHP数组
                    }else{
                        $img_json_arr = [];
                    }
                    $old_img_src = $this->getImgSrc($arr[0]['string'],2);  // 获取数据库中的图片src数组
                    $new_img_src = $this->getImgSrc($content,1);  // 获取新传入的content的图片src数组
                    $old_img_src = array_merge($old_img_src,$img_json_arr);  //合并数据库和json文件的图片数组
                    	$this->delLocalImage(new_img_src ,old_img_src );  //删除操作
	

4、删除函数delLocalImage()

 /**
     * @param $arr_img
     * @param $add_img
     * @params:通过旧数组和新数组的对比，删除无用的图片,$add_img是每次提交的img，  $arr_img是json文件和数据库内存的img
     * @author:ljf
     * @date:2019/7/5
     * @time:16:16
     */
    public function delLocalImage($arr_img,$add_img = [])
    {
        $path = \Yii::getAlias('@out_news');
        $path_img = $path."/img/img.json";
        $new_img = [];
        if(count($arr_img)>0) {
            if(count($add_img) > 0){ //当内容中含有图片的时候，才做判断，不含图片的话，直接删除json文件中的img
                foreach($add_img as $k2=>$v2){
                    $new_img[$v2['name']] = $v2['name'];
                }
                unset($v2);
                foreach ($arr_img as $k => $v) {
                    if (isset($new_img[$v['name']])) {
                        unset($arr_img[$k]);
                    }
                }
            }
            unset($v);
            if(count($arr_img) > 0) {
                foreach ($arr_img as $k1 => $v1) {
                    $del_path = $path . '/img/' . $v1['name'];
  	 if(file_exists($del_path )){
                    $this->delDirAndFile($del_path, false);
	 }
                }
            }

        }
        $this->delDirAndFile($path_img, false); //删除掉json文件
    }

关于删除文件夹的函数代码，参考：
php删除文件夹（临时文件）代码

四、总结

1、 测试的时候一定要细心，既然是做自己的产品，尽量是不要留下什么小尾巴，其实这些无用图片不管也没事，对性能不会造成太大的影响，但是如果明知道是程序有问题还不改，那就是自己的失职了。

2、 以上思路是建立在不改变原项目目录的情况下，如果想要方便点的话，直接新建测试文件夹存储这些临时图片也是不错的，反正就是对比，删除的事情。

3、 记录这篇博客主要是心里有点感慨。最开始的时候，遇到bug都是直接开始撸代码，遇到问题了再去思考。现在呢，总是喜欢现在笔记本上写思路，先列出来大致思路，一直到形成一个闭环为止。然后对这些思路进行删减，看看能不能优化下，是否有更好的解决方案，最后才会敲定最终方案，按照思路去写代码，事半功倍是真的。

      看来我们都在不知不觉的发生着改变，是好事吧，逐渐变得成熟且强大。只是，莽劲儿却少了许多，可能就是传说中的姜花深处无少年吧。

end