Redirect to an application on fan page - facebook-page

First, sorry for my bad English.
I've an app which is installed on multiple fanpages.
I want an apprequest dialog in this app. When the user click on invite button he sees an apprequest dialog to invite friends but the notificacion redirect to the canvas page not to app on fan page.
I use this code:
<head>
<title>Request Example</title>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<p>
<input type="button"
onclick="sendRequestViaMultiFriendSelector(); return false;"
value="Send Request to Many Users with MFS"
/>
</p>
<script>
FB.init({
appId : '123456789',
status : true,
cookie : true,
oauth: true
});
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'Example message',
show_error: true,
redirect_uri: 'https://www.facebook.com/pages/PAGE_ID?sk=APP_ID'
}, requestCallback);
}
function requestCallback(response) {
// Handle callback here
}
</script>
</body>
What am I doing wrong? Configuration of Canvas Page? Redirect Uri?
Thanks!

You're not doing anything wrong, requests are always 'delivered' to the canvas URL when accepted.
You need to include some data with the requests that your app can use to decide which page to redirect to.
Easiest way to do this is to use the data parameter of the Requests dialog.
So in your request sending code:
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'Example message',
show_error: true,
data: "PAGE_ID_OR_SOME_OTHER_DATA_HERE",
redirect_uri: 'https://www.facebook.com/pages/PAGE_ID?sk=APP_ID'
}, requestCallback);
}
Then when processing the accepted request on the app's canvas, check the data parameter of the request object (a GET request to /REQUEST_ID_HERE will return it) and decide which page to redirect to based on that

Related

Google sign-in sends multiple requests on redirect

I'm trying to implement Google sign-in on my web application, as an add-on to normal server-side authentication. The problem is,I'm not able to redirect the page to a Servlet to go to the user homepage. Instead, whenever I try to redirect ONCE,I get continuous requests to the next Servlet(I used print statements on the Servlet to check this).It seems as if the page reloads after every request sent to the Servlet. I also tried using form data to fix this, but that doesn't work either.
How do I stop this from happening? I'm a newbie, so any dumbing down will be much appreciated. In case this is a duplicate, please do send the link. I have tried to find a similar question, but have had no luck so far.
Note: I have removed all irrelevant lines of code.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8'>
<script src="https://apis.google.com/js/platform.js" async defer></script>
<meta name="google-signin-scope" content="profile email">
<meta name="google-signin-client_id"
content="CLIENT_ID_HERE">
<script>
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
//document.cookie = "emailId=" + profile.getEmail();
redirectPost(profile.getEmail());
//window.location = "http://localhost:8080/auth/gmailhome";
}
function redirectPost(data) {
var inputElement = document.getElementById('emailId');
var form = document.getElementById("gmailLoginForm");
inputElement.value = data;
form.submit();
}
</script>
</head>
<body>
<form method="post" action="gmaillogin" id="gmailLoginForm">
<input type="hidden" id="emailId" name="emailId">
</form>
<div class="g-signin2" data-onsuccess="onSignIn"></div>
</body>
</html>
I figured out how to solve this issue, and it just occurred to me that I can leave this here in case someone needs it in the future.
The problem we have is that onSignin() gets called as long as the user is signed in, and the status of the user doesn't reflect that they are signed in. I'm not sure why the state isn't changed automatically-perhaps there is some other purpose to this, or this is just low-priority right now.
So, what we do is add a listener that monitors whether or not the user is signed-in.
Something like this
function onLoad() {
gapi.load('auth2', function () {
gapi.auth2.init();
gapi.auth2.isSignedIn.listen(function (isSignedIn) {
this.setState({ status: isSignedIn })
})
})
}

Google Analytics API OAuth after clicking "Allow" cannot connect to local host

