We are aware of the issue with the badge emails resending to everyone, we apologise for the inconvenience - learn more here.

Forum Discussion

blueprintbroadcasting's avatar
blueprintbroadcasting
Explorer | Level 4
3 years ago

Javascript SDK - Auth, getting tokens, setting tokens

Hello!

Im building a React app with the Javscript SDK and am having issues getting a refresh token and access tokens (browser-side, not backend).

 

Im setting up DropboxAuth

 

const dbxAuth = new DropboxAuth({
clientId: '90dgr7j93zv48ct',
clientSecret: process.env.REACT_APP_SECRET
})
 
then using it when my component mounts to get a token (using my OAuth code)

try {
dbxAuth
.getAccessTokenFromCode(null, process.env.REACT_APP_OAUTH_TOKEN)
.then((token) => {
console.log(`Token Result:${JSON.stringify(token)}`)
dbxAuth.setAccessToken(token.result.access_token)
})
} catch (error) {}
 
getAccessTokenFromCode is giving me a 400 error :
I cant figure out what i'm doing wrong
  • Greg-DB's avatar
    Greg-DB
    3 years ago

    It's not possible to make new access tokens long-lived; for long-term access without manually re-authorizing the app, you would use refresh tokens. Refresh tokens don't expire automatically and can be used to programmatically retrieve new short-lived access tokens whenever needed.

     

    For examples of implementing this with the Dropbox JavaScript SDK, please refer to the examples included in the "examples" folder in the SDK. As long as you set the app key (a.k.a. client ID) and refresh token, like shown in this example for the JavaScript SDK, the SDK will actually handle refresh process for you automatically. The SDK will automatically catch expired access token errors and call the API to get a new short-lived access token when needed.

     

    It sounds like you want all of your end-users to connect to your own Dropbox account though. The API was designed with the intention that each user would link their own Dropbox account, in order to interact with their own files. While it is technically possible to always connect to just one account for all users, we do not officially support this, for various technical and security reasons.

  • Greg-DB's avatar
    Greg-DB
    Icon for Dropbox Staff rankDropbox Staff

    Try adding this error handling to the getAccessTokenFromCode call to get a more specific error message from the error response:

        .catch(function(error) {
          console.error(error.status);
          console.error(error.error);
        });

     

    • blueprintbroadcasting's avatar
      blueprintbroadcasting
      Explorer | Level 4

      react_devtools_backend.js:4026

      1. {error: 'invalid_grant', error_description: "code doesn't exist or has expired"}
        1. error: "invalid_grant"
        2. error_description: "code doesn't exist or has expired"
        3. [[Prototype]]: Object

           

          I generated this code yesterday through the browser Oauth url.  I thought it was one and done.  Is there a way to programmatically refresh the Oauth code? 

      • Greg-DB's avatar
        Greg-DB
        Icon for Dropbox Staff rankDropbox Staff

        The code you pass to getAccessTokenFromCode is an "authorization code". Authorization codes are only valid for a short period time, and can each only be used once. Once you use the authorization code to retrieve an access token and optionally a refresh token, you can no longer use that authorization code again. You should instead store and re-use the access token and optionally the refresh token. Those can be re-used programmatically.

About Dropbox API Support & Feedback

Node avatar for Dropbox API Support & Feedback

Find help with the Dropbox API from other developers.

5,877 PostsLatest Activity: 12 months ago
325 Following

If 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!