How to get referrer source of iframe parent page?

Question

We are taking our iframe entry form code and placing it on a website page. We want to be able to see where someone came from if they land on the page and entered their information into the form.

For example: our iframe is embedded on a page. The URL of that page gets posted to Facebook. Someone clicks the link, lands on the page, and enters their information into our iframe entry form. We then want to be able to say, 1 referral came from Facebook.

We tried using $_SERVER['HTTP_REFERER'], but this just returns the parent page URL of where the iframe is embedded, which we don't want. We want the actual URL of the referral to the parent page (in the example above, it would be Facebook). Is there anyway to grab this information?

Solution

Unfortunately cross-domain security is going to block this information from you since your iframe is not on the same domain as the parent page that is embedding it. You can check the referrer in your iframe but it will only give you the name of the page that is embedding it.

If you were on the same domain you would have access to the document.referrer in javascript and could retrieve that through the iframe.

I do have an idea for a solution though.

If you used a script to embed the iframe on the parent page you could do something like this.

function createIFrame() {
    var ref = document.referrer;
    ifrm = document.createElement("iframe"); 
    ifrm.setAttribute("src", "http://www.nba.com/?referrer="+ref); 
    ifrm.style.width = 640+"px"; 
    ifrm.style.height = 480+"px"; 
    document.body.appendChild(ifrm);
} 

createIFrame();

This would allow you to then in your iframe read the query string referrer from your url and send that information to your server. It would require you to package up a little bit of javascript with your widget, but it may be the only solution to you.

JSFiddle - http://jsfiddle.net/7QbPN/