Saya menggunakan alat JavaScript "Canvas2Image" Nihilogic untuk mengonversi gambar kanvas ke gambar PNG. Yang saya butuhkan sekarang adalah untuk mengubah string base64 yang dihasilkan alat ini, menjadi file PNG aktual di server, menggunakan PHP.

Singkatnya, apa yang saya lakukan saat ini adalah membuat file di sisi klien menggunakan Canvas2Image, kemudian mengambil data yang di-encode base64 dan mengirimkannya ke server menggunakan AJAX:

// Generate the image file
var image = Canvas2Image.saveAsPNG(canvas, true);   

image.id = "canvasimage";
canvas.parentNode.replaceChild(image, canvas);

var url = 'hidden.php',
data = $('#canvasimage').attr('src');

$.ajax({ 
    type: "POST", 
    url: url,
    dataType: 'text',
    data: {
        base64data : data
    }
});

Pada titik ini, "hidden.php" menerima blok data yang terlihat seperti data: image / png; base64, iVBORw0KGgoAAAANSUhEUgAABE ...

Mulai saat ini, saya cukup bingung. Dari apa yang saya baca, saya percaya bahwa saya seharusnya menggunakan fungsi imagecreatefromstring PHP , tapi saya tidak yakin bagaimana benar-benar membuat gambar PNG yang sebenarnya dari string yang dikodekan base64 dan menyimpannya di server saya. Tolong bantu!

Anda perlu mengekstrak data gambar base64 dari string itu, mendekodekannya dan kemudian Anda dapat menyimpannya ke disk, Anda tidak perlu GD karena sudah png.

$data = 'data:image/png;base64,AAAFBfj42Pj4';

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

file_put_contents('/tmp/image.png', $data);

Dan sebagai one-liner:

$data = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $data));

Metode yang efisien untuk mengekstraksi, decoding, dan memeriksa kesalahan adalah:

if (preg_match('/^data:image\/(\w+);base64,/', $data, $type)) {
    $data = substr($data, strpos($data, ',') + 1);
    $type = strtolower($type[1]); // jpg, png, gif

    if (!in_array($type, [ 'jpg', 'jpeg', 'gif', 'png' ])) {
        throw new \Exception('invalid image type');
    }

    $data = base64_decode($data);

    if ($data === false) {
        throw new \Exception('base64_decode failed');
    }
} else {
    throw new \Exception('did not match data URI with image data');
}

file_put_contents("img.{$type}", $data);

Coba ini:

file_put_contents('img.png', base64_decode($base64string));

file_put_contents docs

Saya harus mengganti spasi dengan simbol plus str_replace(' ', '+', $img); untuk membuatnya berfungsi.

Ini kode lengkapnya

$img = $_POST['img']; // Your data 'data:image/png;base64,AAAFBfj42Pj4';
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
file_put_contents('/tmp/image.png', $data);

Semoga itu bisa membantu.

