CODEWITHSUNDEEP
javascriptjqueryiframetwitter
Zach Lipton
Zach Lipton

Reputation: 1850

Creating a tweet button without opening a new window

I'm looking to add a "tweet this" button to a site. Simple enough, right? The catch is that the site is meant to run on an embedded platform that doesn't particularly handle popup windows, so I'm trying to do everything inside the page.

I'm able to successfully create my tweet button, attach an onClick handler to it, and construct a proper twitter.com/share URL for the relevant content. All works fine when I open that URL in a new window with window.open. However, if I try to open the URL in an iframe, nothing loads inside the frame. Even loading http://twitter.com into the iframe fails in the same way. However, loading Google or any other website seems to work just fine.

Any thoughts on what I'm missing here? Thanks! --zach

Edit: Yep, they are detecting the iframe on load and blanking the page:

if (window.top !== window.self) {
    document.write = "";
    window.top.location = window.self.location; 
    setTimeout(function(){ document.body.innerHTML='';},1);
    window.self.onload=function(evt){document.body.innerHTML='';};

}

Any reasonable way to get around this, or am I stuck writing my own auth pipeline through oauth? I don't need anything from their API, just letting users tweet to their own accounts.

Upvotes: 5

Views: 1602

Answers (5)

Yunchi
Yunchi

Reputation: 5537

@yuval Unfortunately for you, the twitter url goes to a page that has the X-FRAME-OPTIONS:SAMEORIGIN header set in the response. It's not a Javascript check. The browser will simply refuse to render the page after seeing the header. This is done to prevent a clickjacking attack, usually done to steal a user's password.

So your only other option is really to redirect your current page with window.location.href=url.

Upvotes: 0

Zachary Kniebel
Zachary Kniebel

Reputation: 4784

You said window.open worked fine for popping up the url in a new window but have you tried popping it into the parent frame? 

twtWindow=window.open([url],'_parent',[specs])

Upvotes: 0

halfpastfour.am
halfpastfour.am

Reputation: 5933

Go and get a developper account on twitter and things are made easy for you :)

Upvotes: 2

Ben L.
Ben L.

Reputation: 786

Twitter (like Stack Overflow) is probably using some Javascript to ensure they're not being presented in an iFrame:

if(top!=self){
     //hates you
}

I ran into something similar recently, and ended up re-doing part of my app without the iFrame element.

Upvotes: 10

matt b
matt b

Reputation: 139991

Can you simply redirect the the twitter share URL? I'm guessing they want to be careful about opening the window in iframe's to prevent malicious sites from tweeting in a user's account without giving the user a chance to first confirm their intent to send this tweet.

Upvotes: 1

Related Questions