Base64 vaizdo dekoderis ir peržiūros priemonė | Paversti Base64 į vaizdus

Iš karto dekoduokite ir peržiūrėkite base64 koduotus vaizdo eilutes. Palaiko JPEG, PNG, GIF ir kitas įprastas formatos su klaidų tvarkymu neteisingiems įvedimams.

Base64 vaizdo dekoderis ir peržiūros įrankis

Įklijuokite base64 koduotą vaizdo eilutę ir dekoduokite ją, kad pamatytumėte vaizdą.

Vaizdo peržiūra

Nėra vaizdo, kurį būtų galima rodyti. Įklijuokite base64 eilutę, kad ją automatiškai dekoduotumėte.

Palaiko JPEG, PNG, GIF ir kitas įprastas vaizdo formatos.

Nurodymai

1. Įklijuokite base64 koduotą vaizdo eilutę teksto lauke aukščiau.

2. Vaizdas bus automatiškai dekoduojamas, kai rašysite, arba paspauskite mygtuką 'Dekoduoti vaizdą'.

3. Dekoduotas vaizdas pasirodys peržiūros srityje žemiau.

Pastaba: eilutė turėtų prasidėti 'data:image/' geriausiems rezultatams, tačiau įrankis bandys dekoduoti eilutes be šio prefikso.

📚

Dokumentacija

Base64 vaizdo dekoderis ir peržiūros priemonė

Įvadas

Base64 yra dvejetainio į tekstą kodavimo schema, kuri atvaizduoja dvejetainius duomenis ASCII eilutės formatu. Ji dažnai naudojama įterpti vaizdo duomenis tiesiai į HTML, CSS, JavaScript, JSON ir kitus tekstinius formatus, kuriuose dvejetainiai duomenys negali būti tiesiogiai įtraukti. Ši priemonė leidžia jums dekoduoti base64 koduotas vaizdo eilutes ir tiesiogiai peržiūrėti rezultatus savo naršyklėje.

Base64 kodavimas padidina duomenų dydį maždaug 33% palyginti su originaliu dvejetainiu, tačiau leidžia vaizdus įtraukti tiesiai į tekstinius dokumentus, nereikalaujant atskirų failų atsisiuntimų. Tai gali būti ypač naudinga mažiems vaizdams, pavyzdžiui, ikonoms, logotipams ar paprastoms grafikoms, kur įterpimo patogumas viršija dydžio padidėjimą.

Mūsų Base64 vaizdo dekoderio įrankis suteikia paprastą sąsają, kur galite įklijuoti base64 koduotą vaizdo eilutę ir akimirksniu pamatyti dekoduotą vaizdą. Jis palaiko visus įprastus vaizdo formatus, įskaitant JPEG, PNG, GIF, WebP ir SVG, ir gali apdoroti tiek duomenų URL formatą (su data:image/... prefiksu), tiek žalius base64 eilutes.

Techniniai duomenys

Base64 kodavimo formatas

Base64 kodavimas konvertuoja dvejetainius duomenis į 64 ASCII simbolių rinkinį (A-Z, a-z, 0-9, + ir /), o = naudojamas kaip užpildymas. Internetiniams vaizdams base64 duomenys paprastai yra formatuojami kaip duomenų URL su šia struktūra:

1data:[<media type>][;base64],<data>
2

Pavyzdžiui, base64 koduotas PNG vaizdas gali atrodyti taip:

1data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
2

Šios struktūros komponentai yra:

data: - URL schema
image/png - Duomenų MIME tipas
;base64 - Kodavimo metodas
, - Skirtukas tarp antraštės ir duomenų
Tikrieji base64 koduoti duomenys

Dekodavimo procesas

Dekoduojant base64 vaizdo eilutę, vyksta šie žingsniai:

Eilutė analizuojama, kad būtų nustatyta, ar ji turi duomenų URL prefiksą
Jei prefiksas egzistuoja, MIME tipas išskiriamas, kad būtų nustatytas vaizdo formatas
Base64 duomenų dalis izoliuojama ir dekoduojama į dvejetainius duomenis
Dvejetainiai duomenys konvertuojami į Blob arba objektų URL, kurie gali būti rodomi kaip vaizdas

