base64 無刷新上傳

htmljavascript

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<script src="./jquery.js"></script>

<body>
    <form id="postForm" action="" method="post">
        <ul>
            <li>
                <span>img:</span>
                <input id="img" name="img" type="file">
            </li>
            <li>
                <a href="javascript:void(0);">提交</a>
            </li>
        </ul>
    </form>
</body>
<script>
    $('#img').change(function(e) {
        var target = $(e.target);
        var file;
        if (target[0].files && target[0].files[0]) {
            file = target[0].files[0];
        }
        if (file) {
            var reader = new FileReader();
            reader.onload = function(evt) {
                var imgstr = evt.target.result; //這就是base64字符串
                $.post('a.php', {
                    base: imgstr
                }, function(res) {

                })
            };
            reader.readAsDataURL(file);
        }
    });
</script>

</html>

phpphp

<?php
$res=$_POST['base'];
$t=base64_image_content($res,"");
var_dump($t);

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 = 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;
    }
}
相關文章
相關標籤/搜索