본문 바로가기

Programming/HTML & Javascript2

[iframe] 다른 도메인 간 부모 페이지, 자식 iframe간 데이터 접근 및 조작 (feat. postMessage) ※ 메모용으로 작성한 글 지난 포스팅에서는 부모 페이지와 자식 iframe이 있을 때, 자식에서 부모 데이터, 부모에서 자식 데이터로 직접 접근하고 값을 변경하는 것에 대해 작성하였다. 이번에도 역시 동일한데, 차이점이 있다면 부모 페이지와 자식 iframe은 서로 다른 서버에서 동작하는 페이지라는 점이다. 나의 경우, 다른 도메인에서 동작하는 두 서버가 있고, 한 서버(Node.js)의 EJS 페이지가 다른 서버(Spring)의 JSP에 iframe으로 심어진 상태에서 부모 페이지(Spring JSP)와 자식 페이지 간의 데이터 송수신이 필요한 상황이 발생했다. 당시에는 단순히 이전 포스팅처럼 데이터만 주고 받으면 되겠지 라고 생각했는데, 매우 미천한 생각이었다 ㅋㅋ.. 생각해보면 도메인이 다른 두 페.. 2021. 10. 1.
[iframe] 부모 페이지와 자식 iframe간 데이터 접근 및 조작 ※ 메모 목적으로 작성한 글 개발 중, iframe을 JSP에 탑재하고 iframe 내에서 상위 JSP로, JSP에서 iframe으로 서로의 데이터에 접근하고, 조작해야 할 일이 생겼다. 이에 대한 해결 방법을 구글링해보니, 다음과 같이 접근이 가능하다고 한다. (물론 이 방법으로 해결하지는 못 했다. 나의 경우 JSP는 스프링이고, IFrame은 Node.js에서 구동하는 페이지이기 때문에 CORS가 발생... ㅎㅋㅎㅋ... 해결 방법은 다음 포스트에 작성한다. 내 경우가 아닌 간단한 형태라면 하단의 방법으로 사용할 수 있을 것이다.) 1. iframe 내에서 상위 JSP(또는 HTML)로 데이터 접근 및 조작 iframe에서 상위 JSP로 데이터를 보내기 위해서는 iframe(자식)에서 부모 윈도우를.. 2021. 9. 30.