Ottieni l'URL corrente da IFRAME


Risposte:


166

Per motivi di sicurezza, puoi ottenere l'URL solo fintanto che i contenuti dell'iframe e il javascript di riferimento vengono forniti dallo stesso dominio. Finché ciò è vero, qualcosa del genere funzionerà:

document.getElementById("iframe_id").contentWindow.location.href

Se i due domini non corrispondono, ti imbatterai in restrizioni di sicurezza per lo script di riferimento incrociato.

Vedi anche le risposte a una domanda simile .


sai se la soluzione fornita dalla risposta vincente funziona? Non sono riuscito a farlo funzionare sul mio computer (IE, Windows)
— chris,

Stavo parlando del collegamento che hai elencato alla domanda simile.
— chris

Non c'è una risposta vincente nella domanda che ho collegato ... se intendi la risposta più alta, non è davvero una soluzione funzionante. Con IE potresti provare l'approccio HTA fornito anche nelle risposte alla suddetta domanda.
— kkyy

18
Questo non funziona se il tuo iframe src proviene da un dominio diverso.
— confile

Cosa succede se aggiungiamo l'attributo sandbox="allow-same-origin"all'iFrame?
— Roel

26

Se il tuo iframe proviene da un altro dominio, (interdominio), le altre risposte non ti aiuteranno ... dovrai semplicemente usare questo:

var currentUrl = document.referrer;

e - qui hai l'URL principale!


28
-1 l'OP sta cercando l'URL corrente dell'iframe, non il referrer della pagina genitore.
— Christophe

15
@Christophe - Lo so, ma può aiutare le persone che cercano l'URL principale e sono arrivate a questa domanda!
— ParPar

6
gr8 .. Questo mi aiuta
— Vikky

1
Questo è esattamente quello che stavo cercando e risolve il mio problema senza darmi l'errore X-Script. +1 per quello
— Ulysses Alves,

1
Eccellente, mi serve l'URL iframe, non il genitore :)
— speti43

4

Spero che questo possa aiutare in qualche modo nel tuo caso, ho sofferto dello stesso identico problema e ho appena usato localstorage per condividere i dati tra la finestra principale e l'iframe. Quindi nella finestra genitore puoi:

localStorage.setItem("url", myUrl);

E nel codice in cui la sorgente iframe è solo ottenere questi dati da localstorage:

localStorage.getItem('url');

Mi ha fatto risparmiare un sacco di tempo. Per quanto posso vedere l'unica condizione è l'accesso al codice della pagina padre. Spero che questo possa aiutare qualcuno.


4
l'archiviazione locale funziona solo sullo stesso dominio ... quindi perché andare con tutti questi problemi? basta interrogare location.href
— Yuki

3

Se ti trovi nel contesto iframe,

potresti fare

const currentIframeHref = new URL(document.location.href);
const urlOrigin = currentIframeHref.origin;
const urlFilePath = decodeURIComponent(currentIframeHref.pathname);

Se ti trovi nella finestra / frame principale, puoi utilizzare la risposta di https://stackoverflow.com/a/938195/2305243 , che è

document.getElementById("iframe_id").contentWindow.location.href

1

Ho avuto un problema con l'URL del blob hrefs. Quindi, con un riferimento all'iframe, ho appena prodotto un URL dall'attributo src dell'iframe:

    const iframeReference = document.getElementById("iframe_id");
    const iframeUrl = iframeReference ? new URL(iframeReference.src) : undefined;
    if (iframeUrl) {
        console.log("Voila: " + iframeUrl);
    } else {
        console.warn("iframe with id iframe_id not found");
    }

0

Alcune informazioni aggiuntive per chiunque possa avere problemi con questo:

Otterrai valori nulli se stai cercando di ottenere l'URL dall'iframe prima che venga caricato. Ho risolto questo problema creando l'intero iframe in javascript e ottenendo i valori di cui avevo bisogno con la funzione onLoad:

var iframe = document.createElement('iframe');
iframe.onload = function() {

    //some custom settings
    this.width=screen.width;this.height=screen.height; this.passing=0; this.frameBorder="0";

    var href = iframe.contentWindow.location.href;
    var origin = iframe.contentWindow.location.origin;
    var url = iframe.contentWindow.location.url;
    var path = iframe.contentWindow.location.pathname;

    console.log("href: ", href)
    console.log("origin: ", origin)
    console.log("path: ", path)
    console.log("url: ", url)
};

iframe.src = 'http://localhost/folder/index.html';

document.body.appendChild(iframe);

A causa della politica della stessa origine, ho avuto problemi durante l'accesso ai frame "cross origin": l'ho risolto eseguendo un server web in locale invece di eseguire tutti i file direttamente dal mio disco. Affinché tutto questo funzioni, devi accedere all'iframe con lo stesso protocollo, nome host e porta dell'origine. Non sono sicuro di quale di questi mancasse / mancasse durante l'esecuzione di tutti i file dal mio disco.

Inoltre, ulteriori informazioni sugli oggetti di localizzazione: https://www.w3schools.com/JSREF/obj_location.asp


0

Se ti trovi all'interno di un iframe che non ha src interdominio o src è vuoto:

Poi:

function getOriginUrl() {
    var href = document.location.href;
    var referrer = document.referrer;
    // Check if window.frameElement not null
    if(window.frameElement) {
        href = window.frameElement.ownerDocument.location.href;
        // This one will be origin
        if(window.frameElement.ownerDocument.referrer != "") {
            referrer = window.frameElement.ownerDocument.referrer;
        }
    }
    // Compare if href not equal to referrer
    if(href != referrer) {
        // Take referrer as origin
        return referrer;
    } else {
        // Take href
        return href
    }
}

Se ti trovi all'interno di un iframe con src interdominio:

Poi:

function getOriginUrl() {
    var href = document.location.href;
    var referrer = document.referrer;
    // Detect if you're inside an iframe
    if(window.parent != window) {
        // Take referrer as origin
        return referrer;
    } else {
        // Take href
        return href;
    }
}
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.