Jei įvestis neturi duomenų URL prefikso, dekoderis bando ją traktuoti kaip žalius base64 duomenis ir nustato vaizdo tipą iš dekoduoto dvejetainio antraštės arba numato kaip PNG.

Palaikomi vaizdo formatai

Šis įrankis palaiko visus įprastus interneto vaizdo formatus:

Formatas	MIME tipas	Tipinės naudojimo atvejai
JPEG	image/jpeg	Nuotraukos, sudėtingi vaizdai su daug spalvų
PNG	image/png	Vaizdai, reikalaujantys skaidrumo, ekrano nuotraukos, grafika
GIF	image/gif	Paprastos animacijos, ribotos spalvų vaizdai
WebP	image/webp	Modernus formatas su geresniu suspaudimu nei JPEG/PNG
SVG	image/svg+xml	Vektorinė grafika, skalabilūs ikonai ir iliustracijos

Naudojimo atvejai

Base64 koduoti vaizdai turi kelias praktines programas interneto kūrime ir ne tik:

Vaizdų įterpimas į HTML/CSS/JS: Sumažina HTTP užklausas, įtraukiant vaizdus tiesiai į jūsų kodą, kas gali pagerinti puslapio įkėlimo laiką mažiems vaizdams.
El. pašto šablonai: Užtikrina, kad vaizdai tinkamai rodomi el. pašto klientuose, kurie pagal numatytuosius nustatymus blokuoja išorinius vaizdus.
Vieno failo programos: Sukuria savarankiškas HTML programas, kur visos ištekliai yra įterpti į vieną failą.
API atsakymai: Įtraukia vaizdo duomenis tiesiai į JSON atsakymus, nereikalaujant atskirų vaizdo galinių taškų.
Duomenų URI CSS: Įterpia mažus ikonų ir fono vaizdus tiesiai į CSS failus.
Kanvas manipuliacijos: Palengvina kanvas vaizdo duomenų išsaugojimą ir perdavimą.
Offline programos: Išsaugo vaizdus kaip teksto eilutes localStorage arba IndexedDB.

Našumo apsvarstymai

Nors base64 kodavimas siūlo patogumą, jis turi ir trūkumų:

Padidėjęs failo dydis: Base64 kodavimas padidina duomenų dydį maždaug 33%.
Nėra naršyklės talpinimo: Įterpti vaizdai negali būti talpinami atskirai kaip išoriniai vaizdo failai.
Analizės perteklius: Naršyklės turi dekoduoti base64 eilutę prieš ją atvaizduodamos.
Priežiūros iššūkiai: Įterpti vaizdai yra sunkiau atnaujinami nei nuorodų failai.

Dėl optimalaus našumo base64 kodavimas paprastai rekomenduojamas tik mažiems vaizdams (mažesniems nei 10KB). Dideliems vaizdams paprastai geriau naudoti atskirus failus, kurie gali būti tinkamai talpinami ir optimizuoti.

Alternatyvos

Yra keletas alternatyvų base64 kodavimui, skirtų skirtingiems naudojimo atvejams:

SVG tiesioginis įterpimas: Vektorinėms grafikoms tiesioginis SVG dažnai suteikia geresnį našumą ir lankstumą nei base64 koduotas SVG.
WebP ir modernūs vaizdo formatai: Šie suteikia geresnį suspaudimą nei base64 koduoti JPEG/PNG.
Vaizdų sprite'ai: Sujungia kelis mažus vaizdus į vieną failą ir naudoja CSS pozicionavimą.
CDN (Turinio pristatymo tinklai): Produkcijos svetainėms optimizuotų vaizdų teikimas iš CDN dažnai yra efektyvesnis.
Duomenų suspaudimas: Didelių dvejetainių duomenų kiekių perdavimui specializuoti suspaudimo algoritmai, tokie kaip gzip arba Brotli, yra efektyvesni nei base64.

Kodo pavyzdžiai

