We are aware of the issue with the badge emails resending to everyone, we apologise for the inconvenience - learn more here.
Forum Discussion
seenigel
4 years agoExplorer | Level 3
Need help generating a pkce refresh token in a javascript PWA
Hi folks, I'm running into some trouble with the new authentication flow.
I've got a single page, severless JS PWA and I want to use Dropbox to store the user's data without forcing them to authenticate every four hours or each time they re-open the app. I've been using the old oauth flow and storing the long-lived token in localstorage and it's been fine, but I'm unclear about what to store from the pkce flow.
I'd ideally like to store the refresh token in localstorage and use that to generate short-lived tokens as needed, but the documentation isn't quite clear. I'm trying to follow the example in the js sdk for generating a token (https://github.com/dropbox/dropbox-sdk-js/blob/main/examples/javascript/pkce-browser/index.html), but this example only shows the initial authentication: sending the user to the authentication page, and retrieving the first short-lived token (line 97). It doesn't show how to use the refresh token to generate subsequent tokens.
I know that in the response from dbxAuth.getAccessTokenFromCode includes the refresh token (line 96 and line 97), but I'm not quite sure how to generate short-lived tokens with it. I see in the sdk there's a function called checkAndRefreshAccessToken() that returns a promise, but it's returning empty when I call it.
TLDR: How do I alter this example (https://github.com/dropbox/dropbox-sdk-js/blob/main/examples/javascript/pkce-browser/index.html) to store the refresh token and use it to generate short-lived tokens down the road?
Yes, if you need long-term access without having the user re-authorize, you should request "offline" access to get and use a refresh token to get new short-lived access tokens as needed.
There's a "PKCE-backend" example that shows how you can request this kind of access, and then set the resulting refresh token using setRefreshToken. The SDK will then automatically handle the refresh process for you when needed.
- Greg-DBDropbox Staff
Yes, if you need long-term access without having the user re-authorize, you should request "offline" access to get and use a refresh token to get new short-lived access tokens as needed.
There's a "PKCE-backend" example that shows how you can request this kind of access, and then set the resulting refresh token using setRefreshToken. The SDK will then automatically handle the refresh process for you when needed.
- seenigelExplorer | Level 3
Thanks so much! That solved it!
Message for future PWA developers: the solution is a mash-up of the browser frontend example (https://github.com/dropbox/dropbox-sdk-js/blob/main/examples/javascript/pkce-browser/index.html) and the node backend example. (https://github.com/dropbox/dropbox-sdk-js/blob/main/examples/javascript/PKCE-backend/code_flow_example.js). Once you store the refresh token, the api will take care of all the short-lived tokens automatically.
About Discuss Dropbox Developer & API
Make connections with other developers
795 PostsLatest Activity: 7 days agoIf you need more help you can view your support options (expected response time for an email or ticket is 24 hours), or contact us on X or Facebook.
For more info on available support options for your Dropbox plan, see this article.
If you found the answer to your question in this Community thread, please 'like' the post to say thanks and to let us know it was useful!