Evan의 개발 저장소

  • 홈
  • 태그
  • 방명록

poseMessage 1

Iframe에서 부모 window와 통신하는 방법 (react, vue <=> iframe)

서비스를 개발하다보면 간간히 iframe을 사용해야할 일이 발생한다. 가령 도메인이 다른 서비스를 기존 서비스 내에서 보여줘야 한다던지 특정 요소 안에서 외부 서비스를 보여줘야 하는 등 생각보다 사용해야할 일이 많이 생긴다. 서로 다른 도메인을 가지고 있기 때문에 window 객체를 직접 참조하려고 하면 cors에러가 발생하게 된다. 그럼 서로 데이터를 공유하거나 통신해야하는 로직이 필요한 경우 어떻게 해야하는가? iframe 내에서 window.parent.postMessage() 메서드를 사용하고 부모 window에서 event handler 메서드를 추가해주면 iframe에서 보내주는 메세지를 부모 window에서 처리할 수 있게 된다. 뒤로가기를 부모 window에서 할 수 있게 처리하는 예시이다..

Javascript 2023.06.07
이전
1
다음
프로필사진

흔적을 남기는 블로그

Evan
e-mail: kwtjdtn@gmail.com

  • 분류 전체보기 (14)
    • Javascript (6)
      • Next js (1)
    • Android (4)
    • iOS (4)

Tag

동등 비교, deferred deeplink, 정적 파일 서빙, 업데이트 팝업, javascript, Firebase App Distribution, Android, CD 구축, IOS, react, Object.is, poseMessage, typescript, test app, SWIFT, Fastlane, Firebase Remote Config, java, CD, zero install,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

Archives

Calendar

  2025. 05  
일 월 화 수 목 금 토
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31

방문자수Total

  • Today :
  • Yesterday :
깃허브 링크드인

흔적을 글로 남기자

  • 인스타그램
  • 링크드인
  • 깃허브

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.