Štai pavyzdžiai, kaip dirbti su base64 koduotais vaizdais įvairiose programavimo kalbose:

1// Konvertuoti vaizdą į base64 JavaScript (naršyklė)
2function imageToBase64(imgElement) {
3  const canvas = document.createElement('canvas');
4  canvas.width = imgElement.width;
5  canvas.height = imgElement.height;
6  
7  const ctx = canvas.getContext('2d');
8  ctx.drawImage(imgElement, 0, 0);
9  
10  // Gauti kaip duomenų URL (base64 eilutė)
11  return canvas.toDataURL('image/png');
12}
13
14// Rodyti base64 vaizdą
15function displayBase64Image(base64String) {
16  const img = new Image();
17  
18  // Tvarkyti eilutes be duomenų URL prefikso
19  if (!base64String.startsWith('data:')) {
20    base64String = `data:image/png;base64,${base64String}`;
21  }
22  
23  img.src = base64String;
24  document.body.appendChild(img);
25}
26

1import base64
2from PIL import Image
3from io import BytesIO
4
5# Konvertuoti vaizdo failą į base64
6def image_to_base64(image_path):
7    with open(image_path, "rb") as image_file:
8        encoded_string = base64.b64encode(image_file.read())
9        return encoded_string.decode('utf-8')
10
11# Konvertuoti base64 į vaizdą ir išsaugoti
12def base64_to_image(base64_string, output_path):
13    # Pašalinti duomenų URL prefiksą, jei jis yra
14    if ',' in base64_string:
15        base64_string = base64_string.split(',')[1]
16    
17    image_data = base64.b64decode(base64_string)
18    image = Image.open(BytesIO(image_data))
19    image.save(output_path)
20
21# Pavyzdžio naudojimas
22base64_str = image_to_base64("input.jpg")
23print(f"data:image/jpeg;base64,{base64_str[:30]}...") # Atspausdinti eilutės pradžią
24
25base64_to_image(base64_str, "output.jpg")
26

1<?php
2// Konvertuoti vaizdo failą į base64 PHP
3function imageToBase64($path) {
4    $type = pathinfo($path, PATHINFO_EXTENSION);
5    $data = file_get_contents($path);
6    return 'data:image/' . $type . ';base64,' . base64_encode($data);
7}
8
9// Konvertuoti base64 į vaizdą ir išsaugoti
10function base64ToImage($base64String, $outputPath) {
11    // Išskirti base64 koduotus dvejetainius duomenis
12    $imageData = explode(',', $base64String);
13    $imageData = isset($imageData[1]) ? $imageData[1] : $imageData[0];
14    
15    // Dekoduoti ir išsaugoti
16    $data = base64_decode($imageData);
17    file_put_contents($outputPath, $data);
18}
19
20// Pavyzdžio naudojimas
21$base64Image = imageToBase64('input.jpg');
22echo substr($base64Image, 0, 50) . "...\n"; // Atspausdinti eilutės pradžią
23
24base64ToImage($base64Image, 'output.jpg');
25?>
26

1import java.io.File;
2import java.io.FileOutputStream;
3import java.io.IOException;
4import java.nio.file.Files;
5import java.util.Base64;
6
7public class Base64ImageUtil {
8    
9    // Konvertuoti vaizdo failą į base64
10    public static String imageToBase64(String imagePath) throws IOException {
11        File file = new File(imagePath);
12        byte[] fileContent = Files.readAllBytes(file.toPath());
13        String extension = imagePath.substring(imagePath.lastIndexOf(".") + 1);
14        String base64String = Base64.getEncoder().encodeToString(fileContent);
15        
16        return "data:image/" + extension + ";base64," + base64String;
17    }
18    
19    // Konvertuoti base64 į vaizdą ir išsaugoti
20    public static void base64ToImage(String base64String, String outputPath) throws IOException {
21        // Pašalinti duomenų URL prefiksą, jei jis yra
22        if (base64String.contains(",")) {
23            base64String = base64String.split(",")[1];
24        }
25        
26        byte[] decodedBytes = Base64.getDecoder().decode(base64String);
27        
28        try (FileOutputStream fos = new FileOutputStream(outputPath)) {
29            fos.write(decodedBytes);
30        }
31    }
32    
33    public static void main(String[] args) throws IOException {
34        String base64Image = imageToBase64("input.jpg");
35        System.out.println(base64Image.substring(0, 50) + "..."); // Atspausdinti eilutės pradžią
36        
37        base64ToImage(base64Image, "output.jpg");
38    }
39}
40

