dropbox-sdk-js icon indicating copy to clipboard operation
dropbox-sdk-js copied to clipboard

PKCE-Flow fails at generating code verifier for some btoa implementations / older browsers

Open FloppyNotFound opened this issue 3 years ago • 1 comments

Describe the bug The signature of the btoa function is: declare function btoa(data: string): string;

When generating the code verifier, not a string representation, but the Uint8Array directly is passed into the btoa function, which leads to an error in some older browser versions.

To Reproduce Debug the application for example in Firefox version 48.0. Set a breakpoint in the function generatePKCECodes after the line "var base64String". A much too short code varifier will be created, which leads to an error when trying to login.

Expected Behavior The randomValueArray created to generate the codeVerifier should be parsed into a string before using it as a parameter for the btoa function. The code challenge already has a correct implementation.

Actual Behavior For debugging purposes, I used a reference implementation of btoa. It seems like some btoa implementations parse the input value (which is expected to be a string) once more to a string, which leads to the following behavior:

The input value is still of type Uint8Array, but the btoa function is expecting a string. The btoa method parses the input value to a string, just to be sure, it seems, which leads to the literal string "[object Uint8Array]", which then again results in a much too short (and not random any more) code varifier (see screenshot below).

Screenshots It is done correctly when generating the code challenge, note how String.fromCharCode.apply is called on the Uint8Array, before calling btoa: image

Exactly this part is missing when generating the code verifier: image

Note how parsing the btoa input value to a string leads to an input value of literally "[object Uint8Array]": image

Note how this leads to a much too short base64String and codeVerifier being generated (it seems to literally translate "[object Uint8Array]") into "W29iamVjdCBVaW50OEFycmF5XQ==" each and every time: image

Note the diff I have added to the method "generatePKCECodes" to fix this issue: image

Versions

  • What version of the SDK are you using? 9.4.0
  • What version of the language are you using? Typescript 4.1.0
  • Are you using Javascript or Typescript? Typescript
  • What platform are you using? (if applicable) Firefox 48.0 / Gecko 48.0

Additional context -

FloppyNotFound avatar Apr 02 '21 19:04 FloppyNotFound

Thanks for the detailed writeup!

greg-db avatar Apr 02 '21 20:04 greg-db