Base64'ten Resme

Base64 Giriş0 Karakterler

Base64 kodlanmış verileri PNG/JPG/WebP/GIF/SVG dahil 7+ yaygın resim formatında önizlenebilir resme dönüştürün ve indirin. Data URL önekini otomatik olarak tanır, doğrudan tarayıcıda önizleme sunar. API hata ayıklama ve kodlama doğrulaması için uygundur.

İlgili Öneriler

Base64'ten resme dönüştürme nedir?

Base64'ten resme dönüştürme, Base64 kodlamasının ters işlemidir: Base64 kodlu dizeyi orijinal ikili resim verisine (PNG/JPG/WebP/GIF/SVG vb. formatlar) geri yükler ve tarayıcıda doğrudan önizlemenizi veya yerel dosya olarak indirmenizi sağlar. API'lerden dönen resimleri, Data URL biçimindeki satıriçi kaynakları ve e-posta eklerindeki Base64 verilerini işlemek için gerekli bir araçtır.

**Temel prensip:** Base64, ikili verileri 64 yazdırılabilir ASCII karakterine (A-Z, a-z, 0-9, +, /) kodlar. Resme dönüştürme işlemi bu ASCII dizesini orijinal ikili bayt akışına geri çevirir, ardından tarayıcının belirtilen MIME türüne (image/png vb.) göre piksel olarak yorumlayıp görüntülemesini sağlar. Data URL (örneğin `data:image/png;base64,iVBORw0KGgo...`) Base64 + MIME öneki birleşimidir; araç bunu otomatik olarak tanır ve işler.

**Tipik kullanım senaryoları:** ①API hata ayıklama: Birçok API doğrulama kodu, kullanıcı avatarı, elektronik imza gibi resimleri doğrudan Base64 dizesi olarak döndürür, frontend tarafında görüntülemek gerekir; ②Frontend geliştirme: Data URL olarak gömülü küçük simgeler (CSS background-image: url(data:image/png;base64,...)) araca yapıştırılarak gerçek görünümü doğrulanabilir; ③E-posta eki kurtarma: MIME Base64 kodlu ekler orijinal resme geri çözülebilir; ④Web kazıma verileri: Kazınan Base64 resimler yerel dosya olarak kaydedilebilir; ⑤OCR ön işleme: Kod çözüldükten sonra OCR araçlarıyla resim içeriği tanınabilir.

**Desteklenen resim formatları:** Araç tarayıcının yerel olarak tanıdığı tüm resim MIME türlerini destekler: PNG (image/png), JPG/JPEG (image/jpeg), WebP (image/webp), GIF (image/gif), SVG (image/svg+xml), BMP (image/bmp), AVIF (image/avif), ICO (image/x-icon) vb. Her formatın farklı sıkıştırma algoritması ve kullanım alanı vardır: PNG kayıpsızdır simgeler ve ekran görüntüleri için uygundur, JPG kayıplıdır fotoğraflar için uygundur, WebP modern tarayıcılar için önerilir, SVG vektöreldir simge ve logolar için uygundur.

**Kod çözme güvenliği:** Tüm kod çözme işlemleri tarayıcı içinde JavaScript ile gerçekleştirilir (`atob()` + `TextDecoder` veya `Blob` API tabanlı). Resmin ikili verileri hiçbir sunucuya yüklenmez. Hassas bilgi içeren Base64 dizeleri (kullanıcı avatarı, dahili ekran görüntüleri vb.) güvenle kullanılabilir; sayfa kapatıldığında tüm veriler otomatik olarak temizlenir.

