Gunakan Pengepas Imej Kepada Data URI / Base64

Saiz fail maksimum: 20 MB
Seret imej anda ke sini
atau klik untuk melayari
Lihat imej
JPG, PNG, GIF, WebP, BMP, SVG, AVIF
Petua: Data URI termasuk awalan MIME; Base64 sahaja ialah muatan kasar.
2.38K
Masa Digunakan
1.83K
Jumlah Pengguna
5+ tahun-tahun
Dihidangkan
Terakhir disemak pada 4 hari yang lepas. Nombor penggunaan dikemas kini semasa audit berkala. (Pelaporan sejak 21 Feb 2022)
Laporkan ketidakpadanan

Baca Kandungan

Pelajari cara alat ini berfungsi dan bila hendak menggunakannya.

Tukar berbilang fail Imej anda kepada format Data Uri dan base64 secara dalam talian dan percuma. 

Pengepas Imej Kepada Data URI / Base64

Pengepas imej kepada data URI / Base64 ialah alat berguna yang membolehkan anda menukar imej kepada rentetan teks dengan cepat dan mudah yang boleh digunakan dalam halaman web atau aplikasi dalam talian lain. Jenis pengepas ini berguna apabila anda perlu membenamkan imej ke dalam kod anda tetapi tidak mahu menggunakan perkhidmatan pengehosan fail luaran.


 

Apakah Sistem Pengekodan Imej kepada Base64

Pernahkah anda perlu menukar imej kepada url data atau rentetan base 64?

Imej kepada Base64 ialah sistem pengekodan imej yang menukar sebarang imej kepada format teks yang tidak boleh dibaca tanpa kehilangan data, teks berkod Base64 yang dijana mengandungi tanda tambah, garis miring, sama, huruf Latin, dan digit.

Pengekodan Base64 ialah cara yang sangat berguna untuk menyimpan maklumat binari dalam format teks. Matlamatnya adalah untuk mewakili data binari (seperti imej, bunyi, klip video) menggunakan aksara ASCII (huruf abjad + nombor).

Mengapa Data URI / Base64?

Imej boleh ditukar kepada rentetan base64 menggunakan kaedah yang dipanggil data URI. Ini membolehkan kita mencipta URL untuk imej yang kemudiannya boleh dimasukkan dalam halaman web. Proses ini melibatkan penukaran fail asal kita kepada tatasusunan bait (kumpulan bait). Kemudian kita boleh menyekod tatasusunan bait kita kepada rentetan berkod base64.

Data URI memberikan beberapa faedah berbanding fail tempatan. Ia menjimatkan ruang dalam cache klien (pelayar), lebih kecil saiznya daripada imej biasa, dan membolehkan laman web menyajikan imej lebih besar dengan penggunaan lebar jalur yang kurang. Rentetan Base 64 juga lebih mudah dibaca, kerana ia boleh dilihat dengan mudah menggunakan editor teks biasa.

Dengan data URI, anda boleh membenamkan imej terus ke dalam kod HTML anda, tanpa perlu memuatkan fail luaran. Ini boleh mempercepatkan masa muat halaman anda, dan ia sebenarnya agak mudah dilakukan. Dalam artikel ini, kami akan menunjukkan kepada anda cara menukar imej kepada data URI dalam beberapa saat.

Cara Menukar Imej kepada Base64 Encoded / Data URI dalam Beberapa Saat

Pernahkah anda tertanya-tanya bagaimana untuk menjadikan imej dimuat lebih cepat di laman web anda? Satu cara untuk melakukannya adalah dengan menggunakan data URI. Cuma Seret & Lepak atau Muat naik imej anda secara manual dari peranti anda atau dengan menampal URL imej dari web, anda boleh menukar imej sasaran anda kepada format teks Base64 / Data URI .

Contoh Imej kepada Base64 Encoded

Base64 Encoded Output untuk imej adalah seperti data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD//gA7Q1JFQVRPUjogZ2QtanBlZyB2MS4wICh1c2luZyBJSkcgSlBFRyB2OTApLC....

Kegunaan Imej kepada Base64 Encoded

Untuk Sumber Imej (img src):

< img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD//gA7Q1JFQVRPUjogZ2QtanBlZyB2MS4wICh1c2luZyBJSkcgSlBFRyB2OTApLC..." />

Untuk URL Imej Latar Belakang (background-image: url):

background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD//gA7Q1JFQVRPUjogZ2QtanBlZyB2MS4wICh1c2luZyBJSkcgSlBFRyB2OTApLC...")

Cara menggunakan Data URI / Base64

Untuk menggunakan pengepas Data URI / Base64, cuma salin dan tampal kod yang dijana ke dalam projek anda di mana anda mahu imej benamkan muncul. Pastikan jangan buang sebarang pemisah baris atau ruang dalam kod kerana ia perlu untuk pemformatan paparan yang betul. Anda mungkin juga perlu mengubah suai beberapa tetapan bergantung pada cara anda merancang untuk menggunakan imej yang ditukar - seperti menukar dimensi mereka atau menambah sempadan/jarak di sekeliling mereka

Komen (0)

Untuk perbincangan pengguna, kes sempadan, dan petua susulan.
Tinggalkan komen
Komen anda akan dipaparkan secara terbuka selepas dihantar.
Tiada komen lagi. Jadilah yang pertama untuk memberi komen!
Beritahu kami!
Laporkan masalah dengan alat ini

Terangkan masalah yang anda hadapi supaya kami dapat menyiasat dan memperbaiki alat tersebut.

Apa yang paling membantu
Sertakan input, hasil yang dijangkakan, hasil sebenar, pelayar/peranti, dan tangkapan skrin jika membantu.
Butang tangkapan skrin merakam halaman dalam pelayar dan melampirkan imej yang dijana pada borang ini.
Skrinshot penuh halaman
Captured in your browser with newisty.
Tiada tangkapan skrin yang diambil lagi.
Alat Laporan