Authorization Tokens that keep Expiring
I created a widget, that allows an Instructor or Admin level to create a course using a form and entering a title, and the rest is generated for the user. Doing so requires an API POST command that requires a token. What I'm finding is the token keeps expiring. I have the auto-refresh token turned on, but this didn't fix the issue, I also went through the documentation for creating a refresh token but it's not working. When the original token expires, I no longer have the ability to create courses through the widget. Is it how I have the code set up in my javascript or is it somehow not possible? https://community.brightspace.com/s/article/How-to-obtain-an-OAuth-2-0-Refresh-Token
Answers
-
Hi Justin;
There is a process to "Upgrade" your oAuth2 token to ensure that it becomes a revolving token. The fact that you are experiencing the time out is an indicator that refresh token hasn't been completed properly, or maybe somehow that token lost its revolving status. That is the correct article (Refresh Token Article) to help you with that process.
This video does walk through the process and it requires Node.JS (and PowerShell if you'd like) to set this process up:
Make sure at the end of the process to use the renewing token information in the application as that can also be a point that will cause issues.
Kind regards;
Bruce
-
@Bruce Bur375 Bruce, I appreciate your response to my question, but unfortunately, this is the same article I used to create the refresh token used in my code. It worked for a couple of hours and then it started to fail. When running the code, I could see in the console that it tried over and over to issue a new token but would jump between 400 and 401 errors and would just not connect. It doesn't stop trying to access it and will just repeat 400-401 infinite times. But if I create a new token, it would take that one, but the refresh token created from the steps did not work. I'm wondering now if the issue isn't the token, but the code I'm using to try and refresh the token.
-
Leave it with me for a bit of time as I'll work with some internal stakeholders to try to get you a better answer than what was provided and circle back once I have more information. (Give me a few days).
Kind regards;
Bruce
-
@Bruce Bur375 Thank you, I appreciate your time. I've attached the console-text for reference regarding the error message. I used the app, in the documentation you provided, yesterday to create the refresh token. You can see from the data that the refresh token failed. Since I'll be running this widget in D2L with only Admin and Instructor permissions to view the widget, is it possible to run a POST without the needed authorization token?
-
Hi Justin;
After conversing with my colleagues - the syntax I think you seeking is to identify the user who is logged into Brightspace. In order to satisfy this within a widget in Brightspace you need to use some Java Script to seek the user logged-in token information.
If you are looking in the developer tools - you'll see an option named "XSRF.Token" under Dev Tools > Application > Local storage:
You'll see the "Token" information will show you what is in memory and that expires when the session concludes (the time is located here with a numeric value (underlined in green).
To that end - you'll need to use something like the below syntax to handle the present user's token to validate if the user in question has permission to interact with your widget.
You can use the below syntax to ensure that the widget can fetch who the user is:
async function BrightspaceFetch(fetchMethod, fetchUrl, fetchData)
{
console.log('BrightspaceFetch')
const headers = {
"Content-Type": "application/json",
"Access-Control-Origin": "*",
"X-Csrf-Token": localStorage["XSRF.Token"],
};let options = {
"headers": headers,
"method": fetchMethod,
"credentials": "include"
};let strToSend = '';
if (fetchData !== null)
{
const objToSend = {};
objToSend.Data = JSON.stringify(fetchData);
console.log(objToSend.Data)
strToSend = JSON.stringify(objToSend);
options = {
"headers": headers,
"method": fetchMethod,
"credentials": "include",
"body": (objToSend.Data),
};
}const res = await fetch(fetchUrl, options);
const result = {
"status": res.status,
"data": {}
}if (res.status === 200)
{
result.data = await res.json();
return result;}
document.getElementById("demo").innerHTML = "Sorry something went wrong please try reloading the page or the username already exists"
console.log(res)
console.log('BrightspaceFetch - After fetch');document.getElementById("form").reset();
}async function getWhoAmI()
{
let URL = "https://"+window.location.hostname +"/d2l/api/lp/1.0/users/whoami"
let whoami = await BrightspaceFetch('GET', URL, null)
console.log(whoami.data)
document.getElementById("demo").innerHTML = JSON.stringify(whoami.data, undefined, 2)
}
Let me know if this syntax is helpful to answer your question.
Kind regards;
Bruce
-
@Bruce Bur375 Thank you for the information, I'll look into what you have posted. But this brings in a new question, what is Dev Tools > Application > Local storage? Is this an add-on for D2L? I see nothing in D2L Admin panel? I also don't see in permission where I can turn that on.
-
Hi @Justin.Bamberg3364 - This is not a built-in Brightspace function - this comes from the Browser Developer tools. Use F12 in Chrome or MS Edge > Goto the application tab in the Browser Developer tools and that will provide you with a visual reference (based on what I posted in my earlier post). This key combination may change depending on what version/type of browser you are using.
-
@Bruce Bur375 Thank you. I'll explore today. Again, thank you for all the information.