Kullanım senaryoları

  • API tarafından döndürülen Base64 resim verilerini önizlenebilir ve indirilebilir resim dosyasına geri yükleme
  • Frontend satıriçi resim kaynaklarının (Data URL biçimi) doğru kodlanıp kodlanmadığını doğrulama
  • Resim yükleme API'sinde hata ayıklarken Base64 içeriğinin eksiksiz olup olmadığını kontrol etme
  • Base64 resmi tasarım veya dokümantasyon için yerel PNG/JPG dosyası olarak kaydetme
  • E-posta eklerindeki Base64 kodlamasını resim olarak geri çözme
  • Web kazıma ile elde edilen Base64 resimleri geri çözüp diske kaydetme
  • Data URL kodunu çözerek SVG simgelerin gerçek render görünümünü doğrulama
  • OCR/AI API'lerinden dönen Base64 resimleri yerel dosya olarak görüntüleme

Nasıl Kullanılır

  1. Base64 kodlu resim verisini yapıştırın (Data URL önekli veya öneksiz, örneğin data:image/png;base64,iVBORw0KG...)
  2. Araç MIME türünü otomatik olarak algılar ve kod çözer (Data URL'den tanır veya içerik başlığından sezilir)
  3. Sağ tarafta anlık olarak resim önizlemesi, dosya boyutu ve boyut bilgileri görüntülenir
  4. 「İndir」düğmesine tıklayarak yerel resim dosyası olarak kaydedin veya resme sağ tıklayıp「Resmi farklı kaydet」seçeneğini kullanın
  5. Kod çözme başarısız olursa MIME türünü manuel olarak belirtebilir veya Base64 Clean aracıyla ön işlem yapabilirsiniz

Özellikler

  • Çevrimiçi resim önizleme: Kod çözüldükten sonra resmi doğrudan tarayıcıda görüntüleyin, yerel olarak indirmenize gerek kalmaz
  • Çoklu format desteği: PNG/JPG/WebP/GIF/SVG/BMP/AVIF dahil 7+ yaygın resim MIME türünü destekler
  • Data URL otomatik tanıma: data:image/png;base64, önekini otomatik olarak ayırır, saf Base64 içeriğini çıkararak kod çözer
  • Saf Base64 girişi: Öneki olmayan saf Base64 dizelerini destekler, MIME türü belirtilebilir
  • Resim dosyası indirme: Kod çözülen resmi tek tıkla yerel PNG/JPG dosyası olarak kaydetme
  • Gerçek zamanlı karakter sayımı: Giriş karakter sayısını ve kod çözülen bayt sayısını anlık gösterir, resim boyutunu değerlendirmeye yardımcı olur
  • Hata tespiti: Kod çözme başarısız olduğunda belirli hata konumunu bildirir (geçersiz Base64 karakteri, yanlış uzunluk, MIME uyuşmazlığı)
  • Tarayıcıda yerel sıfır yükleme: Tüm kod çözme ve önizleme tarayıcı içinde tamamlanır, hiçbir sunucudan geçmez
  • Tam ters uyumluluk:「Resimden Base64'e」aracıyla eşleştirilerek çift yönlü dönüşüm iş akışı oluşturur

Kod Örnekleri

JavaScript: Tarayıcı yerel kod çözme + Blob URL önizleme

javascript

Tarayıcının yerel atob() + TextDecoder + Blob API kullanarak Base64 kodunu çözer ve resmi tarayıcıda görüntüler.

// Base64 → Resim (tarayıcı yerel uygulaması)
function base64ToImage(base64String, mimeType = 'image/png') {
  // 1. Data URL önekini kaldır (varsa)
  const clean = base64String.replace(/^data:image\/\w+;base64,/, '');

  // 2. Tarayıcının yerel atob() ile ikili dizeye kod çöz
  const binary = atob(clean);

  // 3. Uint8Array'e dönüştür
  const bytes = new Uint8Array(binary.length);
  for (let i = 0; i < binary.length; i++) {
    bytes[i] = binary.charCodeAt(i);
  }

  // 4. <img> etiketi önizlemesi için Blob URL oluştur
  const blob = new Blob([bytes], { type: mimeType });
  const url = URL.createObjectURL(blob);

  // 5. img.src ayarlanarak önizleme yapılabilir
  const img = document.createElement('img');
  img.src = url;
  img.onload = () => {
    console.log(`Resim boyutu: ${img.width}x${img.height}`);
    console.log(`Dosya boyutu: ${bytes.byteLength} bytes`);
  };

  return { img, url, size: bytes.byteLength };
}

// Kullanım örneği:
const result = base64ToImage('iVBORw0KGgoAAAANSUhEUgAAAAUA...');
document.body.appendChild(result.img);

// Blob URL'yi serbest bırak (bellek sızıntısını önlemek için)
setTimeout(() => URL.revokeObjectURL(result.url), 60000);

Python: base64 kütüphanesi ile kod çözme ve resim kaydetme

python

Python standart kütüphanesi base64 ile Base64 verisini resim ikili akışına kod çözer, ardından PIL/Pillow veya yerel dosya işlemleriyle kaydeder.

import base64
from pathlib import Path

def base64_to_image(base64_string: str, output_path: str, mime_type: str = 'image/png'):
    """Base64 dizesini kod çözüp resim dosyası olarak kaydeder"""

    # 1. Data URL önekini kaldır
    if base64_string.startswith('data:image'):
        # Biçim: data:image/png;base64,iVBORw0...
        header, base64_string = base64_string.split(',', 1)
        # MIME türünü header'dan otomatik olarak çıkar
        if 'image/' in header:
            mime_type = header.split('data:')[1].split(';')[0]

    # 2. Kod çözme
    image_bytes = base64.b64decode(base64_string)

    # 3. Dosyaya kaydet
    output_file = Path(output_path)
    output_file.parent.mkdir(parents=True, exist_ok=True)
    output_file.write_bytes(image_bytes)

    print(f"✅ Kaydedildi: {output_file}")
    print(f"   Dosya boyutu: {len(image_bytes):,} bytes")
    print(f"   MIME türü: {mime_type}")

    return output_file


# Kullanım örneği:
# 1. API yanıtından alınan Base64 dizesi
api_base64_response = "iVBORw0KGgoAAAANSUhEUgAA..."

# 2. Kod çöz ve kaydet
base64_to_image(api_base64_response, 'output/captcha.png')

# 3. İsteğe bağlı: PIL ile daha fazla işlem yap
try:
    from PIL import Image
    img = Image.open('output/captcha.png')
    print(f"Resim boyutu: {img.size}")
    img.save('output/captcha.png', optimize=True)
except ImportError:
    print('Resim işleme için Pillow yükleyin: pip install Pillow')

Java: java.util.Base64 + ImageIO ile resim kod çözme

java

Java standart kütüphanesi Base64 ile resim ikili akışını kod çözer, ImageIO/BufferedImage ile resim meta verilerini işler.

import java.io.*;
import java.util.Base64;
import javax.imageio.ImageIO;
import java.awt.image.BufferedImage;

public class Base64ToImage {
    public static void main(String[] args) throws Exception {
        String base64String = "iVBORw0KGgoAAAANSUhEUgAA...";
        String mimeType = "image/png";

        // 1. Data URL önekini kaldır (varsa)
        if (base64String.startsWith("data:image")) {
            int commaIdx = base64String.indexOf(',');
            String header = base64String.substring(0, commaIdx);
            base64String = base64String.substring(commaIdx + 1);
            // MIME türünü header'dan çıkar
            if (header.contains("image/")) {
                mimeType = header.substring(header.indexOf("data:") + 5, header.indexOf(";"));
            }
        }

        // 2. Base64 kod çözme
        byte[] imageBytes = Base64.getDecoder().decode(base64String);

        // 3. Dosyaya kaydet
        String extension = mimeType.substring("image/".length());
        File outputFile = new File("output." + extension);
        try (FileOutputStream fos = new FileOutputStream(outputFile)) {
            fos.write(imageBytes);
        }
        System.out.println("✅ Kaydedildi: " + outputFile.getAbsolutePath());
        System.out.println("   Dosya boyutu: " + imageBytes.length + " bytes");

        // 4. (İsteğe bağlı) Resim meta verilerini oku
        ByteArrayInputStream bais = new ByteArrayInputStream(imageBytes);
        BufferedImage image = ImageIO.read(bais);
        if (image != null) {
            System.out.println("Resim boyutu: " + image.getWidth() + "x" + image.getHeight());
        }
    }
}

Sık Sorulan Sorular

Hangi resim formatları destekleniyor?

PNG, JPG, WebP, GIF, SVG, BMP, AVIF, ICO dahil tarayıcının yerel olarak tanıdığı tüm resim MIME türleri desteklenir. Araç Data URL'deki MIME önekine veya giriş özelliklerine göre otomatik olarak belirler veya arayüzden manuel olarak MIME türü seçebilirsiniz. Doğru formatı seçmek tarayıcının resmi doğru kod çözüp görüntülemesini sağlar.

Girişte data:image/png;base64 öneki gerekli mi?

Gerekmez. Araç iki giriş biçimini destekler: ①Saf Base64 dizesi (örneğin iVBORw0KGgoAA...), bu durumda arayüzden MIME türü seçmeniz gerekir (PNG/JPG vb.); ②Data URL biçimi (örneğin data:image/png;base64,iVBORw0KGgo...), bu durumda araç önekteki MIME türünü otomatik olarak tanır ve kod çözer. Her iki giriş biçimi de desteklenir.

Resmi tarayıcıda doğrudan önizleyebilir miyim?

Evet. Kod çözülen resim Blob URL aracılığıyla doğrudan tarayıcıda görüntülenir, çevrimiçi önizleme desteklenir. İçeriğin doğru olduğunu onayladıktan sonra yerel dosya olarak indirebilir veya HTML/CSS gömme için Data URL'yi kopyalayabilirsiniz. Tüm önizleme süreci ağ isteği gerektirmez.

Base64'ten dosya aracıyla arasındaki fark nedir?

Base64'ten resme aracı özellikle resim formatları için optimize edilmiştir: ①MIME türünü otomatik tanır; ②Blob URL ile tarayıcıda doğrudan önizleme; ③MIME türüne göre otomatik dosya uzantısı ayarlar (.png/.jpg vb.); ④Resim boyut bilgilerini gösterir. Base64'ten dosya genel amaçlı bir araçtır, PDF, ZIP, ses vb. herhangi bir ikili dosyanın geri yüklenmesi ve indirilmesi için uygundur.

Kod çözülen resim eksik görünüyorsa ne yapmalıyım?

Olası nedenler: ①Base64 dizesi kesilmiş (uzunluğun tam olup olmadığını kontrol edin); ②MIME türü yanlış belirtilmiş (PNG verisini JPG olarak çözmek gibi); ③Orijinal verinin kendisi bozuk. Öneriler: ①Kaynak Base64'ün tam olduğunu doğrulayın; ②Farklı MIME türleri deneyin; ③Base64 Validate aracıyla geçerliliğini kontrol edin.

Base64 boyutu orijinal resimden ne kadar büyük olur?

Base64 kodlaması orijinal ikili verinin boyutunu yaklaşık %33 artırır (3 bayt → 4 karakter). Örneğin 100KB PNG kodlandıktan sonra yaklaşık 133KB Base64 dizesi olur. Bu nedenle Base64 küçük resimler için uygundur (<10KB); büyük resimler için doğrudan HTTP URL kullanılması önerilir.

SVG vektör resimleri destekleniyor mu?

Evet. SVG XML tabanlı bir vektör resim formatıdır, Base64 kodlandıktan sonra doğrudan HTML <img> veya CSS background-image içine gömülebilir. Kod çözüldükten sonra tarayıcıda vektör olarak işlenir, kayıpsız olarak ölçeklenebilir. Dikkat: SVG içinde JavaScript kodu bulunabilir, kullanırken XSS güvenliğine dikkat edin.

Belirli bir formatta nasıl kaydedebilirim?

Kod çözdükten sonra indirme düğmesine tıklayın, araç kod çözme sırasındaki MIME türüne göre otomatik olarak uygun uzantıyı ekler (image/png → .png, image/jpeg → .jpg). Format dönüşümü gerekirse (PNG → JPG gibi), önce kod çözdükten sonra başka araçlarla (Canvas/ImageMagick vb.) dönüştürmeniz önerilir.

Kod çözülen resim boş veya bozuk görünüyor?

Yaygın nedenler: ①Base64 içinde satır sonu veya boşluklar temizlenmemiş — önce Base64 Clean aracıyla ön işlem yapın; ②padding (=) eksik — bu araç otomatik olarak tamamlar; ③MIME türü orijinal veriyle eşleşmiyor — kaynak API'nin döndürdüğü Content-Type'ı kontrol edin veya diğer MIME türlerini manuel olarak deneyin; ④Kaynak Base64 iletim sırasında kesilmiş — tam dizeyi yeniden alın.

Büyük resimler (>10MB) destekleniyor mu?

Desteklenir, ancak çok büyük resimlerde tarayıcının işleme performansı düşer. 10MB Base64 (yaklaşık 7,5MB orijinal resim) kod çözme genellikle akıcıdır; 50MB'nin üzerinde bellek uyarıları görülebilir. Öneriler: ①Önce base64-clean ile boşlukları temizleyin; ②Büyük resimleri parçalı olarak kod çözün; ③Tarayıcının yeterli belleğe sahip olduğundan emin olun (önerilen 4GB+).

Sorun Giderme

Kod çözülen resim boş görünüyor

MIME türü uyuşmazlığı veya Base64 eksikliği olabilir. Kontrol edin: 1) Kaynak API'nin döndürdüğü Content-Type başlığı; 2) Manuel olarak farklı MIME türleri deneyin; 3) Base64 dizesinin tam olduğunu doğrulayın (uzunluk beklenen değerde).

