Comment obtenir une image src dans une autre page en utilisant JavaScript? [dupliquer]

Question

J'ai deux pages HTML; main.htmlet result.html.

main.html:

    <img id="preview" src="" alt="">
    <button id="done" type="button">done</button>

result.html:

    <img id="search" src="" alt="">

Dans la mainpage, je télécharge une image et l'aperçu est affiché dans previewde main. Et puis j'ai recadré cette image en utilisant le module js de cropper.

crop.js:

const done = document.getElementById('done');
const imgcropped = document.getElementById('img-cropped');

done.addEventListener('click', (e) => {
    imgcropped.src = cropper.getCroppedCanvas().toDataURL();
})

Je veux imgcropped.srcla search.srcdans result. Comment puis-je obtenir l' mainimage vers le result?

Answer 1

Vous pouvez le faire en utilisant localStorage.

Dans main.html:

const done = document.getElementById('done');
const imgcropped = document.getElementById('img-cropped');

done.addEventListener('click', (e) => {
    var newSrc = cropper.getCroppedCanvas().toDataURL();
    imgcropped.src = newSrc;
    window.localStorage.setItem("imgcropped", newSrc);
});

Et dans result.html:

var searchImg = document.getElementById("search")
if(window.localStorage.getItem("imgcropped") !== null){
    searchImg.src = window.localStorage.getItem("imgcropped");
}