Cannot call method 'wsl_wordpress_social_login' - javascript

Hi I'm using a wordpress plugin to allow user to comment using facebook and twitter accounts.
This is the page i am testing the plugin on http://blog.pcpal.co.uk/2012/04/first-raspberry-pi-computers-to-be-delivered/
When i click the facebook icon its opens up a windows where i sign into facebook ad then directs to a blank pages which has a JS error see code below
<html><head>
<script>
function init() {
window.opener.wsl_wordpress_social_login({
'action' : 'wordpress_social_login',
'provider' : 'Facebook'
});
window.close();
}
</script>
</head>
<body onload="init();">
</body></html>
# Error is Uncaught TypeError: Cannot call method 'wsl_wordpress_social_login' of null
If you can help then great..
Additional info
Only seems to do it with chrome

For security reasons the "window.opener" object is likely removed when you go to another domain (like Facebook). When it gets back to your site it's trying to tell the parent window (the blog) to refresh but it no longer has a way to communicate with it.
The plug-in should add some code to the parent page to watch for the pop-up window to close and then refresh itself.
See window.opener is null after redirect

Related

Never Show Window On Page Launch

I am using C# and asp.net to launch a webpage that I am passing parameters to. That works well! I come from a Windows.Forms background so please forgive me if I am trying to achieve the impossible. What I would like is set the Visibility property of the program (either IE or chrome) to false so the user never sees that a webpage is being launched. I have been using this JS function to close the page, but it seems that the page must completely load before closing which sometimes can take a few seconds.
Does asp.net have the capability to achieve such? And this is my JS code I have been using
string close = #"<script type = 'text/javascript'>
window.returnValue = true;
window.close();
</script>";
base.Response.Write(close);
If you don't want the User to see the page, I assume you just want to post some information to the page. In that case, make an HTTP request via c# code, instead of opening the webpage up in a browser.
On the Project Properties page, Web tab, Start Action section, click the radio button for "Don't open a page. Wait for a request from an external application".

Google Drive API, can't open standard sharing dialog via JS (x-frame-options error)

I have a JavaScript app which uses the Google Drive API. I read how to open a standard sharing dialog here: https://developers.google.com/drive/web/manage-sharing
<head>
...
<script type="text/javascript" src="https://apis.google.com/js/api.js"></script>
<script type="text/javascript">
init = function() {
s = new gapi.drive.share.ShareClient('<MY_APP_ID>');
s.setItemIds(["<MY_FILE_ID>"]);
}
window.onload = function() {
gapi.load('drive-share', init);
}
</script>
</head>
<body>
<button onclick="s.showSettingsDialog()">Share</button>
</body>
Seems like I do everything right, when I click my share button, the dialog starts loading but it can't be loaded.
In the console I see:
Refused to display 'https://drive.google.com/share?...' in a frame
because it set 'X-Frame-Options' to 'SAMEORIGIN'.
I've googled this error and I've seen that there are some similar questions in SO and other sites, but they don't help. I guess Google doesn't allow itself to be in a frame in a not-google-site (cause of "SAMEORIGIN").
What can I do to open sharing dialog in my app?
The "Launching the Google Drive sharing dialog in your app" page here states:
The URL of the page that launches the dialog must have the same origin
as the Open URL registered for the app.
If you then look at the instructions to "Configure the Drive SDK" here, you can see that the "Open URL" section reads:
There are two important things to keep in mind for the Open URL:
Make sure you give a fully qualified domain name for Open URL -- localhost won't work.
The URL must belong to you. After the app registration is complete, you'll need to verify your ownership of this URL in order to create a
Chrome Web Store listing. For more information, see Site Verification.
Hence your page which is launching the dialog does not have the same origin as the Open URL registered for the app in you Google Drive SDK settings. So to fix your problem correct the Open URL so that it has the correct URL i.e. a URL with the same origin as the Open URL. Note that you can change the Google Drive SDK settings via https://console.developers.google.com/project.
As well as making sure the Open URL is set correctly. You'll also need to substitute your Drive SDK app ID for 'MY_APP_ID'. You can find the App ID by following these instructions:
Goto https://console.developers.google.com
Click your project
Click "APIs and auth" on the left
Click the "Drive SDK" settings cog icon
The "App ID" can then be found under the "Google Drive SDK" title e.g. App ID: 47XXXXXXXX3
The problem was solved thanks to this answer https://stackoverflow.com/a/20742994/1185123
dan-man says in his answer:
Client ID You can find this in the Google Cloud Console - see above.
Mine is a 12 digit number, so yours will probably be too.
Mine client id looks like
175564412906-ui22fsaghkvkkj09j2bprku55m8k3d0d.apps.googleusercontent.com
I've used this id in
s = new gapi.drive.share.ShareClient('<MY_APP_ID>');
After reading the answer, I tried to use only first 12 digits of my client id. I didn't expect it to work, I was just desperate. But the strange thing, it works perfectly!
If somebody can explain why it works and why nothing about this is said in the documentation — you are welcome to answer!