Layak untuk mengatakan bahwa topik yang dibahas didokumentasikan dalam RFC 2397 - Skema URL "data" ( https://tools.ietf.org/html/rfc2397 )

Karena PHP ini memiliki cara asli untuk menangani data seperti itu - "data: stream wrapper" ( http://php.net/manual/en/wrappers.data.php )

Jadi Anda dapat dengan mudah memanipulasi data Anda dengan aliran PHP:

$data = 'data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7';

$source = fopen($data, 'r');
$destination = fopen('image.gif', 'w');

stream_copy_to_stream($source, $destination);

fclose($source);
fclose($destination);

Nah solusi Anda di atas tergantung pada gambar menjadi file jpeg. Untuk solusi umum yang saya gunakan

$img = $_POST['image'];
$img = substr(explode(";",$img)[1], 7);
file_put_contents('img.png', base64_decode($img));

Diambil ide @ dre010, saya telah memperluasnya ke fungsi lain yang bekerja dengan semua tipe gambar: PNG, JPG, JPEG atau GIF dan memberikan nama unik ke nama file

Fungsi memisahkan data gambar dan tipe gambar

function base64ToImage($imageData){
    $data = 'data:image/png;base64,AAAFBfj42Pj4';
    list($type, $imageData) = explode(';', $imageData);
    list(,$extension) = explode('/',$type);
    list(,$imageData)      = explode(',', $imageData);
    $fileName = uniqid().'.'.$extension;
    $imageData = base64_decode($imageData);
    file_put_contents($fileName, $imageData);
}

Total keprihatinan:

$data = 'data:image/png;base64,AAAFBfj42Pj4';

// Extract base64 file for standard data
$fileBin = file_get_contents($data);
$mimeType = mime_content_type($data);

// Check allowed mime type
if ('image/png'==$mimeType) {
    file_put_contents('name.png', $fileBin);
}

http://php.net/manual/en/wrappers.data.php

http://php.net/manual/en/function.mime-content-type.php

Solusi satu linier.

$base64string = 'data:image/png;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7';
file_put_contents('img.png', base64_decode(explode(',',$base64string)[1]));

berdasarkan contoh drew010 saya membuat contoh untuk memudahkan pemahaman.

imagesaver("data:image/jpeg;base64,/9j/4AAQSkZJ"); //use full base64 data 

function imagesaver($image_data){

    list($type, $data) = explode(';', $image_data); // exploding data for later checking and validating 

    if (preg_match('/^data:image\/(\w+);base64,/', $image_data, $type)) {
        $data = substr($data, strpos($data, ',') + 1);
        $type = strtolower($type[1]); // jpg, png, gif

        if (!in_array($type, [ 'jpg', 'jpeg', 'gif', 'png' ])) {
            throw new \Exception('invalid image type');
        }

        $data = base64_decode($data);

        if ($data === false) {
            throw new \Exception('base64_decode failed');
        }
    } else {
        throw new \Exception('did not match data URI with image data');
    }

    $fullname = time().$type;

    if(file_put_contents($fullname, $data)){
        $result = $fullname;
    }else{
        $result =  "error";
    }
    /* it will return image name if image is saved successfully 
    or it will return error on failing to save image. */
    return $result; 
}

coba ini...

$file = $_POST['file']; //your data in base64 'data:image/png....';
$img = str_replace('data:image/png;base64,', '', $file);
file_put_contents('img/imag.png', base64_decode($img));

Kode ini berfungsi untuk saya, periksa kode di bawah ini:

<?php
define('UPLOAD_DIR', 'images/');
$image_parts = explode(";base64,", $_POST['image']);
$image_type_aux = explode("image/", $image_parts[0]);
$image_type = $image_type_aux[1];
$image_base64 = base64_decode($image_parts[1]);
$file = UPLOAD_DIR . uniqid() . '.png';
file_put_contents($file, $image_base64);
?>

Fungsi ini seharusnya berfungsi. ini memiliki parameter foto yang menahan string base64 dan juga path ke direktori gambar yang sudah ada seandainya Anda sudah memiliki gambar yang sudah ada yang ingin Anda batalkan tautannya saat menyimpan yang baru.

 public function convertBase64ToImage($photo = null, $path = null) {
    if (!empty($photo)) {
        $photo = str_replace('data:image/png;base64,', '', $photo);
        $photo = str_replace(' ', '+', $photo);
        $photo = str_replace('data:image/jpeg;base64,', '', $photo);
        $photo = str_replace('data:image/gif;base64,', '', $photo);
        $entry = base64_decode($photo);
        $image = imagecreatefromstring($entry);

        $fileName = time() . ".jpeg";
        $directory = "uploads/customer/" . $fileName;

        header('Content-type:image/jpeg');

        if (!empty($path)) {
            if (file_exists($path)) {
                unlink($path);
            }
        }

        $saveImage = imagejpeg($image, $directory);

        imagedestroy($image);

        if ($saveImage) {
            return $fileName;
        } else {
            return false; // image not saved
        }
    }
}

Itu mudah :

Bayangkan Anda mencoba mengunggah file ke dalam kerangka js, permintaan ajax, atau aplikasi seluler (sisi Klien)

1. Pertama Anda mengirim atribut data yang berisi string yang disandikan base64.
2. Di sisi server Anda harus men-decode dan menyimpannya di folder proyek lokal.

Berikut cara melakukannya menggunakan PHP

<?php 

$base64String = "kfezyufgzefhzefjizjfzfzefzefhuze"; // I put a static base64 string, you can implement you special code to retrieve the data received via the request.

$filePath = "/MyProject/public/uploads/img/test.png";

file_put_contents($filePath, base64_decode($base64String));

?>

Jika Anda ingin mengubah nama gambar secara acak, dan menyimpan jalur gambar pada basis data sebagai gumpalan dan gambar itu sendiri di folder solusi ini akan membantu Anda. Pengguna situs web Anda dapat menyimpan gambar sebanyak yang mereka inginkan sementara gambar akan diganti secara acak untuk tujuan keamanan.

Kode php

Hasilkan varchars acak untuk digunakan sebagai nama gambar.

function genhash($strlen) {
        $h_len = $len;
        $cstrong = TRUE;
        $sslkey = openssl_random_pseudo_bytes($h_len, $cstrong);
        return bin2hex($sslkey);
}
$randName = genhash(3); 
#You can increase or decrease length of the image name (1, 2, 3 or more).

Dapatkan ekstensi data gambar dan bagian base_64 (bagian setelah data: image / png; base64,) dari gambar.

$pos  = strpos($base64_img, ';');
$imgExten = explode('/', substr($base64_img, 0, $pos))[1];
$extens = ['jpg', 'jpe', 'jpeg', 'jfif', 'png', 'bmp', 'dib', 'gif' ];

if(in_array($imgExten, $extens)) {

   $imgNewName = $randName. '.' . $imgExten;
   $filepath = "resources/images/govdoc/".$imgNewName;
   $fileP = fopen($filepath, 'wb');
   $imgCont = explode(',', $base64_img);
   fwrite($fileP, base64_decode($imgCont[1]));
   fclose($fileP);

}

# => $filepath <= This path will be stored as blob type in database.
# base64_decoded images will be written in folder too.

# Please don't forget to up vote if you like my solution. :)

PHP sudah memiliki base64 perlakuan yang adil -> transformasi file

Saya menggunakan untuk menyelesaikannya dengan cara ini:

$blob=$_POST['blob']; // base64 coming from an url, for example
$blob=file_get_contents($blob);
$fh=fopen("myfile.png",'w'); // be aware, it'll overwrite!
fwrite($fh,$blob);
fclose($fh);
echo '<img src=myfile.png>'; // just for the check