I'm trying to obtain an access token for Google Analytics API.
After creating a project in the developers console and granting acess to the Analytics API I reached the "create credentials" step and created new credentials for a web application.
On these credentials I set the Javascript origins to http://localhost:8080 and also http://localhost:5000. Then I set authorized redirect URIs to http://localhost:8080/oauth2callback as well as http://localhost:5000/oauth2callback.
Then, when I attempt to authorize I'm asked to enter my clientId and secret, which I do, then new browser tab opens and I'm asked to choose an account and then after that select "Allow".
Then, when I click "Allow" I'm taken to this page:
I also tried creating credentials for an application type of "other" but the exact same thing happened.
I've found numerous posts on stack overflow about this but none of the answers were able to solve my problem. Not sure which other info to provide. I even tried clearing history and using different browsers but with no success.
How can I give my application authorization to Google Analytics using OAuth?
This issue has nothing to do with localhost or your redirect uris or JavaScript origins. The issue is that your code is not set up to handle the call back from the authentication server. It would have helped if you had posted your code so it will be hard to know what the problem might be.
You should check the official example here Hello analytics js tutorial
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello Analytics Reporting API V4</title>
<meta name="google-signin-client_id" content="<REPLACE_WITH_CLIENT_ID>">
<meta name="google-signin-scope" content="https://www.googleapis.com/auth/analytics.readonly">
</head>
<body>
<h1>Hello Analytics Reporting API V4</h1>
<!-- The Sign-in button. This will run `queryReports()` on success. -->
<p class="g-signin2" data-onsuccess="queryReports"></p>
<!-- The API response will be printed here. -->
<textarea cols="80" rows="20" id="query-output"></textarea>
<script>
// Replace with your view ID.
var VIEW_ID = '<REPLACE_WITH_VIEW_ID>';
// Query the API and print the results to the page.
function queryReports() {
gapi.client.request({
path: '/v4/reports:batchGet',
root: 'https://analyticsreporting.googleapis.com/',
method: 'POST',
body: {
reportRequests: [
{
viewId: VIEW_ID,
dateRanges: [
{
startDate: '7daysAgo',
endDate: 'today'
}
],
metrics: [
{
expression: 'ga:sessions'
}
]
}
]
}
}).then(displayResults, console.error.bind(console));
}
function displayResults(response) {
var formattedJson = JSON.stringify(response.result, null, 2);
document.getElementById('query-output').value = formattedJson;
}
</script>
<!-- Load the JavaScript API client and Sign-in library. -->
<script src="https://apis.google.com/js/client:platform.js"></script>
</body>
</html>

Stripe payment with JMSPaymentBundle "The source parameter is required"

I already integrated JMSPaymentBundle, with paypal every thing works fine!
When I tried to change with stripe from this link for JMS
and using ruudk/PaymentStripeBundle from github, it's actually the same.
But there is a thing. I'm receiving this error: The source parameter is required
In the issues of the bundle, I found that I must use stripe form
<form action=""
method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="MYPUBLISHEDKEY"
data-amount="999"
data-name="Demo Site"
data-description="Widget"
data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
data-locale="auto">
</script>
</form>
This form generates a Token. What I need to know is :
1- Where to put that published token used by JMSPaymentBundle?
2- What action in the form should I do? Is it the same for paypal?
it's hard to say what's going on here but it seems like https://github.com/ruudk/PaymentStripeBundle/ is lacking some necessary documentation.
From what I can tell it's adding a token hidden field to your forms:
https://github.com/ruudk/PaymentStripeBundle/blob/master/src/Form/CheckoutType.php#L12
However, the Checkout embed code you're using won't save the token to that field. I don't see any additional Javascript embedded in this library, so you'll need to build your own using the custom Stripe Checkout integration:
https://stripe.com/docs/checkout#integration-custom
Something like this should work:
var handler = StripeCheckout.configure({
key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh',
image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
locale: 'auto',
token: function(token) {
// NOTE: assuming that the field injected by the library has an ID of "token"--you'll have to check your DOM and possibly adjust this
var field = document.getElementById('token');
field.value = token.id;
// TODO: submit form and send to your backend
}
});
document.getElementById('customButton').addEventListener('click', function(e) {
// Open Checkout with further options:
handler.open({
name: 'Stripe.com',
description: '2 widgets',
zipCode: true,
amount: 2000
});
e.preventDefault();
});
// Close Checkout on page navigation:
window.addEventListener('popstate', function() {
handler.close();
});

