微信端wap网页,多个图片上传后编辑的问题

最近参与了一个微信网页端的开发,其中有一个上传多个图片的功能,如下

下方能够添加多张图片,通过thinkPHP的图片上传类接收,将图片名以逗号分隔的形式存在数据库里。

编辑时看起来时好好的

点击提交后,出现的问题是,如果没有传新图,老图片还在(字段没有更新),如果传了新图,老图就没有了,只剩新图。

 原因分析:核心的一点,input的type=file没法给定默认的文件或值。因为:

<input type='file' name='url'>是一个上传标签,只能通过用户手动点击选择路径,浏览器禁止通过代码来更改它的value值。

试想一下,如果代码可以随意更改用户上传的文件,那对用户来说岂不是特别的危险,所以这样的安全机制存在是非常合理的。

所以编辑界面看到的原来的老图只是一个略所图,实际对应的隐藏input并没有值,如果没有新图的话,图片字段不更新,所以老图还在,如果有新图的话,字段更新,老图也就没有了。

解决思路:将老图的文件名放在隐藏的input text里面,将老图的文件名和新图分别传到服务器,如果既有老图又有新图,则组合成新的字符串写入数据库。

前端:新图是input:file,老图只是略缩图和隐藏的input:text,如果用户删除老图,则删除老图对应的input。

后端:收到两部分数据,老图的图片名集合,新图经过上传类处理过后的图片名集合,将这两个集合拼接成新的集合,写入数据库;

结果:可行。

php:

 //多图片上传
            if(!empty($_FILES['issueImg']['name'][0])){  //传了新图
                if(($imageinfo = $this->imageUpload()) != 'error'){
                    foreach($imageinfo as $k=>$v){
                        $data['add_img'][$k] = $imageinfo[$k]['savename'];                   
                    }
                }
                $data['add_img']=implode(',',$data['add_img']);
                 if(!empty($_POST['old_img'])){      //传了新图也有老图
                    $_POST['old_img']=implode(',',$_POST['old_img']);
                    $data['add_img']=$_POST['old_img'].','.$data['add_img'];
                 }
            }else{  //如果没传新图
                $_POST['old_img']=implode(',',$_POST['old_img']);
                $data['add_img']=$_POST['old_img'];
            }
原文地址:https://www.cnblogs.com/tingfengqieyu/p/5314850.html