zoukankan      html  css  js  c++  java
  • js获取base64格式图片预览上传并用php保存到本地服务器指定文件夹

    html:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
        
    <input id="load" type="file" onchange="upload(this.files)" name="myfile"/>
    <div id="dd"></div>
    
    <script src="jquery-1.9.1.min.js"></script>
    <script>
        
    
    function upload(f){
    
            var str = "";
            var imgtype="";
            var gs=$("#load").val(); //获取图片url
            var src="";
    
    
            imgtype = gs.toLowerCase().split('.');//截取图片格式 png,jpg,是一个数组
            imgtype =imgtype[1];//选取
    
    
            for(var i=0;i<f.length;i++){
    
                var reader = new FileReader();
                reader.readAsDataURL(f[i]);
    
                reader.onload = function(e){
                src=e.target.result;//base64图片
    
    
                str+="<img src='"+e.target.result+"'/>";
                $("#dd").html(str); //预览图片
    
    
                    $.ajax({
    
                            url:"chul.php",
                            type:"post",
                            data:{
                            src:src,
                            imgtype:imgtype
                            },
                            success:function(data){
                            console.log(data)
                            }
    
                    })
    
    
            }
            }
    
    
    
    
    
    }
    
    
    
    
    </script>
    </body>
    </html>

    php:

    <?php
    header('Content-type:text/html;charset=utf-8');
    //转换base64图片 必须手动建一个img文件夹
       define('UPLOAD_DIR', 'img/');
       $img = $_POST['src'];
       $imgtype=$_POST["imgtype"];
    
    //判断图片格式类型
       if($imgtype=="png"){
    
           $img = str_replace('data:image/png;base64,', '', $img);
       }
    
       if($imgtype=="jpg"){
    
           $img = str_replace('data:image/jpeg;base64,', '', $img);
       }
    
    
       $img = str_replace(' ', '+', $img);
       $data = base64_decode($img);
       
    //判断图片格式类型
       if($imgtype=="png"){
           $imgurl = UPLOAD_DIR . uniqid(). '.png';
    
       } 
    
    
        if($imgtype=="jpg"){
               $imgurl = UPLOAD_DIR . uniqid(). '.jpg';
               
           } 
    
        echo $img;
       //把图片写入文件中
       $success = file_put_contents($imgurl, $data);
    ?>
  • 相关阅读:
    Hubble.net 持久化方面3个重大改进
    并行排序算法
    var_dump打印变量的相关信息
    out of socket memory相关tcp参数
    lsof命令使用示例
    tcp_max_orphans
    print_r打印关于变量的易于理解的信息
    linux动态加载库
    pfiles命令
    var_export输出或返回一个变量的字符串表示
  • 原文地址:https://www.cnblogs.com/xiaobaibubai/p/8493011.html
Copyright © 2011-2022 走看看