J'essaie d'obtenir le Base64 des éléments et des images sur une page existante en utilisant javascript

Question

Désolé, je pensais que vous comprendriez, car un nouveau fil de discussion ne peut pas être démarré pour ce Javascript. Compte tenu de cette nouveauté

Wow, le dernier que j'ai essayé était

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);

Cela ne renverra pas seulement la base 64 sur l'image de SQL, est-ce parce qu'elle se trouve sur le serveur Apache ?

ErreurPause en cas d'exception : non défini ou nul

J'ai eu des problèmes en essayant d'utiliser la "Console" dans l'éditeur, peut-être que cela a changé, veuillez mettre à jour votre page et supprimer ce qui ne fonctionne pas, c'est tellement frustrant

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;
         });
}

Erreur :

ReferenceError : le blob n'est pas défini. Et faites une pause en cas d'exception. alors pourquoi Cela signifie-t-il que le blob ne peut pas se former ?

J'essaie également ceci ci-dessous, je pense qu'utiliser onload le remplacera Le contenu de l'image est en base64, mais ce n'est pas le cas et je ne sais pas pourquoi. je Notez également qu'il doit s'agir de l'image blob déclarée par le débogueur. L'argument est 1, mais ce n'est pas le cas.

Avant que quelqu'un ne dise cela, cela n'est pas utile, cela donne la même erreur Pas de réponse Cela semble être la norme : Comment résoudre « erreur de référence non détectée : le blob n'est pas défini » ?

Dans ce cas, elm est évalué comme img#np_track_artwork {alt:'Playing Suivi des illustrations', src : 'http://blah.com/now-playing.png, srcset :' Dimensions : '', crossOrigin:null ...} me ressemble à une goutte ? Alors j'ai réécrit Ça me semble bien :

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);
}

J'ai aussi tendance à créer un nouveau blob en cas de blobs dans le tableau var file = new blob ,elm.toString(),{'image/gif'}); 但这给出了相同的结果参数 1 而不是 imgReader.readADatUrl(file);

J'ai reçu ce message frustrant

Vous ne pouvez pas poster de nouvelles questions maintenant Désolé, nous ne Acceptez les questions de votre compte, comme la plupart de vos questions nécessitent des améliorations ou dépassent le cadre de ce site Web. Voir aide Page centrale Pourquoi ma question n'est-elle plus acceptée ? compte? pour en savoir plus.

Veuillez ne pas créer de nouveaux comptes. Travaillez plutôt à améliorer votre Modifier les questions existantes pour répondre aux exigences du site Lignes directrices et répondez à tous les commentaires que vous recevez. vous pouvez aussi Continuez à contribuer au site par d'autres moyens, par exemple en éditant D'autres articles pour les améliorer.

Quand j'ai essayé de poser différentes questions sans rapport avec celle que j'avais complétée, on m'a promis d'enquêter, rien ne s'est passé, je suppose qu'est-ce que ça veut dire d'être un mâle dominant, tu ne veux pas de femmes ici ?

J'utilise JavaScript pour placer un GIF sur un arrière-plan et bien que cela crée le texte ci-dessous, il ne met pas à jour la page, je ne sais pas pourquoi quelqu'un peut m'aider ?

La partie HTML du tableau est

Dans le débogueur, si je saisis une variable dans la console, elle renvoie ce qui suit dans object_dj :

J'ai également essayé de l'utiliser qui renvoie également ce contenu comme image de fond : "" ;

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

J'ai même essayé d'utiliser la bonne URL 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 est toujours "" que se passe-t-il, je peux le définir avec une feuille de style

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

J'ai fait de mon mieux. pUrl obtient l'url mais il ne l'attribue jamais à object_dj.style.backgroundImage et l'attribue à url() renvoie "" pUrl contient l'url "http://d.ezyro.com/images/ezgif-2- f0284e7093b1 .gif" (pas une vraie URL). url() ne semble pas fonctionner, peut-être parce que ce n'est pas https mais http ? :

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

J'ai réessayé avant qu'il ne soit supprimé

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

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

L'arrière-plan div dans la console du débogueur ne donne toujours rien et rien ne change à l'écran

Console : object_dj.style.backgroundImage ''

Le JavaScript que j'utilise est

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 Le site Web d n'existe pas.

Maintenant que cette étape fonctionne, il doit y avoir une repeinture ou quelque chose manquant, peut-être pouvez-vous me guider pour que cela fonctionne en mettant à jour la page.

J'ai essayé de modifier les données avec des déchets :

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

Image également essayée et vérifiée :

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

Erreur

VM313 : 1 Erreur de référence non détectée : l'imageURL n'est pas définie en évaluation(évaluation dans (music_now_playing.php:1:1),:1:1) À : 1:1

J'ai essayé d'ajouter des variables Il a décidé de ne pas donner d'erreur.

Ceci vient de la console, votre exemple ne charge pas l'url sur mon site :

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

Il semble que imageURL soit à l'origine du problème ?

J'ai aussi essayé : stackflow.com/questions/8840580/force-dom-redraw-refresh-on-mac mais aucune des réponses n'a fonctionné. Existe-t-il une nouvelle façon de procéder ?

object_dj.scrollBy(0,0); ne le forme pas non plus et il n'est pas reconnu dans JQuery.fn.redraw()

Answer 1

En supposant que le serveur vous a servi l'image, alors peut-être qu'elle est mise en cache quelque part ? Redessiner ou forcer un rendu peut fonctionner. Essayez ceci :

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);