Komunikacja między dwoma dziećmi iframe za pomocą postMessage

Question

Mam kod do osadzenia, który użytkownicy mogą umieścić na swoich stronach. Tworzy on dwa elementy podrzędne dla dzieci na stronie. Chciałbym, żeby te dzieci mogły się komunikować.

Używam Javascript w window.postMessagehttps://developer.mozilla.org/en-US/docs/DOM/window.postMessage

Ponieważ dwoje dzieci iframe nie mogą komunikować się bezpośrednio, używam rodzica jako przekaźnika wiadomości. Jednak rodzic może znajdować się w innej domenie, ponieważ jest to kod umożliwiający osadzanie.

Kiedy wszystkie trzy (rodzice i dwoje dzieci) są w tej samej domenie, to całkiem proste i mam tę pracę z kontroli bezpieczeństwa sprawdzenie e.origin jest moja własna strona

# coffeescript 
# host = "http://www.mysite.com" 
host = "http://localhost" 

receive_message = (e) -> 
    console.log("received message from " + e.origin + ": " + e.data) 
    return if e.origin != host 

    if e.data == "show" 
    ... 
    else if e.data == "hide" 
    ... 

window.addEventListener("message", receive_message, false) 

Co to elegancki sposób sprawdzić pochodzenie, gdy rodzic może być w dowolnej domenie?

Jaki jest dobry sposób na umożliwienie debugowania skryptu, w którym źródłem może być localhost?

Czy wystarczy sprawdzić parametr danych, jeśli przekazywane są nieniszczące/zmieniające się komunikaty?

Dzięki!

Answer 1

Dlaczego mówisz, że elementy potomne nie mogą się bezpośrednio komunikować? W rzeczywistości mogą. W ramach elementu iframe podrzędnego można użyć właściwości window.parent, aby uzyskać odwołanie do okna nadrzędnego, a następnie użyć właściwości rodzica o nazwie frames, aby uzyskać odwołania do wszystkich elementów potomnych iframe (właściwość frames daje tablicę takich odniesień). Następnie możesz użyć postMessage na każdym z tych odniesień i ustawić wymagane ograniczenie pochodzenia w wywołaniu postMessage, aby upewnić się, że tylko właściwy element iframe otrzymuje wiadomość.

Należy zauważyć, że będzie to działało nawet wtedy, gdy wszystkie trzy okna (iframe1, okno nadrzędne i iframe2) znajdują się w różnych domenach, ponieważ iframe1 nic nie robi z oknem nadrzędnym (co naruszałoby SOP), to tylko pobiera odniesienia do zagnieżdżonych iframe.

Linki:

https://developer.mozilla.org/en-US/docs/DOM/window.parent

https://developer.mozilla.org/en-US/docs/DOM/window.frames