I have followed the facebook developer tutorial in order to do this to no avail.
Basically I need user to authorize my app from within a page tab.
I have used their recommended javascript to redirect the user on page load to redirect them to the oauth popup however when the app loads I just get the dreaded "sorry an error occurred"
The URL that is generated is "https://www.facebook.com/dialog/oauth/?client_id=247274355370447&redirect_uri=https%3A%2F%2Fwww.facebook.com%2Fpages%2Fnull%2F286793781401206%2F247274355370447&scope=email,user_about_me" so I can see my variables for both page_id and app_id are being passed in.
Here is my complete JS code
<script>
var oauth_url = 'https://www.facebook.com/dialog/oauth/';
oauth_url += '?client_id=<? echo $app_id;?>';
oauth_url += '&redirect_uri=' + encodeURIComponent('https://www.facebook.com/pages/null/<?php echo $page_id;?>/<?php echo $app_id;?>');
oauth_url += '&scope=email,user_about_me'
window.top.location = oauth_url;
</script>
I am having the same issue.
You should be able to do this.
The URL to redirect to after the user clicks a button in the dialog. The URL you specify must be a URL of with the same Base Domain as specified in your app's settings, a Canvas URL of the form hxxps://apps.facebook.com/YOUR_APP_NAMESPACE or a Page Tab URL of the form hxxps://www.facebook.com/PAGE_USERNAME/app_YOUR_APP_ID
This doesn't work for me. I still get the error saying the redirect_uri isn't owned by the user.
I would rather not have to add a page on my site to redirect them back to the site but its seems the correct way does not work.
The easiest fix i have found at the moment is to set the redirect_uri back to a page on my domain. The same domain as the page_tab content is loaded from.
e.g. My page tab loads hxxp://example.com/ so set the redirect_uri to hxxp://example.com/redirect.php
in redirect.php use the follow code
<script>
window.top.location = "{YOUR_FACEBOOK_PAGE_TAB_URL}";
</script>
I recommend using the FB.login() function if you want the user to remain on your Page Tab App after authorization. You can do so with this code:
FB.login(function(response) {
if (response.authResponse) {
// do something with newly authorized user
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope:'PERMISSION_1', 'PERMISSION_2'});
It will open the dialog in an iframe, and trigger the callback after they have submitted or cancelled the authorization.
This solution is using the javascript SDK.
I think this might be because you are trying to redirect them back to facebook.com, so it doesn't see this as valid url for your application. You would need to redirect to a page on your own site, and then if need be redirect them from there back to the actual facebook page app tab
Related
I have a website with this domain: paydarsamane.com
and i set up a client portal on a sub domain with written with php in this url: portal.paydarsamane.com
I want to make sure the portal doesn't open when a user write direct url in browser or opens it from an email link.
When that happened, redirect homepage or other page
But when user clicks on the portal login link (Located at main domain) Open correctly and show portal contents
Because I don't know php and don't know its infrastructure, I don't have any mentality about it.
Thanks for the help
First Solution :
you can read this articel to understand how to set cookie to another domain and then redirect to that page , so when user directly access the page the cookie is not saved in browser localstorage and then you can act properly :
share-localstorage-sessionstorage-between-different-domains
Second Solution :
as you mentioned in comments you can use referral url too. like this :
<script type="text/javascript">
// use referral host domain , not full url
var referral_domain = "<?php echo $referral_domain; ?>";
// check if referral is set
if(!localStorage.getItem('referral')){
localStorage.setItem('referral', referral_domain);
}
if(localStorage.getItem('referral')){
// you want to update
if(localStorage.getItem('referral') !== "example.url"){
// redirect user back to where he came from fo example
history.go(-1);
}
}
else{
// redirect user back to where he came from fo example
history.go(-1);
}
</script>
I am using joomla 1.5. I have a separate code which is in the same domain but in an another folder. I am accessing that folder within my joomla code by making use of iframe. Now I have to send the session value from joomla application to iframe and I am doing that by the following code.
echo '<iframe src="https://localhost/demo/quiz/quiz_main.php?u_d='.$user->id.'" width="910" height="885" style="background-color:transparent"></iframe>';
where $user->id is the registered user'd id and obviously this page will open if user logs in.
Then in the quiz_main.php page I am checking the value of u_d and according to that I am controlling the system.
Now the problem is suppose, I opened two tabs in the same browser with the same url and log in with same user id. Now log out from one tab. Then go to the other tab. User can perform any action for that small application which is running inside the iframe, until the page is not refreshed . But it should not be.
Please help me how to fix this issue.
You have to perform the check server side anyway, so in quiz_main.php you'll need something like
<?php
if(!user_is_logged_in())
// Redirect to login
?>
To prevent the user from performing any actions that will affect data on the server.
You can also do a check client side using JavaScript. You can poll the server every n seconds to check if the user still is logged in, and if not redirect the user to the appropriate page.
Example below with jQuery
function logged_in() {
$.ajax({
url: '/logged_in.php',
type: 'post',
success: function(data) {
data = $.parseJSON(data);
if(data['logged_in'] != true)
window.location('login.php');
else
setTimeout('logged_in()', 5000); // calling itself in 5 seconds.
}
});
}
$(document).ready(function() {
logged_in(); // Calling first time when the document is ready.
});
Just a rough sketch on how this could be done. You'll need a logged_in.php to handle to your request of course.
I have made an app as a Page Tab. I need to redirect to the facebook-app if someone opens the website url directly. For that, I need to check the content of the address bar and if it doesn't contain www.facebook.com inside it, I will redirect to the facebook-app url. But, the problem is that inside the facebook iframe I am unable to get the content of the address bar.
Can you please tell me a good way to enable redirect to the fb-app in case someone accesses my website url directly?
Probably the easiest way to achieve this, is to do next check in JavaScript:
if (window.top !== window){
window.location = 'http://facebook.com/YOUR_PAGE?sk=v_YOUR_APP_ID'
}
If you are wanting to redirect to a tab, a more complete way of doing this is checking for the 'page' parameter that is only sent through in the signed request for a page tab.
The reason being that only checking for the signed request will allow users to access your 520px tab app in a Facebook canvas (i.e. https://apps.facebook.com/yourapp which may not be what you want.
So for example
$fb = new Facebook( array(
'appId' => <your_app_id>,
'secret' => <your_app_secret>);
$sr = $fb -> getSignedRequest();
And then redirect the user as they hit the page
if (!($sr['page'])) {
die('<script>window.top.location = "<your_tab_url>"</script>');
};
Facebook posts a signed request parameter when you open an app in fanpage.
You can check if that parameter is null or not.
In php,
if(isset($_REQUEST["signed_request"]){
// Opened in facebook
}else{
//opened outside facebook.
}
In asp.net
if(Request.Form["signed_request"] !=null)
{
// Opened in facebook
}
else
{
// opened outside facebook.
}
My app sits outside facebook canvas.
The facebook request dialog 2.0 only redirects to canvas url
eg. apps.ibibo.com/YOURAPP.
How can I make it open a custom url ?
This was possible in legacy FBML form with fb:request-form and setting req-url .
Are requests 2.0 restricted only to inside facebook URLS ?
My requirement is to send game requests,but my game sits outside facebook.
i.e. on clicking "ACCEPT" the url to open should be
"http://www.mydomain.com/mygame" and not
"http://apps.facebook.com/mygame" .
These methods do not seem to fit my requirement :
http://developers.facebook.com/docs/reference/dialogs/requests/ ( only canvas url redirection )
I thought of one workaround as :
The user clicks on "ACCEPT" and comes to the canvas url, and from the canvas url, I redirect him to my url outside facebook. But I am not sure if that is compliant with facebook policy ? ( mentioned here in point#4 of first paragraph : http://developers.facebook.com/blog/ )
Need a jquery script to override the default function of facebook. However this works only when the person goes to "http://apps.facebook.com/mygame" and click on 'add app'.
Simpler to just have a welcome page, users click on "PLAY" and it opens a new window into your page.
Read more: http://developers.facebook.com/blog/post/525/ - good luck coding!
Put <button id="fb-auth">Login</button> somewhere on mygame page and add this javascript code:
function updateButton(response) {
//Log.info('Updating Button', response);
var button = document.getElementById('fb-auth');
if (response.status === 'connected') {
//button.innerHTML = 'Logout';
button.onclick = function() {
FB.logout(function(response) {
//Log.info('FB.logout callback', response);
});
};
} else {
//button.innerHTML = 'Login';
button.onclick = function() {
FB.login(function(response) {
//Log.info('FB.login callback', response);
if (response.status === 'connected') {
//Log.info('User is logged in');
window.open("http://xxxxxxxxxxxxxxxx/some.html");
} else {
//Log.info('User is logged out');
}
});
};
}
};
// run it once with the current status and also whenever the status changes
FB.getLoginStatus(updateButton);
FB.Event.subscribe('auth.statusChange', updateButton);
Unfortunately the accept button right now will always take you to the application page as you are seeing and there is no way right now to have it go elsewhere. You would have to redirect them from the canvas page. However, I don't see this as being against the Facebook policy though as Facebook requests can be originally sent from outside of Facebook using the iframe plugin. If you wanted to be able to put in an outside url for the accept button, I would log a feature request with Facebook.
I am trying to create a welcome tab for one of my pages, but I would like to be able to access a users likes (permission user_likes).
I can only find documentation on how to do this for a Facebook app or a website integrating Facebook, I can find no documentation on how to do this for an app (tab) inside a facebook page (as a welcome tab).
Is it possible as a page tab to request extra permissions from the user but allow page access without it, or is it a case or me having to make an application as well as a page tab? Could I perhaps have a button that when they click it grants the page extra permissions?
I am currently trying two separate implementations, neither of which I can get to work, PHP and Javascript.
Thanks,
Just using
$loginUrl = $fb->getLoginUrl(
array('canvas' => 1, 'scope' => 'user_likes,user_about_me,user_birthday')
);
echo "<a href='$loginUrl'>Login</a>";
Results in a link, which just redirects the user (within the pages iframe) to a screen with the Facebook logo. I want a permissions dialog!
Using the javascript code
<script>
FB.init({
appId : 'APPID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
oauth : true // enable OAuth 2.0
});
FB.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
FB.logout(function(response) {
console.log('Logged out.');
});
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'email'});
</script>
Results in
Unsafe JavaScript attempt to access frame with URL https://www.facebook.com/dialog/oauth?api_key=158609350887973&app_id=158609350887973&client_id=158609350887973&display=popup&locale=en_US&method=permissions.oauth&origin=1&redirect_uri=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D3%23cb%3Df2f7aed38%26origin%3Dhttp%253A%252F%url.com%252Ff3634c5da%26relation%3Dopener%26transport%3Dpostmessage%26frame%3Df9748b77&response_type=token%2Csigned_request&scope=email&sdk=joey from frame with URL http://url.com/gs/index.php. Domains, protocols and ports must match.
The javascript also opens the following error popup box
My app config settings
You're seeing the error in your popup window because the redirect_uri in your authorization URL doesn't match what's listed in your Site URL in app config. To address this, you need to enable the "Website" option in app config. Enable it by clicking on the checkbox next to "Website" and then enter http://Site.com (or whatever your real site url is) in the "Site URL" text box. This URL must match the host url you're providing in redirect_uri. Doing this should solve the popup window error.
In terms of the "Unsafe JavaScript attempt to access frame" error, are you using a webkit browser? Webkit throws these errors but for the most part can be ignored. See this for more info: "Unsafe JavaScript attempt to access frame with URL..." error being continuously generated in Chrome webkit inspector
Use the user id in the response object instead of 'me' when you call FB.api
Both methods point to the fact you don't have your website domain settings correct in the app settings.
We do this exact thing on a lot of our tab apps so it's definitely possible.
It looks like you're using the same value for app_id and api_key. These should be different.
Instead of displaying the link ($loginUrl) try to redirect user, for example using php header function or js location.href.
Yes it is possible.
Read: http://www.masteringapi.com/tutorials/how-to-ask-for-extended-permission-in-your-facebook-application/32/