Dalam artikel sebelumnya "Pemasangan dan penggunaan parsing mysql (Koleksi) ", kami mengetahui tentang pemasangan dan penggunaan mysql. Artikel berikut akan membantu anda memahami penukaran bersama antara base64 dan imej dalam JS Ia mempunyai nilai rujukan tertentu. Rakan yang memerlukan saya harap ia akan membantu anda.
Apabila saya menggunakan apicloud
untuk menulis APP hari ini, saya menghadapi masalah base64
memindahkan gambar dan memaparkannya terus pada halaman semasa, kerana Saya telah menggunakan modul " trans
", kerana mengetahui bahawa modul ini boleh menukar imej kepada dan daripada base64
format
, jadi saya menggunakan modul trans
tanpa berfikir, tetapi kemudian saya mendapati bahawa saya boleh' t dapatkan penukaran Untuk menyimpan laluan imej dalam modul trans
, gunakan fs://
, atau anda boleh memilih untuk menyimpan imej ke album sistem
Maafkan saya kerana kekurangan pengetahuan saya 'Tidak tahu cara mendapatkan laluan fs://
, dan kemudian biarkan pengguna melakukannya secara manual Terlalu menyusahkan untuk memilih gambar untuk album
Kemudian saya sedar, bukankah tag img
boleh mengenali secara langsung. aksara base64
dan menukarnya menjadi gambar? ...
Hei, pembangunan saya masih terlalu bergantung pada rangka kerja, modul, pemalam, dsb., dan saya tidak ingat banyak perkara asli
Anda mesti ingat ini untuk pembangunan masa hadapan, saya lampirkan JS
interconversionbase64
dan gambar
var img = "imgurl";//imgurl 就是你的图片路径 function getBase64Image(img) { var canvas = document.createElement("canvas"); canvas.width = img.width; canvas.height = img.height; var ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0, img.width, img.height); var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase(); var dataURL = canvas.toDataURL("image/"+ext); return dataURL; } var image = new Image(); image.src = img; image.onload = function(){ var base64 = getBase64Image(image); console.log(base64); }
Atas ialah kandungan terperinci Analisis ringkas penukaran antara base64 dan imej dalam JS (dengan kod). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!