First up, apologies for any ignorance here…I’m new to coding and mid-way through a Udemy JavaScript course. Looks like I clearly need to revisit a few lectures, but thought I’d try a first post on here…
Can anyone please explain why the ‘athleteObject’ value returned from the ‘checkToken’ function is ‘Promise’ even though the typeOf is an Object as expected?
The script is just the OAuth2 authorisation part of a simple app to get training data from Strava. It’s for personal use only and hosted locally for now, hence the hard-coding of client id’s/secrets and unencrypted handling of user data.
// Parse query string to see if page request is coming from OAuth 2.0 server.
let params = {};
let regex = /([^&=]+)=([^&]*)/g,
m;
while ((m = regex.exec(location.href))) {
params[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
}
if (Object.keys(params).length > 0) {
localStorage.setItem("authInfo", JSON.stringify(params));
}
window.history.pushState({}, document.title, "/" + "home.html");
let info = JSON.parse(localStorage.getItem("authInfo"));
const authCode = info["code"];
let athleteObject = {};
**athleteObject **= Exchange(authCode);
console.log(typeof athleteObject, athleteObject); //**returns: 'Object', 'Promise'**
// Exchange the Authorization Code for a Refresh Token and Access Token
async function Exchange(authCode) {
const auth_link = "https://www.strava.com/oauth/token";
const res = await fetch(auth_link, {
method: "POST",
headers: {
Accept: "application/json, text/plain, */*",
"Content-Type": "application/json",
},
body: JSON.stringify({
client_id: "12345",
client_secret: "12345abcdeEtcEtc",
code: authCode,
grant_type: "authorization_code",
}),
});
const resObject = await res.json();
console.log(`Auth Code Exchange Response`, resObject);
await checkToken(resObject);
}
// Check access token validity
function checkToken(resObject) {
// console.log(resObject);
if (Number(resObject.expires_in) > 3600) {
const athleteObject = resObject;
console.log(`valid token`, athleteObject);
console.log(typeof athleteObject);
return athleteObject;
} else {
const athleteObject = ReAuthorise(resObject.refresh_token);
console.log(`refreshed token`, athleteObject);
console.log(typeof athleteObject);
return athleteObject;
}
}
// Refresh Expired Access Token
async function ReAuthorise(refreshToken) {
console.log(`refresh token passed to Refresh Token block`, refreshToken);
const auth_link = "https://www.strava.com/oauth/token";
const res = await fetch(auth_link, {
method: "POST",
headers: {
Accept: "application/json, text/plain, */*",
"Content-Type": "application/json",
},
body: JSON.stringify({
client_id: "12345",
client_secret: "12345abcdeEtcEtc",
grant_type: "refresh_token",
refresh_token: refreshToken,
}),
});
const resObject = await res.json();
console.log(`Refresh Request Response`, resObject);
return resObject;
}
When I check the typeOf within the function block prior to returning, it’s an object (and the object contents are visible in the console); however, when the value is returned and logged, it displays as ‘promise’.
2
Answers
ReAuthorize is an async function, it will always return a Promise. So if you hit your else block in your checkToken function, athleteObject will get assigned a Promise. Your validation still works, because Promises are objects. You should either await the Promise resolving or chain a callback.
//the Exchange(authCode) returns nothing.Change last line: