iframe은 다음과 같은 상황에서 도메인을 교차합니다. 1. iframe의 소스 도메인 이름이 상위 페이지의 도메인 이름과 다른 경우 도메인 이름이 다르면 교차 도메인 문제가 발생합니다. 2. 프로토콜이 다른 경우 iframe의 프로토콜이 상위 페이지의 프로토콜과 다릅니다. 포트 번호가 다르면 도메인 간 문제가 발생합니다. 3. iframe의 포트 번호가 다른 경우. 4. 하위 도메인 이름이 다르면 iframe의 하위 도메인 이름이 상위 페이지의 포트 번호와 다르면 도메인 간 문제가 발생합니다. 하위 도메인 이름이 다르면 문제가 발생합니다.
이 튜토리얼의 운영 체제: Windows 10 시스템, Dell G3 컴퓨터.
웹 개발에서 iframe은 다른 웹 페이지 내에 웹 페이지를 삽입하는 데 사용되는 HTML 요소입니다. 그러나 보안상의 이유로 브라우저는 iframe에 대한 도메인 간 액세스를 제한하는 동일 출처 정책을 구현합니다.
동일 출처 정책은 브라우저의 보안 메커니즘으로, 웹 페이지는 동일한 소스의 리소스와만 상호 작용할 수 있어야 합니다. 즉, 프로토콜, 도메인 이름 및 포트 번호가 완전히 일치해야 합니다. 두 웹페이지의 출처가 다른 경우 두 웹페이지 간의 상호작용은 교차 출처로 간주됩니다.
다음 상황에서 iframe에 도메인 간 문제가 발생합니다.
1. 다른 도메인 이름: iframe의 소스 도메인 이름이 상위 페이지의 도메인 이름과 다른 경우 교차 도메인 문제가 발생합니다. 예를 들어 상위 페이지의 도메인 이름은 www.example.com이고 iframe의 소스 도메인 이름은 sub.example.com입니다.
2. 다른 프로토콜: iframe의 프로토콜이 상위 페이지의 프로토콜과 다르면 도메인 간 문제가 발생합니다. 예를 들어 상위 페이지는 https 프로토콜을 사용하고 iframe은 http 프로토콜을 사용합니다.
3. 다른 포트 번호: iframe의 포트 번호가 상위 페이지의 포트 번호와 다른 경우 도메인 간 문제가 발생합니다. 예를 들어 상위 페이지의 URL은 www.example.com:8080이고 iframe의 URL은 www.example.com:3000입니다.
4. 다른 하위 도메인 이름: iframe의 하위 도메인 이름이 상위 페이지의 하위 도메인 이름과 다른 경우 교차 도메인 문제가 발생합니다. 예를 들어 상위 페이지의 도메인 이름은 www.example.com이고 iframe의 도메인 이름은 sub.example.com입니다.
크로스 도메인 문제를 해결하려면 다음 방법을 사용할 수 있습니다.
1. 프록시 서버 사용: 서버 측에 프록시를 설정하여 크로스 도메인 요청이 대상 서버로 전달됩니다. 그런 다음 응답이 클라이언트에 반환됩니다.
2. JSONP: JSONP(JSON with Padding) 기술을 사용하여