JavaScript를 사용하여 다른 페이지에서 이미지 src를 얻는 방법은 무엇입니까? [복제]

Question

두 개의 HTML 페이지가 있습니다. main.html및 result.html.

main.html :

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

result.html :

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

에서 main페이지 나 이미지를 업로드하고 미리보기에 표시됩니다 preview의 main. 그런 다음 cropper js 모듈을 사용하여이 이미지를 자릅니다.

crop.js :

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

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

나는 싶어 imgcropped.src받는 사람 search.src에서 result. main이미지를 어떻게 얻을 수 result있습니까?

Answer 1

다음을 사용하여 그렇게 할 수 있습니다 localStorage.

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

그리고 result.html에서 :

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