Nhận URL hiện tại từ IFRAME

Có cách nào đơn giản để lấy URL hiện tại từ iframe không?

Người xem sẽ đi qua nhiều trang web. Tôi đoán tôi sẽ sử dụng một cái gì đó trong javascript.

Vì lý do bảo mật, bạn chỉ có thể lấy url miễn là nội dung của iframe và javascript tham chiếu, được phân phát từ cùng một miền. Miễn là điều đó đúng, một cái gì đó như thế này sẽ hoạt động:

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

Nếu hai miền không khớp, bạn sẽ gặp phải các hạn chế về bảo mật tập lệnh tham chiếu trang web.

Xem thêm câu trả lời cho một câu hỏi tương tự .

Nếu iframe của bạn đến từ một miền khác, (miền chéo), các câu trả lời khác sẽ không giúp được bạn ... bạn chỉ cần sử dụng điều này:

var currentUrl = document.referrer;

và - ở đây bạn đã có url chính!

Hy vọng điều này sẽ giúp một số trong trường hợp của bạn, tôi gặp phải vấn đề tương tự và chỉ sử dụng localstorage để chia sẻ dữ liệu giữa cửa sổ mẹ và iframe. Vì vậy, trong cửa sổ cha, bạn có thể:

localStorage.setItem("url", myUrl);

Và trong mã mà nguồn iframe chỉ lấy dữ liệu này từ localstorage:

localStorage.getItem('url');

Tiết kiệm cho tôi rất nhiều thời gian. Theo như tôi có thể thấy điều kiện duy nhất là quyền truy cập vào mã trang mẹ. Hy vọng điều này sẽ giúp một ai đó.

Nếu bạn đang ở trong ngữ cảnh iframe,

bạn có thể làm

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

Nếu bạn đang ở trong cửa sổ / khung chính, thì bạn có thể sử dụng câu trả lời của https://stackoverflow.com/a/938195/2305243 , đó là

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

Tôi gặp sự cố với hrefs url blob. Vì vậy, với tham chiếu đến iframe, tôi vừa tạo một url từ thuộc tính src của 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");
    }

Một số thông tin bổ sung cho bất kỳ ai có thể gặp khó khăn với điều này:

Bạn sẽ nhận được giá trị null nếu bạn đang cố lấy URL từ iframe trước khi nó được tải. Tôi đã giải quyết vấn đề này bằng cách tạo toàn bộ iframe trong javascript và nhận các giá trị tôi cần với hàm 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);

Do chính sách nguồn gốc giống nhau, tôi đã gặp sự cố khi truy cập các khung "cross origin" - tôi đã giải quyết vấn đề đó bằng cách chạy cục bộ máy chủ web thay vì chạy tất cả các tệp trực tiếp từ đĩa của mình. Để tất cả những điều này hoạt động, bạn cần phải truy cập iframe với cùng một giao thức, tên máy chủ và cổng như nguồn gốc. Không chắc cái nào trong số này bị / bị thiếu khi chạy tất cả các tệp từ đĩa của tôi.

Ngoài ra, thông tin thêm về các đối tượng vị trí: https://www.w3schools.com/JSREF/obj_location.asp

Nếu bạn đang ở trong iframe không có miền chéo src hoặc src trống:

Sau đó:

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

Nếu bạn đang ở trong iframe có tên miền chéo src:

Sau đó:

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