使用 php 在服务器上上传后显示零字节的图像大小答案

【问题标题】：Image size showing Zero byte after uploading on server using php使用 php 在服务器上上传后显示零字节的图像大小
【发布时间】：2017-06-07 19:02:21
【问题描述】：

我正在使用croppie 插件来裁剪完美运行的图像。图像存储在我的文件夹中，图像大小显示为零字节。它在本地主机上运行良好，但在服务器上不运行。你会在这方面帮助我吗？

<form action="process.php" id="form" method="post">
<div id="upload-demo"></div>
<input type="hidden" id="imagebase64" name="imagebase64">
<input type="submit" name="submit" value="save" class="upload-result">
</form>
    if(isset($_POST['submit'])){
            $data = $_POST['imagebase64'];
            list($type, $data) = explode(';', $data);
            list(, $data)      = explode(',', $data);
            $data = base64_decode($data);
            $imageName = time().'.png';
            file_put_contents('images/profile/'.$imageName, $data);
           // echo $imageName;
        }

【问题讨论】：

标签： php html crop image-size

【解决方案1】：

这是工作文件。这可能会对您有所帮助。

<?php
if(isset($_POST['imagebase64'])){
    $data = $_POST['imagebase64'];

    list($type, $data) = explode(';', $data);
    list(, $data)      = explode(',', $data);
    $data = base64_decode($data);

    file_put_contents('image64.png', $data);
}
?>
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>Test</title>
<link href="croppie.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="croppie.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
var $uploadCrop;

function readFile(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();          
        reader.onload = function (e) {
            $uploadCrop.croppie('bind', {
                url: e.target.result
            });
            $('.upload-demo').addClass('ready');
        }           
        reader.readAsDataURL(input.files[0]);
    }
}

$uploadCrop = $('#upload-demo').croppie({
    viewport: {
        width: 200,
        height: 200,
        type: 'circle'
    },
    boundary: {
        width: 300,
        height: 300
    }
});

$('#upload').on('change', function () { readFile(this); });
$('.upload-result').on('click', function (ev) {
    $uploadCrop.croppie('result', {
        type: 'canvas',
        size: 'original'
    }).then(function (resp) {
        $('#imagebase64').val(resp);
        $('#form').submit();
    });
});

});
</script>
</head>
<body>
<form action="process.php" id="form" method="post">
<input type="file" id="upload" value="Choose a file">
<div id="upload-demo"></div>
<input type="hidden" id="imagebase64" name="imagebase64">
<a href="#" class="upload-result">Send</a>
</form>
</body>
</html>

【讨论】：

感谢您回复 Mr.acmsohail，它对我有用。从我身边投票