InvalidCharacterError kod çözme hatası

Base64 dizesi geçersiz karakterler içeriyor (boşluk, satır sonu, Çince karakter vb.). Önce Base64 Clean aracıyla tüm boşlukları ve geçersiz karakterleri temizleyin, ardından dönüştürme yapın.

İndirilen resmin uzantısı yanlış

Kod çözme sırasındaki MIME türünün orijinal resimle aynı olup olmadığını kontrol edin. Kaynak API image/jpeg döndürüyor ama Base64 verisi aslında PNG ise, indikten sonra uzantı .jpg olur ama gerçek format PNG olur. MIME önekinden veya Content-Type başlığından orijinal formatı doğrulamanız önerilir.

Büyük resimleri kod çözerken tarayıcı donuyor

50MB'nin üzerindeki Base64 dizeleri bellek taşmasına neden olabilir. Öneriler: ①Önce base64-clean aracıyla boşluk karakterlerini temizleyin; ②Büyük resimleri parçalı olarak kod çözün (tile bölme gibi); ③Tarayıcının yeterli belleğe sahip olduğundan emin olun (önerilen 4GB+ kullanılabilir bellek); ④Çok büyük resimler için sunucu tarafı Node.js/Python betikleri kullanın.

SVG resim kod çözüldükten sonra görüntülenmiyor

