https://www.jmqz1000.com

cropper+php+ajax实现上传头像

这篇文章主要介绍了关于cropper+php+ajax实现上传头像,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下

前端代码

 !DOCTYPE html 
 html lang= zh-cn 
 head 
 meta charset= UTF-8 
 title 上传头像 /title 
 link href= http://cdn.bootcss.com/cropper/3.1.3/cropper.min.css rel= stylesheet 
 link href= http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css rel= stylesheet 
 style type= text/css 
 body{
 text-align: center;
 #user-photo {
 width:300px;
 height:300px;
 margin-top: 10px;
 #photo {
 max-width:100%;
 max-height:350px;
 .img-preview-box {
 text-align: center;
 .img-preview-box p {
 display: inline-block;;
 margin-right: 10px;
 .img-preview {
 overflow: hidden;
 .img-preview-box .img-preview-lg {
 width: 150px;
 height: 150px;
 .img-preview-box .img-preview-md {
 width: 100px;
 height: 100px;
 .img-preview-box .img-preview-sm {
 width: 50px;
 height: 50px;
 border-radius: 50%;
.cropper-view-box, .cropper-face {
 border-radius: 50%;
 /style 
 /head 
 body 
 button >

php 后台处理代码 插入数据库 根据框架不同 ,所以不写了。后期补上 自动切割不同大小的缩略图

ini_set( date.timezone , Asia/Shanghai 
 * [将Base64图片转换为本地图片并保存]
 * @E-mial wuliqiang_aa@163.com
 * @TIME 2017-04-07
 * @WEB http://blog.iinu.com.cn
 * @param [Base64] $base64_image_content [要保存的Base64]
 * @param [目录] $path [要保存的路径]
$base64_image_content = $_POST[ imgData 
$path= ./upload 
echo base64_image_content($base64_image_content,$path);
function base64_image_content($base64_image_content,$path){
 //匹配出图片的格式
 if (preg_match( /^(data:\s*image\/(\w+);base64,)/ , $base64_image_content, $result)){
 $type = $result[2];
 $new_file = $path. / .date( Ymd ,time()). / 
 if(!file_exists($new_file)){
 //检查是否有该文件夹,如果没有就创建,并给予最高权限
 mkdir($new_file, 0700);
 $new_file = $new_file.time(). .{$type} 
 if (file_put_contents($new_file, base64_decode(str_replace($result[1], , $base64_image_content)))){
 return / .$new_file;
 }else{
 return false;
 }else{
 return false;
}

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP学知网!

相关推荐:

php实现socket推送技术

对象转换成JSON字符串

以上就是cropper+php+ajax实现上传头像的详细内容,PHP教程

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

相关文章阅读