1using System;
2using System.IO;
3using System.Text.RegularExpressions;
4
5class Base64ImageConverter
6{
7    // Konvertuoti vaizdo failą į base64
8    public static string ImageToBase64(string imagePath)
9    {
10        byte[] imageBytes = File.ReadAllBytes(imagePath);
11        string base64String = Convert.ToBase64String(imageBytes);
12        
13        string extension = Path.GetExtension(imagePath).TrimStart('.').ToLower();
14        return $"data:image/{extension};base64,{base64String}";
15    }
16    
17    // Konvertuoti base64 į vaizdą ir išsaugoti
18    public static void Base64ToImage(string base64String, string outputPath)
19    {
20        // Pašalinti duomenų URL prefiksą, jei jis yra
21        if (base64String.Contains(","))
22        {
23            base64String = base64String.Split(',')[1];
24        }
25        
26        byte[] imageBytes = Convert.FromBase64String(base64String);
27        File.WriteAllBytes(outputPath, imageBytes);
28    }
29    
30    static void Main()
31    {
32        string base64Image = ImageToBase64("input.jpg");
33        Console.WriteLine(base64Image.Substring(0, 50) + "..."); // Atspausdinti eilutės pradžią
34        
35        Base64ToImage(base64Image, "output.jpg");
36    }
37}
38

1require 'base64'
2
3# Konvertuoti vaizdo failą į base64
4def image_to_base64(image_path)
5  extension = File.extname(image_path).delete('.')
6  base64_data = Base64.strict_encode64(File.read(image_path))
7  "data:image/#{extension};base64,#{base64_data}"
8end
9
10# Konvertuoti base64 į vaizdą ir išsaugoti
11def base64_to_image(base64_string, output_path)
12  # Pašalinti duomenų URL prefiksą, jei jis yra
13  if base64_string.include?(',')
14    base64_string = base64_string.split(',')[1]
15  end
16  
17  File.open(output_path, 'wb') do |file|
18    file.write(Base64.decode64(base64_string))
19  end
20end
21
22# Pavyzdžio naudojimas
23base64_image = image_to_base64('input.jpg')
24puts base64_image[0, 50] + '...' # Atspausdinti eilutės pradžią
25
26base64_to_image(base64_image, 'output.jpg')
27

1' Excel VBA funkcija, skirta koduoti failą į base64
2Function FileToBase64(filePath As String) As String
3    Dim fileNum As Integer
4    Dim fileData() As Byte
5    Dim objXML As Object
6    Dim objNode As Object
7    
8    fileNum = FreeFile
9    Open filePath For Binary Access Read As fileNum
10    ReDim fileData(LOF(fileNum) - 1)
11    Get fileNum, , fileData
12    Close fileNum
13    
14    Set objXML = CreateObject("MSXML2.DOMDocument")
15    Set objNode = objXML.createElement("b64")
16    
17    objNode.DataType = "bin.base64"
18    objNode.nodeTypedValue = fileData
19    
20    FileToBase64 = objNode.Text
21    
22    Set objNode = Nothing
23    Set objXML = Nothing
24End Function
25
26' Naudojimas Excel:
27' =FileToBase64("C:\path\to\image.jpg")
28

HTML įgyvendinimas

Štai kaip tiesiogiai įterpti base64 vaizdą į HTML:

1<!-- Tiesioginis base64 vaizdo įterpimas į HTML -->
2<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Base64 koduotas vaizdas">
3
4<!-- Naudojant CSS su base64 fono vaizdu -->
5<style>
6.base64-bg {
7  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==');
8  width: 100px;
9  height: 100px;
10}
11</style>
12<div class="base64-bg"></div>
13

