Kövesd ezt a kidolgozott példát, majd alkalmazd ugyanazokat a vezérlőket a saját képedre. Kép konvertálása Base64 formátumba megnyitása.
Válasszon ki egy képet és tekintse meg az azonosítóját
Nyissa meg a Kép Base64 konvertálót. Válasszon ki egy képet vagy próbáljon ki egy mintát. A példa a 512 × 512 képpontos favicon-orbit.png fájlt használja, amely 202,491 bájtot tartalmaz. A szerkesztő a kód felett jeleníti meg a képet, így megbizonyosodhat arról, hogy a megfelelő eszközt választotta ki.
A(z) PNG, JPG, WebP, GIF, BMP és AVIF formátumok támogatottak, ha a böngészője képes azokat előnézetben megjeleníteni. A maximális fájlméret 25 MB, a korlátok 60 megapixel és oldalanként 16,000 képpont. A(z) SVG jelölőnyelv nem fogadható el ebben a raszteres konvertálóban.
Az eszköz beolvassa az eredeti fájl bájtokat. Nem használja az előnézetet a kép újraépítésére, átméretezésére vagy újratömörítésére. A meglévő metaadatok és a GIF animáció ezért megmarad a kódolt adatokban.
Kódolás előtt használja a Kép átméretezése vagy a Képtömörítő eszközt, ha kisebb fájlra van szüksége. A Base64 önmagában nem csökkenti a kép méretét.
Válassza ki a projektje által elvárt megjelenítést
Nyissa meg a Beállításokat, és válassza a HTML képet a Kódformátum alatt ehhez a példához. Az eredmény egy img címke, amely egy Base64 data URL-t tartalmaz. Az alt attribútum kezdetben üres; írjon hasznos alternatív szöveget, ha a kép információt közvetít.
A Data URL egy olyan előtaggal kezdődik, mint a data:image/png;base64, amelyet a kódolt adatok követnek. A Plain Base64 csak az adatokat tartalmazza. A CSS háttér a data URL-t egy background-image deklarációba csomagolja. Ezek a megjelenítések különböző célokat szolgálnak, ezért az alkalmazása által kért formátumot másolja, ne csak a fájlnevet változtassa meg.
A kódpanel azonnal frissül, miután megváltoztatta a Kódformátumot. A másolás ikon lemásolja az aktuális megjelenítést, és megjeleníti a sikeres másolás megerősítését. Amikor a vágólap elérése le van tiltva, a kód kijelölésre kerül a kézi másoláshoz.
A teljes HTML img tag nem ugyanaz, mint egy adat URL. Csak az src értéket használd, ha egy mező URL-t kér.
A példa ebben az útmutatóban
Próbáljon ki egy mintát: favicon-orbit.png, 512 × 512 px, 202,491 bájt. Válassza a HTML képet a Kód formátum alatt. Válassza a Start lehetőséget, és töltse le a favicon-orbit-base64.txt fájlt.
- Eredeti PNG
- 512 × 512 px · 202,491 bájt
- HTML szöveges kimenet
- 270,029 bájt
- Kódolás
- Eredeti bájtok; nincs újratömörítés
Töltsd le a kódot és értsd meg a méretét
Válaszd a Start, majd a Letöltés lehetőséget. A példa elmenti a(z) favicon-orbit-base64.txt-t, amely tartalmazza a(z) HTML képkódot. A(z) 270,029 bájtja nagyobb, mint a(z) 202,491 bájtos forrás. A cikk összehasonlítása a letöltött szöveg tényleges kezdetét mutatja, amely csak az olvashatóság kedvéért lett rövidítve.
A Base64 jellemzően három forrásbájtot konvertál négy karakterré, körülbelül egyharmaddal növelve a méretet a kis burkolat előtt. Egy kis ikon beágyazása önállóvá teheti a dokumentumot, de nagy képhúrok elhelyezése a(z) HTML-ben vagy CSS-ben szintén megnöveli a dokumentumot, és megakadályozza, hogy a kép külön fájlként legyen gyorsítótárazva.
A kódolás nem titkosítás. Bárki, aki rendelkezik a teljes Base64 karakterlánccal, visszaállíthatja az eredeti képet. Kezeld a kódot ugyanolyan körültekintéssel, mint a forrást, ha az bizalmas információkat tartalmaz.
A cikkben szereplő csonka részlet magyarázó jellegű. Használd a teljes letöltött TXT-t, vagy másold ki a teljes kódot az eszközből.
Gyakori kérdések
A kódolás rontja a képminőséget?
Nem. A kódolás megőrzi az eredeti bájtokat. Nem méretezi át, nem tömöríti és nem rajzolja újra a képet.
Miért nagyobb a Base64 karakterlánc, mint a kép?
A Base64 három bemeneti bájtot négy szöveges karakterrel ábrázol, így általában körülbelül egyharmaddal növeli a méretet a burkolat vagy előtag előtt.
A GIF animációk megmaradnak?
A kódolás megőrzi az eredeti GIF bájtokat, beleértve az animációt is. Az előnézet egy állóképet mutathat, miközben a kódolt adat az összes képkockát tartalmazza.
Biztonságos a Base64 titkos képekhez?
A Base64 nem titkosítás. Tartsd titokban a karakterláncot, ha a mögöttes kép bizalmas. Maga a konvertáló helyben, a böngésződben dolgozza fel az adatokat.
Alakítsd a megfelelő képet a megfelelő kóddá.
Próbálj ki egy mintát vagy használd a saját fájlodat, és ellenőrizd az eredményt a megosztás előtt.