SVG XML tabanlı vektör formatıdır, kod çözüldükten sonra şunlardan emin olun: 1) MIME türü image/svg+xml kullanılıyor; 2) SVG içinde kaçırılmamış özel karakterler olmamalı; 3) Bazı tarayıcılar SVG içindeki JavaScript koduna güvenlik kısıtlamaları uygular. Önce XML ayrıştırma aracıyla SVG geçerliliğini doğrulamanız önerilir.

Sözlük

Base64
İkili verileri 64 ASCII karakterle temsil eden kodlama yöntemi, RFC 4648'de tanımlanmıştır. Bu aracın yaptığı ters işlem: Base64 dizesini orijinal resim ikili verisine geri yüklemek.
Data URL
RFC 2397'de tanımlanan satıriçi URL biçimi: data:image/<MIME>;base64,<veri>. Doğrudan HTML img src veya CSS background-image içinde kullanılabilir. Bu araç öneki otomatik olarak tanır ve ayırır.
MIME türü
İnternet ortam türü, örneğin image/png, image/jpeg. Tarayıcı, bayt akışını resim olarak nasıl yorumlayacağını MIME türüne göre belirler.
PNG
Kayıpsız sıkıştırmalı bitmap formatı, saydamlık kanalını destekler. Genellikle simgeler, ekran görüntüleri ve ayrıntı korunması gereken resimler için kullanılır. Base64'ten sonra boyutu orijinalin yaklaşık 1,33 katı olur.
JPG/JPEG
Kayıplı sıkıştırmalı bitmap formatı, fotoğraflar için uygundur. Yüksek sıkıştırma oranı sunar ancak saydamlığı desteklemez. Base64'ten sonra boyutu orijinalin yaklaşık 1,33 katı olur.
WebP
Google tarafından geliştirilen modern resim formatı, hem kayıplı/kayıpsız sıkıştırmayı hem de saydamlık kanalını destekler. PNG/JPG'den %25-35 daha küçüktür.
Blob (Binary Large Object)
Tarayıcının yerel ikili nesne türü, Base64 kodu çözüldükten sonraki bayt akışını sararak önizleme ve indirme için Blob URL oluşturmak için kullanılır.