Istorija

Base64 kodavimas turi savo šaknis elektroninio pašto sistemų kūrime 1970-aisiais. Jis buvo sukurtas siekiant išspręsti dvejetainių duomenų perdavimo problemą per sistemas, kurios buvo sukurtos tik ASCII tekstui apdoroti.

Kodavimo schema buvo formalizuota 1987 m. paskelbus RFC 989, kuri apibrėžė Privatumo pagerinto pašto (PEM) standartą. Vėliau jis buvo atnaujintas RFC 1421 ir kituose susijusiuose standartuose. Terminas "base64" atsirado todėl, kad kodavimas naudoja 64 skirtingus ASCII simbolius dvejetainiams duomenims atvaizduoti.

Interneto kūrimo kontekste base64 koduotų vaizdų naudojimas tapo populiarus kartu su duomenų URI atsiradimu, kurie pirmą kartą buvo pasiūlyti RFC 2397 1998 m. Tai leido dvejetainius duomenis įtraukti tiesiai į HTML, CSS ir kitus internetinius dokumentus.

Base64 koduotų vaizdų naudojimas interneto kūrime tapo plačiai paplitęs 2000-ųjų viduryje, kai kūrėjai siekė būdų sumažinti HTTP užklausas ir pagerinti puslapio įkėlimo laiką. Ši technika ypač buvo priimta augant mobiliam interneto kūrimui, kur minimizuoti užklausas buvo svarbu našumui lėtesniais mobiliųjų ryšių tinklais.

Šiandien base64 kodavimas išlieka svarbiu įrankiu interneto kūrime, nors jo naudojimas tapo labiau tikslingas, kai geriausios praktikos išsivystė. Šiuolaikiniai požiūriai dažnai naudoja base64 kodavimą selektyviai mažiems, kritiniams vaizdams, tuo tarpu didesniems ištekliams naudojami efektyvesni pristatymo metodai, tokie kaip HTTP/2.

Nuorodos

💬

Atsiliepimai

💬

Spauskite atsiliepimų pranešimą, kad pradėtumėte palikti atsiliepimą apie šį įrankį

🔗

Susiję įrankiai

Atraskite daugiau įrankių, kurie gali būti naudingi jūsų darbo procesui

Skaičių Bazės Konverteris: Dvejetainė, Dešimtainė, Šešiakampė ir Pasirinktinių Bazės

Išbandykite šį įrankį

Atsitiktinių CPF numerių generatorius testavimui

Išbandykite šį įrankį

JavaScript Minifikatorius: Sumažinkite Kodo Dydį Neprarandant Funkcionalumo

Išbandykite šį įrankį

Base64 vaizdo dekoderis ir peržiūros priemonė | Paversti Base64 į vaizdus

Base64 vaizdo dekoderis ir peržiūros įrankis

Vaizdo peržiūra

Nurodymai

Dokumentacija

Base64 vaizdo dekoderis ir peržiūros priemonė

Įvadas

Techniniai duomenys

Base64 kodavimo formatas

Dekodavimo procesas

Palaikomi vaizdo formatai

Naudojimo atvejai

Našumo apsvarstymai

Alternatyvos

Kodo pavyzdžiai

HTML įgyvendinimas

Istorija

Nuorodos

Atsiliepimai

Susiję įrankiai

Base64 koduotojas ir dekoduotojas: tekstas į/nuo Base64

Dvejetainis-dešimtainis konverteris: konvertuokite tarp skaičių sistemų

IBAN generatorius ir validatorius testavimui bei patikrai

CSS Minifikavimo Įrankis: Optimizuokite ir Suspauskite CSS Kodą Internete

Skaičių Bazės Konverteris: Dvejetainė, Dešimtainė, Šešiakampė ir Pasirinktinių Bazės

Atsitiktinių CPF numerių generatorius testavimui

JavaScript Minifikatorius: Sumažinkite Kodo Dydį Neprarandant Funkcionalumo