图片base64预览及上传PHP处理

最新推荐文章于 2024-01-17 11:30:23 发布

weixin_34234829

最新推荐文章于 2024-01-17 11:30:23 发布

阅读量290

点赞数

文章标签： php javascript python ViewUI

原文链接：https://my.oschina.net/lixiaoting/blog/2988675

版权

2019独角兽企业重金招聘Python工程师标准>>>

1、前端代码

var newUrl；
function imgPreview() {//将图片转成base64，实现预览效果
var files = this.files;
var file = files[0];
var reader = new FileReader();

reader.readAsDataURL(file);

reader.onload = function() {

// 图片base64化
var newUrl= this.result;
$('#img').style.backgroundImage='url(' + newUrl+ ')';//预览
};

}
$('#img-select').addEventListener('change',imgPreview);

$("#submit").on('click', function(){
$.ajax({
   url:"onload.php",
   type:'POST',
dataType:'json',
   data:{img:newUrl},
   success:function(list) {
       console.log(list)
       location.href ="跳转页面";
   },
   error:function(){
   console.log("请求失败")

}
});
});

2、PHP代码

$img=$_POST['img']；

$base64_body = substr(strstr($img,','),1);//去除头部
$img = base64_decode($base64_body);//解码
//存储or创建图片
$path = "/upload/product/";//存储路径
if(!file_exists($path)){
mkdir($path,0777,true);
}
$imgName=$path.mt_rand(100,999).time().mt_rand(100,999).".jpg";//图片存储路径
file_put_contents($imgName,$img);//存储图片

转载于:https://my.oschina.net/lixiaoting/blog/2988675