다목적 웹페이지에 대한 Iframe 로딩 식별
웹 개발 영역에서 iframe 내에 로드되는 웹페이지와 직접 로드되는 웹페이지를 구별합니다. 브라우저 창은 종종 중요한 작업입니다. 이는 일반 웹사이트와 Facebook 내의 캔버스 페이지를 모두 렌더링하는 등 다양한 목적을 제공하는 것을 목표로 하는 애플리케이션에 특히 적합합니다. 이 문제를 해결하기 위해 우리는 웹페이지의 로딩 환경을 결정하는 방법을 탐색합니다.
Iframe 로딩 감지
웹페이지가 iframe 내에 로드되었는지 확인하기 위해 다음을 활용할 수 있습니다. 창 개체 간의 차이점. 특히 self 속성은 현재 창을 나타내고, top 속성은 가장 바깥쪽 창이나 프레임을 나타냅니다. 이 두 창 개체가 동일하지 않으면 웹페이지가 iframe 내에 로드된다는 의미입니다.
코드 구현
const inIframe = () => window.self !== window.top;
이 함수는 다음을 나타내는 부울 값을 반환합니다. 페이지가 iframe 내부에 로드되었는지 여부. 참 값은 iframe 로드를 의미하고 거짓 값은 브라우저 창에서 직접 로드를 의미합니다.
Cross-Origin Access 업데이트
브라우저 보안 조치로 인해 다음에 대한 액세스가 제한될 수 있습니다. window.top은 동일 출처 정책으로 인해 발생합니다. 이 문제를 해결하기 위해 try-catch 블록을 사용할 수 있습니다.
function inIframe () { try { return window.self !== window.top; } catch (e) { return true; } }
이 업데이트 버전에서는 window.top에 대한 액세스 차단으로 인해 발생하는 예외가 iframe 로딩을 가정하여 처리됩니다.
결론
윈도우 개체 간의 차이점을 이해하여 웹 페이지가 다음과 같은지 여부를 안정적으로 감지하는 방법을 확립했습니다. iframe 내에 로드됩니다. 이러한 지식을 통해 개발자는 로딩 환경에 따라 동작을 조정하는 애플리케이션을 개발하여 다양한 플랫폼에서 원활한 기능을 보장할 수 있습니다.
위 내용은 웹페이지가 IFrame 내부에 로드되었는지 어떻게 감지할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!