사용자가 iframe에서 탐색 할 때 iframe의 상위 페이지가 자동으로 맨 위로 스크롤되도록 하시겠습니까?

Question

iFrame로드 문제 iFrame이 클라이언트 페이지로로드 될 때 페이지 위치가 돌아서는 것을 볼 수 있으며 대다수의 경우 페이지의 포커스가 페이지 아래쪽에 더 낮게 표시됩니다. 이렇게하면 스크롤하여 iframe 응용 프로그램을 볼 수 있습니다.

$를 ('HTML, 몸, window.parent.document) .animate ({ 를 scrollTop :'0 픽셀 ' },'빨리 ')

내가 사용하여이 문제를 해결하기 위해 노력했다;

은 iframe 아이디 = "clientid는"클래스 = "광고"SRC = "https://www.our-application.com"

이없는 클라이언트의 웹 사이트 및 우리의 iframe을 기반 응용 프로그램 창이 서로 다른 도메인에 있기 때문에 작업 , 따라서 우리는 직접 cross-domain 문제가있는 window.parent에 액세스 할 수 없습니다.

친절이이 답변은 상위 페이지에 자바 스크립트 이벤트 리스너를 추가 할 수 있습니다 제공 작동합니다

Answer 1

도움이 PLS 해결하는 방법을 제안한다.

클라이언트 페이지의 '메시지'이벤트 리스너에서 window.parent.postMessage() 기능을 사용할 수 있습니다. 아래 Mozilla 문서를 참조하십시오.

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

아이디어는 당신의 iframe 내에 당신이 부모 창에 메시지를 게시하려면 자바 스크립트를 사용하는 것입니다.

부모 창에는 이벤트 수신기가 포함되어 있으며 위쪽으로 스크롤됩니다.

위의 문서에서 보안 문제에 특히주의해야합니다.

이 대답은 내가

function receiveMessage(e){ 

    console.log("Received Message: " + e); 

    if (e.originalEvent.origin === 'http://www.site.client.com') { 
    $("html, body").animate({ 
     scrollTop : 441 
    }, "fast"); 
    } 
} 
$(window).bind("message", receiveMessage); 

을했고 iframe이 콘텐츠를 JS 원래 코드이 추가, 부모 창에서 코드 예제 https://stackoverflow.com/a/24914498/7326037

을 제공합니다

window.parent.postMessage("Scroll", "http://www.site.client.com/"); 

이렇게하면 부모에 의해 캡처 된 메시지가 iframe에 게시됩니다. 이 메시지가 게시 된 유일한 메시지이기 때문에이를 사용하여 도메인이 일치하는 경우에만 스크롤 이벤트를 트리거합니다.