How to add twitter tweet functionality on my website?

I'm following this Site which is a easy way to add a customised tweet box and button on my site and will help in update of post.
As per its functionality, once we write any messages in the textbox and click on tweet button we will get the twitter login pop up window, once we are authenticated our message will be posted on our twitter account wall.
But when i run this code, i'm getting the pop up window and once i provide my credentials the window closes but no message is posted in the twitter account. When i checked on my javascript console im getting error:
Unsafe JavaScript attempt to access frame with https://api.twitter.com/xd_receiver.html from frame with URL about:blank. The frame requesting access has a protocol of 'http', the frame being accessed has a protocol of 'https'. Protocols must match.
I dont know what this error means as my site through which im running the form is clorderdev2.uvacha.com
Below is my code :
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://platform.twitter.com/anywhere.js?id=YOURCONSUMERKEY&v=1"></script>
<script type="text/javascript" src="Scripts/jquery.jtweetsanywhere-1.3.1.min.js"></script>
<script type="text/javascript" src="Scripts/jtweetsanywhere-de-1.3.1.min.js"></script>
<div id="jTweetsAnywhereSample"></div>
<script type="text/javascript">
$('#jTweetsAnywhereSample').jTweetsAnywhere({
showTweetBox:{
counter: true,
width: 380,
height: 65,
label: '<span style="color: #A4A4A4">What\'s happening?</span>',
defaultContent: '#jTweetsAnywhere',
onTweet: function(textTweet, htmlTweet){
alert('You tweeted: ' + textTweet);
}
}
});</script>
There's a better plugin to get Twitter tweets, and it's called livetwitter.
All the information you need is here:
https://github.com/elektronaut/jquery.livetwitter
The problem is that a script, somewhere, is trying to communicate between http:// and https:// protocols. For security reasons, JavaScript can't do that. This is most likely a bug in one of the libraries you're using.
I'd suggest using the official twitter implementation, if that's a possible alternative.

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.
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.
Go and get a developper account on twitter and things are made easy for you :)
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.
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])
#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.

how to create a content sharing service like Tweet button or Facebook share

I am implementing a content sharing service, similar to Twitter and Facebook button. When the user visits a page, he will be able to click on my button, which will open a page in a new window that lets the user interact with my service. My service use 2 parameters: the current page's URL and title.
I have looked at the html code used to add the Twitter, Facebook and Printfriendly buttons and they all use Javascript code specific to their service.
For instance, this JS file must be included to add the Printfriendly button to your page:
<script src="http://cdn.printfriendly.com/printfriendly.js" type="text/javascript"></script>
For Facebook: <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
Twitter:<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
My question is do I need to write some Javascript code or can I just forward all the request to the server?
Thanks,
Olivier.
You need to write a bit of JavaScript code for the button (for the window to show up with the specified contents) and the main script (which is included like Twitter and facebook did as you mentioned)
You can get away with simple hyperlink. For example Facebook share button works like hyperlink: Share on Facebook.
The reason to use javascript or iframe is to have better control over user experience. So it is up to you to decide how you want to handle it.

Categories