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.