Saya cuba mendapatkan Base64 item dan imej pada halaman sedia ada menggunakan javascript

Question

Maaf, saya fikir anda akan faham, kerana utas baharu tidak boleh dimulakan untuk Javascript ini. Memandangkan ini baru

Wah, yang terakhir saya cuba ialah

var main_artwork = this.document.getElementById("np_track_artwork");
var title_album = this.document.getElementById("artwork_tit");
var base64art1 = title_album.src ; // Already base64
var base64art2 = getBase64StringFromDataURL(main_artwork.src);

Ini bukan sahaja mengembalikan asas 64 pada imej daripada SQL, adakah ini kerana ia berada pada pelayan Apache?

RalatDijeda atas pengecualian: tidak ditentukan atau batal

Saya menghadapi masalah cuba menggunakan "Konsol" dalam editor, mungkin ini telah berubah, sila kemas kini halaman anda dan alih keluar yang tidak berfungsi, ini sangat mengecewakan

function fetchbase64(transport2) {
    const image = document.getElementByid(transport2);
    fetch(image.src)
       .then((res) => res.blob())
       .then((blob) => {
           const reader= new FileReader();
           reader.onloadended = () => {
                console.log(reader.result);
                const base64 = getBase64StringFromDataURL(reader.result);
               //console.log(base64);
           };
            reader.readAsDataUrl(Blob);
            return base64;
         });
}

Ralat:

ReferenceError: gumpalan tidak ditakrifkan. Dan jeda pada pengecualian. jadi kenapa Adakah ini bermakna gumpalan tidak boleh dibentuk?

Saya juga sedang mencuba ini di bawah, saya rasa menggunakan onload akan menggantikannya Kandungan imej adalah base64, tetapi ia tidak berbuat demikian dan saya tidak tahu mengapa. saya Juga ambil perhatian bahawa ini sepatutnya menjadi gumpalan imej yang diisytiharkan oleh penyahpepijat Hujahnya ialah 1, tetapi tidak.

Sebelum sesiapa berkata ini, ini tidak membantu, memberikan ralat yang samatiada jawapan Ini nampaknya menjadi norma: Bagaimana untuk menyelesaikan "ralat rujukan tidak ditangkap: gumpalan tidak ditakrifkan"?

Dalam kes ini, elm dinilai sebagai img#np_track_artwork {alt:'Playing Menjejak karya seni', src: 'http://blah.com/now-playing.png, srcset:' Dimensi: '', crossOrigin:null ...} kelihatan seperti gumpalan bagi saya? Jadi saya menulis semula Ia kelihatan baik untuk saya :

function encodeBase64(elm) {
   var file = new blob([JSON.stringify(elm,null,elm.length)],{type:'image/gif'});
   var imgReader = new FileReader();
   imgReader.onloadend = function(){
       console.log('Base64 Format', ImgReader.result);
   }
   imgReader.readAsDataURL(file);
   var main = this.document.getElementById("np_track_artwork");
   main.currentSrc =  "data:image/gif;base64,"+imgReader.readAsDataURL(file);
}
<img onchange="encodeBase64(this);" src="blahmasoganistic.png">


//** so i tried this which also failed to do much at all from some ones
//   site why does this stuff never work dont people believe in taking
//  it down.**
function encodeBase64(elm) {
   var file = elm.files[0];
   var imgReader = new FileReader();
   imgReader.onloadend = function(){
       console.log('Base64 Format', ImgReader.result);
   }
   imgReader.readAsDataURL(file);
   var main = this.document.getElementById("np_track_artwork");
   main.currentSrc =  "data:image/gif;base64,"+imgReader.readAsDataURL(file);
}

Saya juga cenderung mencipta gumpalan baharu sekiranya gumpalan dalam tatasusunan var file = new blob ,elm.toString(),{'image/gif'}); 但这给出了相同的结果参数 1 而不是 imgReader.readADatUrl(file);

Saya menerima mesej yang mengecewakan ini

Anda tidak boleh menghantar soalan baharu sekarang Maaf, kami tidak lagi Terima soalan daripada akaun anda, seperti kebanyakan soalan anda memerlukan penambahbaikan atau berada di luar skop laman web ini. Lihat bantuan Halaman Tengah Mengapa soalan saya tidak lagi diterima? akaun? untuk mengetahui maklumat lanjut.

Tolong jangan buat akaun baharu. Sebaliknya, berusaha untuk meningkatkan anda Edit soalan sedia ada untuk memadankan keperluan tapak Garis panduan dan menangani sebarang maklum balas yang anda terima. anda juga boleh Teruskan menyumbang kepada tapak dengan cara lain, seperti menyunting Jawatan lain untuk memperbaikinya.

Apabila saya cuba bertanya soalan yang berbeza yang tidak berkaitan dengan soalan yang telah saya selesaikan, saya dijanjikan untuk menyiasat tiada apa-apa yang berlaku, saya rasa apa maksudnya menjadi dominan lelaki, anda tidak mahu wanita di sini?

Saya menggunakan JavaScript untuk meletakkan GIF pada latar belakang dan walaupun ini mencipta teks di bawah ia tidak mengemas kini halaman, saya tidak pasti mengapa sesiapa boleh membantu?