8 resim formatı karşılaştırma tablosu

Farklı resim formatlarının farklı sıkıştırma algoritmaları, özellikleri ve kullanım alanları vardır.

FormatMIME türüSıkıştırma türüSaydamlıkTipik kullanım
PNGimage/pngKayıpsızSimge / Ekran görüntüsü / Logo
JPGimage/jpegKayıplıFotoğraf / Manzara resmi
WebPimage/webpKayıplı/KayıpsızModern Web önerisi
GIFimage/gifKayıpsız (256 renk)✅ (1-bit)Küçük animasyon / Basit simge
SVGimage/svg+xmlVektörLogo / Simge / İllüstrasyon
BMPimage/bmpYokİsteğe bağlıWindows sistem resmi
AVIFimage/avifKayıplı/KayıpsızYeni nesil resim formatı
ICOimage/x-iconKayıpsızWeb sitesi favicon

Data URL ve HTTP URL resim yükleme karşılaştırması

Kod çözülen resim Data URL olarak doğrudan HTML/CSS içine gömülebilir, geleneksel HTTP URL ile karşılaştırması.

BoyutData URLHTTP URL
HTTP istek sayısı01
Önbellek yeniden kullanımıZorKolay (CDN / tarayıcı)
BoyutOrijinal + %33Orijinal boyut
Uygun boyut<10 KBHerhangi bir boyut
Sıkıştırılmış iletimHayır (kodlanmış)gzip / Brotli
CSP kısıtlamasıMümkünGenellikle izinli
Sunucu depolamaGerekmezGerekir
Çevrimdışı erişim✅ (dosya düzeyi)❌ (önbellek gerekli)

5 yaygın Base64'ten resme hata referans tablosu

Kod çözme hatasıyla karşılaştığınızda aşağıdaki tabloya göre sorunu hızlıca tespit edin.

Hata görünümüOlası nedenÇözüm
Kod çözme başarısız: InvalidCharacterErrorBoşluk, satır sonu veya Base64 dışı karakterler içeriyorBase64 Clean aracıyla ön işlem yapın
Resim boş görünüyorMIME türü orijinal veriyle eşleşmiyorDoğru MIME türüne geçin (PNG verisi için image/png kullanın)
Resim eksik görünüyorBase64 dizesi kesilmişTam Base64 dizesini yeniden alın
Padding hatasıURL-güvenli Base64 padding'i atlamışBase64 Padding aracıyla = işaretlerini tamamlayın
Tarayıcı bellek taşmasıResim çok büyük (>50MB)Parçalı kod çözün veya resim sıkıştırma aracı kullanın

Authoritative References