Unable to log in Dailymotion user using JS SDK - oauth-2.0

I have a React app from which I want to upload videos to the account of the logged in user. I have successfully done this retrieving tokens manually and calling the API but can't find a way to log in using the JS SDK in my React app.
I present the user with a button for log in:
e.preventDefault()
window.DM.login(
function (response) {
if (response.session) {
// user successfully logged in
console.log(response)
} else {
// user cancelled login
console.log(response)
}
},
{
client_id: my_id,
scope: "read write",
response_type: "code"
}
)
}
The login popup appears, I log in and get sent to the callback url. However, refreshing the original site, or the callback popup, still shows as no session and without login. I check with:
status === 'ready' &&
window.DM.getLoginStatus(function (response) {
if (response.session) {
// logged in and connected user, someone you know
console.log(response)
} else {
// no user session available, someone you dont know
console.log(response)
}
})
})
and I always get { status: "unknown", session: null }
Loading the SDK is handled with a hook const status = useScript('https://api.dmcdn.net/all.js')
Do I need to handle something manually from the callback page? Isn't the SDK supposed to handle it in the background? I would appreciate some insights on what I might be doing wrong.
Thanks.

As always, I spent hours trying to find a solution and, as soon as I post, I find it:
Client_id and response_type must not be passed in DM.login.
Instead, you have to pass the API key in DM.Init, like so:
useEffect(() => {
status === 'ready' &&
window.DM.init({
apiKey: '123456789',
status: true, // check login status
cookie: true // enable cookies to allow the server to access the session
});
})
This brings up the popup and after inputting the credentials the SDK correctly detects the session, closing the popup and authing the user.

Related

How to cancel setupIntent?

Upon a user's registration, I have successfully created a setupIntent and attached a payment method to a customer. However, I give the option for the user to add the payment method later in settings by pressing the "Later” button. When this button is pressed I'd like to cancel the setupIntent.
I have the following on my server:
exports.cancelSetupIntent = functions.https.onCall(async (data, context) => {
const clientSecret = data.clientSecret;
const setupIntent = await stripe.setupIntents.cancel(
clientSecret
);
});
and I call this from the client when the "Later" button is pressed using the following:
func cancelSetupIntent() {
FirebaseReferenceManager.functions.httpsCallable("cancelSetupIntent").call(["clientSecret": self.setupIntentParams?.clientSecret]) { (response, error) in
if let error = error {
print("failed to cancel setup intent: \(error.localizedDescription)")
} else {
print("setupIntent cancelled")
}
}
}
However, I am getting an error saying: "No such setupIntent: "seti_..."
The error displays the same client secret that was created when the page opened.
Any help would be very much appreciated! :)
When cancelling a Setup Intent you should be using the Setup Intent ID (seti_xxx), not the Setup Intent client secret (seti_xxx_secret_yyy).
In order to get the Setup Intent ID on your frontend to send it back to your server you have two options:
When you initially create the Setup Intent server-side and send the client secret client-side, also send back the ID. Then when you need to cancel the Setup Intent you'd just send back the ID to your server.
Retrieve the Setup Intent client-side using the client secret to get the ID before sending it back to your server.

How to detect that the current request is an authentication callback?

