Dapatkan URL saat ini dari IFRAME


91

Apakah ada cara sederhana untuk mendapatkan URL saat ini dari iframe?

Penampil akan melalui banyak situs. Saya menduga saya akan menggunakan sesuatu dalam javascript.


2
Jika Anda datang ke sini mencari URL dari halaman "induk" dari iframe, lihat stackoverflow.com/q/3420004/32453
rogerdpack

Jawaban:


166

Demi alasan keamanan, Anda hanya bisa mendapatkan url selama konten iframe, dan javascript referensi, disajikan dari domain yang sama. Selama itu benar, hal seperti ini akan berhasil:

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

Jika kedua domain tidak cocok, Anda akan mengalami pembatasan keamanan skripting referensi lintas situs.

Lihat juga jawaban untuk pertanyaan serupa .


apakah Anda tahu jika solusi yang diberikan oleh jawaban pemenang berhasil? Saya tidak bisa membuatnya berfungsi di komputer saya (IE, windows)
chris

Saya berbicara tentang tautan yang Anda cantumkan ke pertanyaan serupa.
chris

Tidak ada jawaban yang menang dalam pertanyaan yang saya tautkan ... jika yang Anda maksud adalah jawaban paling atas, itu sebenarnya bukan solusi yang berhasil. Dengan IE, Anda dapat mencoba pendekatan HTA yang disediakan juga dalam jawaban atas pertanyaan di atas.
kkyy

18
Ini tidak berfungsi jika src iframe Anda dari domain berbeda.
confile

Bagaimana jika kita menambahkan atribut sandbox="allow-same-origin"ke iFrame?
Roel

26

Jika iframe Anda berasal dari domain lain, (lintas domain), jawaban lain tidak akan membantu Anda ... Anda hanya perlu menggunakan ini:

var currentUrl = document.referrer;

dan - di sini Anda mendapatkan url utama!


28
-1 OP mencari url saat ini dari iframe, bukan perujuk halaman induk.
Christophe

15
@Christophe - Saya tahu, tetapi ini dapat membantu orang yang mencari url utama dan sampai pada pertanyaan ini!
ParPar

6
gr8 .. Ini membantu saya
Vikky

1
Inilah yang saya cari, dan ini memecahkan masalah saya tanpa memberi saya kesalahan X-Script. 1 untuk itu
Ulysses Alves

1
Luar biasa, saya perlu url iframe, bukan induknya :)
speti43

4

Semoga ini akan membantu beberapa bagaimana dalam kasus Anda, saya menderita masalah yang sama persis, dan hanya menggunakan penyimpanan lokal untuk berbagi data antara jendela induk dan iframe. Jadi di jendela induk Anda dapat:

localStorage.setItem("url", myUrl);

Dan dalam kode di mana sumber iframe hanya mendapatkan data ini dari penyimpanan lokal:

localStorage.getItem('url');

Menghemat banyak waktu saya. Sejauh yang saya bisa lihat, satu-satunya syarat adalah akses ke kode halaman induk. Semoga ini bisa membantu seseorang.


4
penyimpanan lokal hanya berfungsi di domain yang sama ... jadi mengapa harus menghadapi semua masalah ini? cukup
Yuki

3

Jika Anda berada dalam konteks iframe,

Anda bisa melakukannya

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

Jika Anda berada di jendela / bingkai induk, maka Anda dapat menggunakan jawaban https://stackoverflow.com/a/938195/2305243 , yaitu

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

1

Saya mengalami masalah dengan hrefs url blob. Jadi, dengan referensi ke iframe, saya baru saja menghasilkan url dari atribut src 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

Beberapa informasi tambahan untuk siapa saja yang mungkin bergumul dengan ini:

Anda akan mendapatkan nilai null jika Anda mencoba mendapatkan URL dari iframe sebelum dimuat. Saya memecahkan masalah ini dengan membuat seluruh iframe dalam javascript dan mendapatkan nilai yang saya butuhkan dengan fungsi 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);

Karena kebijakan asal yang sama, saya mengalami masalah saat mengakses frame "lintas asal" - saya mengatasinya dengan menjalankan server web secara lokal alih-alih menjalankan semua file langsung dari disk saya. Agar semua ini berfungsi, Anda harus mengakses iframe dengan protokol, nama host, dan port yang sama dengan aslinya. Tidak yakin yang mana yang hilang saat menjalankan semua file dari disk saya.

Juga, lebih lanjut tentang objek lokasi: https://www.w3schools.com/JSREF/obj_location.asp


0

Jika Anda berada di dalam iframe yang tidak memiliki lintas domain src, atau src kosong:

Kemudian:

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
    }
}

Jika Anda berada di dalam iframe dengan src lintas domain:

Kemudian:

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;
    }
}
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.