首页 > 代码库 > 利用插件剪裁图片,并上传
利用插件剪裁图片,并上传
关于js处理图片的三大误区: 1.js操作文件,只能形成剪裁效果,不能生成图片文件;
2.js选择文件时,无法获取文件在个人电脑中的路径;
3.js不能为<input type=file>自动赋值,出于安全方面考虑,fileinput文件只能手动选择。
上传图片思路: 1.使用jquery剪裁插件cropper直接上传,形成图片剪裁效果;
2.使用html5的canvas根据原图,坐标和宽高进行剪裁,将生成的图片(data:image/jepg;base64 编码)直接post给后台服务器;
3.php使用
$base64_url=$_REQUEST(‘pic‘); if (preg_match(‘/^(data:\s*image\/(\w+);base64,)/‘, $base64_url, $result)){ $base64_body = substr(strstr($base64_url,‘,‘),1); $img=base64_decode($base64_body); } if (!$img){ die("无图片"); } //新建一个目录由$dirname指定的目录 $dirname="file/".ugv::sid()."/".date("ym"); ugv::mkdir($dirname); //文件名 $r=ugv::randomid(10,3); $filename=ROOT_PATH.$dirname."/".$r.".jpg";
//插入数据库的文件名 $picname="/".$dirname."/".$r.".jpg"; //写入文件 file_put_contents( $filename,$img);
利用插件剪裁图片,并上传
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。