Unable to redirect to home page after facebook login in spring security login application

I have implemented spring security in my application for authentication the user.
Its working fine for me.
Now i want to add facebook login to my application. I have implemented it. its giving proper response. When I login with credentials using spring login it redirects to home page, But when I use facebook login button(it displays message "Thanks for logging in, Kuldeep Singh!") control remains on same login page. I want it to redirect to home page as it redirects in case of spring login.
Second problem after logged in by facebook, button still shows the 'log in', I guess after login it should be changed to 'logout'.
If any body has any solution, please let me know.
Thanks
Kuldeep
You should be able to register a JavaScript callback on the login page https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/v2.2
// In your HTML:
<input type="button" value="Login" onclick="FB.login();">
<input type="button" value="Logout" onclick="FB.logout();">
// In your onload method:
FB.Event.subscribe('auth.login', login_event);
FB.Event.subscribe('auth.logout', logout_event);
// In your JavaScript code:
var login_event = function(response) {
console.log("login_event");
console.log(response.status);
console.log(response);
}
var logout_event = function(response) {
console.log("logout_event");
console.log(response.status);
console.log(response);
}

Send notification to user on facebook for app request?

I have encountered a lot of questions for the same but no where have been given any concrete answer
I am sending invites to Facebook friends say a , b ,c and what should happen is a notification should be displayed for the app request
I have seen this in case of PININTEREST which does the same however I am trying to achieve this in asp.net. I found this demo which is very close to what I want to achieve
The code I have so far is :
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<title>Request Example</title>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<p>
<input type="button"
onclick="sendRequestToRecipients(); return false;"
value="Send Request to Users Directly"
/>
<input type="text" value="User ID" name="user_ids" />
</p>
<p>
<input type="button"
onclick="sendRequestViaMultiFriendSelector(); return false;"
value="Send Request to Many Users with MFS"
/>
</p>
<script>
FB.init({
appId : 'XXXXX',
});
function sendRequestToRecipients() {
var user_ids = document.getElementsByName("user_ids")[0].value;
FB.ui({method: 'apprequests',
message: 'XXXXXXX',
to: user_ids,
}, requestCallback);
}
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'My Great Request'
}, requestCallback);
}
function requestCallback(response) {
// Handle callback here
}
</script>
</body>
</html>
EDIT:
When i send the request the user does not get it ... No error is displayed either
Here are two things that might be causing your requests not to go through -
Missing or incorrect canvas URL
Application is in sandbox mode
An application that sends requests to users must have a canvas URL specified in the application's settings. When a user acts on a request (accepts it) he/she is redirected to the application and specifically to the canvas URL. By not specifying a canvas URL your request is deemed invalid by Facebook as there is no where to redirect the user to. The canvas URL can not be apps.facebook.com/namespace because your application does not sit on Facebook's domain. You have to set the URL to your domain. The page that you redirect to should again redirect the user back to your application :
if(!strpos($_SERVER['HTTP_REFERER'],"apps.facebook.com")) {
header("location: "._fb_app_path);
exit();
}
An application in sandbox mode when the user being invited is not listed in the appropriate "roles" group in the application settings. Applications in sandbox mode are only accessable to users who are developers, administrators or testers of that application.
I believe the correct method (at least what we use) is:
function invoke_app_request(){
var receiverUserIds = FB.ui({
method: 'apprequests',
message: 'MESSAGE',
data: '',
max_recipients: AN_INT //this is optional
},
function(response) {
//whatever you do here
}
);
}
I read somewhere (don't take it 100%), that displaying notifications on invites is based on Facebook algorithms and it's not displayed on all apps. It has to do something with app activity and history.

Resources