最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to disable direct access to Iframe - Stack Overflow

programmeradmin2浏览0评论

Let's say normally my users access our web page via

Inside this web page, we have a iframe which actually es from

Everything is working fine, except that if for some reason, the users e to know about this url . They can start accessing it directly by typing into the address bar.

This is what I want to prevent them from doing. Is there any best practice to achieve this?

==== Update to provide more background ====

The parent page which is is the pany's page and it's maintained by some other team. So they have all the generic header and footer, etc. so each application is rendered as an iframe inside it. (This also means we cannot change the parent page's code)

If users access directly, they won't be able to see the header and footer. Yes, it's not a big deal, but I just want to maintain the consistency.

Another of my concern is that, in our dev environment (aka when running the page locally) we don't have the parent-iframe thing. We access our page directly from http://localhost:port. Hence I want to find a solution that can allow us access it normally when running locally as well.

If such solution simple does not exist, please let me know as well :)

Let's say normally my users access our web page via https://www.mypany./go/mybusinessname

Inside this web page, we have a iframe which actually es from https://www.mypany./myapp

Everything is working fine, except that if for some reason, the users e to know about this url https://www.mypany./myapp. They can start accessing it directly by typing into the address bar.

This is what I want to prevent them from doing. Is there any best practice to achieve this?

==== Update to provide more background ====

The parent page which is https://www.mypany. is the pany's page and it's maintained by some other team. So they have all the generic header and footer, etc. so each application is rendered as an iframe inside it. (This also means we cannot change the parent page's code)

If users access https://www.mypany./myapp directly, they won't be able to see the header and footer. Yes, it's not a big deal, but I just want to maintain the consistency.

Another of my concern is that, in our dev environment (aka when running the page locally) we don't have the parent-iframe thing. We access our page directly from http://localhost:port. Hence I want to find a solution that can allow us access it normally when running locally as well.

If such solution simple does not exist, please let me know as well :)

Share Improve this question edited Apr 17, 2015 at 9:13 harry asked Apr 17, 2015 at 8:52 harryharry 1351 gold badge3 silver badges11 bronze badges 2
  • Have the IFRAME call into the outer parent frame using Javascript to validate itself. Nominally this won't work directly browsing (I say nominally because with enough effort, anything is possible). – Lloyd Commented Apr 17, 2015 at 8:56
  • possible duplicate of Detect iFrame embedding in Javascript – C3roe Commented Apr 17, 2015 at 9:06
Add a ment  | 

3 Answers 3

Reset to default 6

On your iframe's source, you can check the parent's window by using window.top.location and see if it's set to 'https://www.mypany./go/mybusinessname'. If not, redirect the page.

var myUrl = 'https://www.mypany./go/mybusinessname';

if(window.top.location.href !== myUrl) {
    window.top.location.href = myUrl;
}

I realized we already had a function to determine whether the page in running under https://www.mypany.. So now I only need to do the below to perform the redirecting when our page is not iframe

var expectedPathname = "/go/mybusinessname";
var getLocation = function (href) {
    var l = document.createElement("a");
    l.href = href;
    return l;
};
if (window == window.top) { // if not iframe
    var link = getLocation(window.top.location.href);
    if (link.pathname !== expectedPathname) {
        link.pathname = expectedPathname;
        window.top.location.replace(link.href);
    }
}

You can use HTTP referer header on server-side. If the page is opened in IFRAME - the referer contains parent page address. Otherwise, it is empty or contains different page.

发布评论

评论列表(0)

  1. 暂无评论