PHP实现本地图片转base64格式并上传


Posted in PHP onMay 29, 2020

我们在开发系统时,处理图片上传是不可避免的,例如使用thinkphp的肯定很熟悉import("@.ORG.UploadFile");的上传方式,今天我们来讲一个使用html5 base64上传图片的方法。

主要是用到html5 FileReader的接口,既然是html5的,所支持的浏览器我就不多说啦

可以大概的讲一下思路,其实也挺简单。选择了图片之后,js会先把已选的图片转化为base64格式,然后通过ajax上传到服务器端,服务器端再转化为图片,进行储存的一个过程。

咱们先看看前端的代码。

html部分

<input type="file" id="imagesfile">

js部分

$("#imagesfile").change(function (){
          
   var file = this.files[0];
   
   //用size属性判断文件大小不能超过5M ,前端直接判断的好处,免去服务器的压力。
   if( file.size > 5*1024*1024 ){ 
        alert( "你上传的文件太大了!" ) 
   }
   
   //好东西来了
   var reader=new FileReader();
    reader.onload = function(){
      
      // 通过 reader.result 来访问生成的 base64 DataURL
      var base64 = reader.result;
      
      //打印到控制台,按F12查看
      console.log(base64);
      
      //上传图片
      base64_uploading(base64);
      
    }
     reader.readAsDataURL(file);
        
});

//AJAX上传base64
function base64_uploading(base64Data){
  $.ajax({
     type: 'POST',
     url: "上传接口路径",
     data: { 
      'base64': base64Data
     },
     dataType: 'json',
     timeout: 50000,
     success: function(data){
        
        console.log(data);
        
     },
     complete:function() {},
     error: function(xhr, type){
         alert('上传超时啦,再试试');
         
     }
   });
}

其实前端的代码也并不复杂,主要是使用了new FileReader();的接口来转化图片,new FileReader();还有其他的接口,想了解更多的接口使用的童鞋,自行谷歌搜索new FileReader();。

接下来,那就是服务器端的代码了,上面的demo,是用thinkphp为框架编写的,但其他框架也基本通用的。

function base64imgsave($img){
    
    //文件夹日期
    $ymd = date("Ymd");
    
     //图片路径地址  
    $basedir = 'upload/base64/'.$ymd.'';
    $fullpath = $basedir;
    if(!is_dir($fullpath)){
      mkdir($fullpath,0777,true);
    }
    $types = empty($types)? array('jpg', 'gif', 'png', 'jpeg'):$types;
    
    $img = str_replace(array('_','-'), array('/','+'), $img);
    
    $b64img = substr($img, 0,100);
    
    if(preg_match('/^(data:\s*image\/(\w+);base64,)/', $b64img, $matches)){
      
    $type = $matches[2];
    if(!in_array($type, $types)){
      return array('status'=>1,'info'=>'图片格式不正确,只支持 jpg、gif、png、jpeg哦!','url'=>'');
    }
    $img = str_replace($matches[1], '', $img);
    $img = base64_decode($img);
    $photo = '/'.md5(date('YmdHis').rand(1000, 9999)).'.'.$type;
    file_put_contents($fullpath.$photo, $img);
      
      $ary['status'] = 1;
      $ary['info'] = '保存图片成功';
      $ary['url'] = $basedir.$photo;
      
      return $ary;
    
    }
    
      $ary['status'] = 0;
      $ary['info'] = '请选择要上传的图片';
      
      return $ary;
  }

以上就是PHP代码,原理也很简单,拿到接口上传的base64,然后再转为图片再储存。

使用的是thinkphp 3.2,无需数据库,PHP环境直接运行即可。

php目录路径为:

‪Application\Home\Controller\Base64Controller.class.php

html目录路径为:

Application\Home\View\Base64\imagesupload.html

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
php getsiteurl()函数
Sep 05 PHP
PHP文件注释标记及规范小结
Apr 01 PHP
php引用返回与取消引用的详解
Jun 08 PHP
使用php实现截取指定长度
Aug 06 PHP
PHP里8个鲜为人知的安全函数分析
Dec 09 PHP
带你了解PHP7 性能翻倍的关键
Nov 19 PHP
ThinkPHP模板Volist标签嵌套循环输出多维数组的方法
Mar 23 PHP
提交表单后 PHP获取提交内容的实现方法
May 25 PHP
PHP日志LOG类定义与用法示例
Sep 06 PHP
PHP使用phpunit进行单元测试示例
Sep 23 PHP
gearman中任务的优先级和返回状态实例分析
Feb 27 PHP
PHP7 windows支持
Mar 09 PHP
php实现的证件照换底色功能示例【人像抠图/换背景图】
May 29 #PHP
php生成短网址/短链接原理和用法实例分析
May 29 #PHP
PHP const定义常量及global定义全局常量实例解析
May 28 #PHP
PHP实现获取文件mime类型多种方法解析
May 28 #PHP
php生成随机数/生成随机字符串的方法小结【5种方法】
May 27 #PHP
php+mysql实现的无限分类方法类定义与使用示例
May 27 #PHP
php与阿里云短信接口接入操作案例分析
May 27 #PHP
You might like
全国FM电台频率大全 - 2 天津市
2020/03/11 无线电
将PHP作为Shell脚本语言使用
2006/10/09 PHP
PHP+jquery实时显示网站在线人数的方法
2015/01/04 PHP
jQuery 行背景颜色的交替显示(隔行变色)实现代码
2009/12/13 Javascript
js动态添加事件并可传参数示例代码
2013/10/21 Javascript
JS生成不重复的随机数组的简单实例
2016/07/10 Javascript
简单谈谈ES6的六个小特性
2016/11/18 Javascript
Vue.JS入门教程之自定义指令
2016/12/08 Javascript
jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)
2016/12/22 Javascript
AngularJS自定义指令之复制指令实现方法
2017/05/18 Javascript
JavaScript中运算符规则和隐式类型转换示例详解
2017/09/06 Javascript
详解React Native 采用Fetch方式发送跨域POST请求
2017/11/15 Javascript
JavaScript创建对象方式总结【工厂模式、构造函数模式、原型模式等】
2018/12/19 Javascript
微信小程序文字显示换行问题
2019/07/28 Javascript
[02:11]完美世界DOTA2联赛10月28日赛事精彩集锦:来吧展示实力强劲
2020/10/29 DOTA
Python 中Django安装和使用教程详解
2019/07/03 Python
图文详解Django使用Pycharm连接MySQL数据库
2019/08/09 Python
python生成器推导式用法简单示例
2019/10/08 Python
Python any()函数的使用方法
2019/10/28 Python
Python第三方包之DingDingBot钉钉机器人
2020/04/09 Python
什么是Python变量作用域
2020/06/03 Python
Python 测试框架unittest和pytest的优劣
2020/09/26 Python
移动端rem布局的两种实现方法
2018/01/03 HTML / CSS
Grow Gorgeous美国官网:只要八天,体验唤醒毛囊后新生的茂密秀发
2018/06/04 全球购物
俄罗斯大型在线书店:Читай-город
2019/10/10 全球购物
PHP如何对用户密码进行加密
2014/07/31 面试题
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
副护士长竞聘演讲稿
2014/04/30 职场文书
实习生工作证明范本
2014/09/14 职场文书
2014年医院工作总结
2014/11/20 职场文书
售后前台接待岗位职责
2015/04/03 职场文书
2016入党积极分子党课学习心得体会
2015/10/09 职场文书
描写九月优美句子(39条)
2019/09/11 职场文书
少年的你:世界上没有如果,要在第一次就勇敢的反抗
2019/11/20 职场文书
PyCharm配置KBEngine快速处理代码提示冲突、配置命令问题
2021/04/03 Python
用Python创建简易网站图文教程
2021/06/11 Python