查看: 1547|回复: 0

[PHP学习] php实现base64图片上传方式实例代码

发表于 2017-12-13 08:00:02

本例子中没有采用File Post上传文件方式!原理一样,为了更加的理解base64 选择将其输出在文本域中,并提交至服务器!运用到项目中建议采用提交File方式。

html代码

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>简单的html5 File测试 for pic2base64</title>
  6. <style>
  7. </style>
  8. <script>
  9. window.onload = function(){
  10. var input = document.getElementById("demo_input");
  11. var result= document.getElementById("result");
  12. var img_area = document.getElementById("img_area");
  13. if ( typeof(FileReader) === 'undefined' ){
  14. result.innerHTML = "抱歉,你的浏览器不支持 FileReader,请使用现代浏览器操作!";
  15. input.setAttribute('disabled','disabled');
  16. }else{
  17. input.addEventListener('change',readFile,false);
  18. }
  19. }
  20. function readFile(){
  21. var file = this.files[0];
  22. //这里我们判断下类型如果不是图片就返回 去掉就可以上传任意文件
  23. if(!/image\/\w+/.test(file.type)){
  24. alert("请确保文件为图像类型");
  25. return false;
  26. }
  27. var reader = new FileReader();
  28. reader.readAsDataURL(file);
  29. console.log();
  30. reader.onload = function(e){
  31. result.innerHTML = this.result;
  32. img_area.innerHTML = '<div class="sitetip">图片img标签展示:</div>![]('+this.result+')';
  33. }
  34. }
  35. </script>
  36. </head>
  37. <body>
  38. <form action="file.php" method="post">
  39. <input type="file" value="sdgsdg" id="demo_input" />
  40. <textarea name="img" id="result" rows=30 cols=300></textarea>
  41. <p id="img_area"></p>
  42. <input type="submit" value="提交">
  43. </form>
  44. </body>
  45. </html>
复制代码

PHP功能块代码

  1. <?php
  2. /**
  3. * base64图片上传
  4. * @param $base64_img
  5. * @return array
  6. */
  7. $base64_img = trim($_POST['img']);
  8. $up_dir = './upload/';//存放在当前目录的upload文件夹下
  9. if(!file_exists($up_dir)){
  10. mkdir($up_dir,0777);
  11. }
  12. if(preg_match('/^(data:\s*image\/(\w+);base64,)/', $base64_img, $result)){
  13. $type = $result[2];
  14. if(in_array($type,array('pjpeg','jpeg','jpg','gif','bmp','png'))){
  15. $new_file = $up_dir.date('YmdHis_').'.'.$type;
  16. if(file_put_contents($new_file, base64_decode(str_replace($result[1], '', $base64_img)))){
  17. $img_path = str_replace('../../..', '', $new_file);
  18. echo '图片上传成功</br>![](' .$img_path. ')';
  19. }else{
  20. echo '图片上传失败</br>';
  21. }
  22. }else{
  23. //文件类型错误
  24. echo '图片上传类型错误';
  25. }
  26. }else{
  27. //文件错误
  28. echo '文件错误';
  29. }
复制代码

实例效果如下:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持程序员之家。



回复

使用道具 举报