I have a single-page JavaScript application and I'm using the Auth0 service for signup/login.
I have integrated the Lock widget and I'm saving a string to localStorage after a user is authenticated, like so:
lock.on("authenticated", function(authResult)
{
localStorage.setItem('login', authResult.idToken);
}
The problem is that when Auth0 redirects them back to my application after logging in, the authenticated event is fired only after page loaded, but by that time, I've already done the check to see if the localStorage string is set (which it is not); therefore, the user just keeps getting asked to login again:
if(localStorage.getItem('login') == undefined)
{
lock.show(function(err, profile, token)
{
// ...
}
}
I tried to see if there was anything special passed in to the page after a callback - but the referrer isn't always there.
If I don't automatically prompt the user to login, but instead show a login button - the authenticated event never fires for some reason.
How do I get around this?
Based on the information provided you seem to be using Lock in redirect mode and if that's the case you can use the hash_parsed event as a way to know if Lock found a response that it will process.
Every time a new Auth0Lock object is initialized in redirect mode (the default), it will attempt to parse the hash part of the URL, looking for the result of a login attempt. After that, this event will be emitted with null if it couldn't find anything in the hash. It will be emitted with the same argument as the authenticated event after a successful login or with the same argument as authorization_error if something went wrong.
Leveraging this event you could do the following:
Subscribe to the hash_parsed event:
If hash_parsed is emitted with null and localStorage has no indication the user already logged in then redirect to login.
If hash_parsed is emitted with a non-null value that either the authenticated or authorization_error will be emitted and you can react accordingly.
Some sample code:
lock.on("hash_parsed", function (response) {
if (!response && !localStorage.getItem('login')) {
// Redirect to the login screen
} else {
// Either the user is already logged in or an authentication
// response will be processed by Lock so don't trigger
// an automatic redirect to login screen
}
});

How to login with Facebook javascript SDK in hybrid HTML5 based application

I'm building an hybrid app for Android and iPhone based on html5. I want to implement in my app login with Facebook. All the Html on the application are a local on the device; I don't have a server so I want to save the token from Facebook in the local storage. Is it possible to implement this with Facebook javascript SDK?
I tried the code from Facebook developer site:
<html>
<head></head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{your-app-id}',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Here we subscribe to the auth.authResponseChange JavaScript event. This event is fired
// for any authentication related change, such as login, logout or session refresh. This means that
// whenever someone who was previously logged out tries to log in again, the correct case below
// will be handled.
FB.Event.subscribe('auth.authResponseChange', function(response) {
// Here we specify what we do with the response anytime this event occurs.
if (response.status === 'connected') {
// The response object is returned with a status field that lets the app know the current
// login status of the person. In this case, we're handling the situation where they
// have logged in to the app.
testAPI();
} else if (response.status === 'not_authorized') {
// In this case, the person is logged into Facebook, but not into the app, so we call
// FB.login() to prompt them to do so.
// In real-life usage, you wouldn't want to immediately prompt someone to login
// like this, for two reasons:
// (1) JavaScript created popup windows are blocked by most browsers unless they
// result from direct interaction from people using the app (such as a mouse click)
// (2) it is a bad experience to be continually prompted to login upon page load.
FB.login();
} else {
// In this case, the person is not logged into Facebook, so we call the login()
// function to prompt them to do so. Note that at this stage there is no indication
// of whether they are logged into the app. If they aren't then they'll see the Login
// dialog right after they log in to Facebook.
// The same caveats as above apply to the FB.login() call here.
FB.login();
}
});
};
// Load the SDK asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
// Here we run a very simple test of the Graph API after login is successful.
// This testAPI() function is only called in those cases.
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
}
</script>
<!--
Below we include the Login Button social plugin. This button uses the JavaScript SDK to
present a graphical Login button that triggers the FB.login() function when clicked. -->
<fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button>
</body>
</html>
But I get the following error in browser console:
"Given URL is not allowed by the Application configuration.: One or
more of the given URLs is not allowed by the App's settings. It must
match the Website URL or Canvas URL, or the domain must be a subdomain
of one of the App's domains. "
In your apps config.xml you should have something like <access origin="*">

Facebook UI dialog callback not fired

I am using forge.facebook.ui to send app requests to users. The dialogue opens as expected and selects the correct user to send the invite to. However it appears the callbacks (success or error) are never fired when the user clicks 'send'. Code example below:
forge.facebook.ui(
{
title: 'Invite your Friend,
method: 'apprequests',
to: 1234567,
message: 'Sign up'
},
function(response) {
forge.logging.info(response); // Never Called
},
function (e) {
forge.logging.info('facebook failed: ' + JSON.stringify(e)); // Never Called
}
);
In the past this was working correctly.
This did turn out to be a bug introduced in a recent Forge version, I've just committed a fix which will be in the next Forge platform version, which we should be deploying tomorrow (06/11/2012).

Application Error when logging in with JavaScript SDK, using oauth opt in login

Here is my code:
FB.init({
appId : this.api_id,
status : true,
cookie : true,
xfbml : true,
oauth : true,
channelUrl : 'https://blah.com/facebook/channel' // custom channel
});
FB.login(function(response) {
if (response.authResponse) {
if (response.perms) {
// user is logged in and granted some permissions.
if(typeof redirect === 'function') {
redirect();
}else {
window.location = redirect;
}
} else {
// user is logged in, but did not grant any permissions
}
} else {
// user is not logged in
}
},{
scope: 'email'
}
);
So what happens is that if i have oauth no set in FB.init everything works fine but if i add in
oauth is true then i will get back
<span>Application Error: There was a problem getting data for the application you requested. The application may not be valid, or there may be a temporary glitch. Please try again later. </span>
from the request to /dialog/oauth
I followed all the roadmap to oauth 2 here https://developers.facebook.com/blog/post/525/
and still no luck, something seems a bit off here.
And no all the code posted in not all the code i have, before FB.login gets called i make sure
FB.init has already been called. Any help greatly appreciated
Check if your application is in sandbox mode. If it is, switch sandbox mode off and try again.
If sandbox mode is on FB will not recognize your app and a call to Facebook.init will fail silently, when you are not logged in, returning the response 'Application Error: There was a problem getting data for the application you requested. The application may not be valid, or there may be a temporary glitch. Please try again later.'

Resources