Bahagian HTML jadual ialah

Dalam penyahpepijat, jika saya memasukkan pembolehubah dalam konsol, ia mengembalikan perkara berikut dalam object_dj:

Saya juga telah mencuba menggunakannya yang turut mengembalikan kandungan ini sebagai imej latar belakang: ""

object_dj = document.getElementById("DJ");
object_dj.style.backgroundImage = url("images/bandicam-2023-03-31-14-59-01-846.gif");

Saya pun cuba menggunakan url yang betul object_dj.style.backgroundImage = 'http://d.ezyro.com/images/bandicam-2023-03-31-14-59-01-846.gif';object_dj.style.backgroundImage = 'http://d.ezyro.com/images/bandicam-2023-03-31-14-59-01-846.gif';

object_dj.style.backgroundImage masih ""apa yang sedang berlaku saya boleh menetapkannya dengan lembaran gaya

.DJvid {  
   background-image:url("images/background3.png");
   height:250px;
   background-repeat: no-repeat; 
   background-size: 250px,350px;
   background-position: bottom;
   width:400px;
   
 
}

Saya dah cuba yang terbaik. pUrl mendapat url tetapi ia tidak sekali-kali memberikannya kepada object_dj.style.backgroundImage dan memberikannya kepada url() mengembalikan "" pUrl mengandungi url "http://d.ezyro.com/images/ezgif-2- f0284e7093b1 .gif" (bukan URL sebenar). url() nampaknya tidak berfungsi, mungkin kerana ia bukan https tetapi http? :

pImageUrl = "images/bandicam-2023-03-31-14-59-01-846.gif";
pUrl =  baseURL + pImageUrl;
object_dj.style.backgroundImage = pUrl;

Saya cuba lagi sebelum dipadamkan

$('DJ').css("backgroundImage","url(pUrl)");$('DJ').css("backgroundImage","url(pUrl)");

Latar belakang div dalam konsol penyahpepijat masih tidak memberikan apa-apa dan tiada apa-apa perubahan pada skrin

Konsol: object_dj.style.backgroundImage ''

JavaScript yang saya gunakan ialah

object_dj = document.getElementById("DJ");
baseURL = "http://d.ezyro.com/";
object_dj.setAttribute('style', 'background-image: url('+baseURL+'images/ezgif-2-f0284e7093b1.gif)');

P.S Laman web d tidak wujud.

Sekarang dengan langkah ini berfungsi, mesti ada cat semula atau sesuatu yang hilang, mungkin anda boleh membimbing saya untuk membuat kerja ini dengan mengemaskini halaman.

Saya cuba menukar data dengan beberapa sampah:

object_dj.style.opacity=0.99;
setTimeout(()=> {object_dj.style.opacity=''},0);

Imej yang juga telah dicuba dan disahkan:

var imageUrl = "images/bandicam 2023-03-31 14-59-01-846.gif";
const pUrl = new URL(baseURL, imageUrl);
object_dj.style.backgroundImage = `url("${pUrl}")`;

Ralat

VM313:1 Ralat rujukan tidak ditangkap: imageURL tidak ditakrifkan dalam penilaian(penilaian dalam (music_now_playing.php:1:1),:1:1) Pada: 1:1

Saya cuba menambah pembolehubah Ia memutuskan untuk tidak memberikan ralat.

Ini daripada konsol, contoh anda tidak memuatkan url di tapak saya:

bpm
<div class=​"hidden" id=​"#bpm">​196​</div>​
imageUrl
'images/bandicam 2023-03-31 14-59-01-846.gif'
object_dj.style.backgroundImage

pUrl
VM110:1 Uncaught ReferenceError: pUrl is not defined
    at eval (eval at <anonymous> (music_now_playing.php:1:1), <anonymous>:1:1)
    at <anonymous>:1:1
eval @ VM110:1
(anonymous) @ VM96:1
baseURL
'http://d.ezyro.com/'
imageURL
VM147:1 Uncaught ReferenceError: imageURL is not defined
    at eval (eval at <anonymous> (music_now_playing.php:1:1), <anonymous>:1:1)
    at <anonymous>:1:1

Nampaknya imageURL menyebabkan masalah?

Saya juga mencuba: stackflow.com/questions/8840580/force-dom-redraw-refresh-on-mac tetapi tiada jawapan yang berjaya. Adakah terdapat cara baru untuk melakukan ini?

object_dj.scrollBy(0,0); juga tidak membentuknya dan ia tidak dikenali dalam JQuery.fn.redraw()

Answer 1

Dengan mengandaikan pelayan menyediakan imej kepada anda, maka mungkin ia dicache di suatu tempat? Melukis semula atau sebaliknya memaksa render ulang mungkin berfungsi. Cuba ini:

object_dj = document.getElementById("DJ");
baseURL = "http://d.ezyro.com/";
imageUrl = baseURL + "images/ezgif-2-f0284e7093b1.gif";
object_dj.style.backgroundImage = "url(" + imageUrl + ")";
object_dj.parentNode.removeChild(object_dj);
object_dj.parentNode.appendChild(object_dj);