将上传的图片保存到缩略图和base64_encoded字符串

时间:2016-01-05 05:56:07

标签: php html file-upload base64

好的,我们假设我们有一个表单,其中有一个简单的文件上传输入

<form action="index.php"  method="post" enctype="multipart/form-data">
<input name="image_file" type="file" />
<input type="submit" name="submit-btn" value="Upload" />
</form>

然后是index.php文件

// check $_FILES['ImageFile'] not empty
if(!isset($_FILES['image_file']) || !is_uploaded_file($_FILES['image_file']['tmp_name'])){
        die('Image file is Missing!'); // output error when above checks fail.
}

//uploaded file info we need to proceed
$image_name = $_FILES['image_file']['name']; //file name
$image_size = $_FILES['image_file']['size']; //file size
$image_temp = $_FILES['image_file']['tmp_name']; //file temp

$image_size_info    = getimagesize($image_temp); //get image size

if($image_size_info){
    $image_width        = $image_size_info[0]; //image width
    $image_height       = $image_size_info[1]; //image height
    $image_type         = $image_size_info['mime']; //image type
}else{
    die("Make sure image file is valid!");
} 

然后我尝试重新调整文件大小

switch($image_type){
    case 'image/png':
        $image_res =  imagecreatefrompng($image_temp);break;
    case 'image/gif':
        $image_res =  imagecreatefromgif($image_temp); break;   
    case 'image/jpeg': case 'image/pjpeg':
        $image_res = imagecreatefromjpeg($image_temp); break;
    default:
        $image_res = false;
}

现在我想将图像输出到用户的浏览器而不存储文件。 这就是我尝试这样做的原因

$data = base64_encode(file_get_contents($_FILES['image_file']['tmp_name']));

但我认为我的逻辑失败了,因为它没有输出图片,无论如何我最终想要的是如下图所示。

switch($image_type){
    case 'image/png':
        echo '<img src="data:image/png;base64,"'.$data.' alt="" />'; break;
    case 'image/gif':
        echo '<img src="data:image/gif;base64,"'.$data.' alt="" />';break;
    case 'image/jpeg': case 'image/pjpeg':
        echo '<img src="data:image/jpeg;base64,"'.$data.' alt="" />';break;
    }

有人能看到失败吗?

3 个答案:

答案 0 :(得分:1)

由于您已将文件编码如下:

$data = base64_encode(file_get_contents($_FILES['image_file']['tmp_name']));

所以你应该输出如下:

switch($image_type){
    case 'image/png':
        echo '<img src="data:image/png;base64,"'.$data.'" alt="" />'; break;
    case 'image/gif':
        echo '<img src="data:image/gif;base64,"'.$data.'" alt="" />';break;
    case 'image/jpeg': case 'image/pjpeg':
        echo '<img src="data:image/jpg;base64,'.$data.'" alt="" />';break;
}

无需使用解码功能。

答案 1 :(得分:1)

设置内容类型标题,并根据需要将 $ image_res imagejpegimagegifimagepng一起使用:

switch($image_type){

    case 'image/png':
      header('Content-Type: image/png');  
      imagepng($image_res);

    case 'image/gif':
      header('Content-Type: image/gif');
      imagegif($image_res);

    case 'image/jpeg': case 'image/pjpeg':
      header('Content-Type: image/jpeg');
      imagejpeg($image_res);

}

在您发布的屏幕截图中看起来是因为在发送到浏览器后标题无法修改。输出表单后,将发送标题。

您可以通过在不同页面中分离表单和php逻辑来解决此问题:

  

<强>的index.php

<form action="process.php"  method="post" enctype="multipart/form-data">
<input name="image_file" type="file" />
<input type="submit" name="submit btn" value="Upload" />
</form>
  

<强> process.php

// check $_FILES['ImageFile'] not empty
if (!isset($_FILES['image_file']) ||
    !is_uploaded_file($_FILES['image_file']['tmp_name'])){
      die('Image file is Missing!'); // output error when above checks fail.
}

// uploaded file info we need to proceed
$image_name = $_FILES['image_file']['name']; //file name
$image_size = $_FILES['image_file']['size']; //file size
$image_temp = $_FILES['image_file']['tmp_name']; //file temp

$image_size_info    = getimagesize($image_temp); //get image size

if ($image_size_info) {
    $image_width        = $image_size_info[0]; //image width
    $image_height       = $image_size_info[1]; //image height
    $image_type         = $image_size_info['mime']; //image type
}
else {
    die("Make sure image file is valid!");
}


switch ($image_type) {

    case 'image/png':
        $image_res =  imagecreatefrompng($image_temp);break;

    case 'image/gif':
        $image_res =  imagecreatefromgif($image_temp); break;

    case 'image/jpeg': case 'image/pjpeg':
        $image_res = imagecreatefromjpeg($image_temp); break;

    default:
        $image_res = false; 
}

switch($image_type){

    case 'image/png':
      header('Content-Type: image/png');  
      imagepng($image_res);

    case 'image/gif':
      header('Content-Type: image/gif');
      imagegif($image_res);

    case 'image/jpeg': case 'image/pjpeg':
      header('Content-Type: image/jpeg');
      imagejpeg($image_res);

}

答案 2 :(得分:1)

问题在于你的双引号("),

...
echo '<img src="data:image/png;base64,"'.$data.' alt="" />'; break;
                                      ^ your double quote here is wrong

应该是这样的,

echo '<img src="data:image/png;base64,'.$data.'" alt="" />'; break;
                                               ^ your double quote should be here

另外,我没有看到您使用imagecreatefromXXX()函数的任何原因,它对您的逻辑没有任何影响。

根据您的问题:

  

...想要将上传的图片转换为字符串或其他变量,并使用<img>标记显示

然后你的代码应该是这样的:

<强> HTML

<form action="index.php"  method="post" enctype="multipart/form-data">
<input name="image_file" type="file" />
<input type="submit" name="submit-btn" value="Upload" />
</form>

<强> PHP

if(isset($_POST['submit-btn'])){
    // check $_FILES['ImageFile'] not empty
    if(!isset($_FILES['image_file']) || !is_uploaded_file($_FILES['image_file']['tmp_name'])){
            die('Image file is Missing!'); // output error when above checks fail.
    }

    //uploaded file info
    $image_temp = $_FILES['image_file']['tmp_name']; //file temp

    $image_size_info    = getimagesize($image_temp); //get image size

    if($image_size_info){
        $image_type = $image_size_info['mime']; //image type
    }else{
        die("Make sure image file is valid!");
    } 

    $data = base64_encode(file_get_contents($image_temp));
    switch($image_type){
    case 'image/png':
        echo '<img src="data:image/png;base64,'.$data.'" alt="" />'; break;
    case 'image/gif':
        echo '<img src="data:image/gif;base64,'.$data.'" alt="" />';break;
    case 'image/jpeg': case 'image/pjpeg':
        echo '<img src="data:image/jpeg;base64,'.$data.'" alt="" />';break;
    }   
}