openid / openid/AppAuth-JS

RedirectRequestHandler performAuthorizationRequest method - How to safely pass base64 encoded string as query parameter value?

Open
#220 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
1k
Forks
165
PR merge metrics
No merged PRs in 30d

Description

Expected Behavior

Given a key/value pair preselectedExternalProvider: "YmFzZTY0IHN0cmluZyB2YWx1ZQ==" is passed into the extras scope of the AuthorizationRequest constructor
When the RedirectRequestHandler calls buildRequestUrl
Then the query parameter in the URL is &preselectedExternalProvider=YmFzZTY0IHN0cmluZyB2YWx1ZQ==

[REQUIRED] Describe expected behavior

I expect base64 strings to be passed as query parameters safely (without special character encoding)

Describe the problem

The == delimiter is being encoded in the authorization request URL created by buildRequestUrl within the performAuthorizationRequest call

[REQUIRED] Actual Behavior

Given a key/value pair preselectedExternalProvider: "YmFzZTY0IHN0cmluZyB2YWx1ZQ==" is passed into the extras scope of the AuthorizationRequest constructor
When the RedirectRequestHandler calls buildRequestUrl
Then the query parameter in the URL is &preselectedExternalProvider=YmFzZTY0IHN0cmluZyB2YWx1ZQ%3D%3D

[REQUIRED] Steps to reproduce the behavior
  1. Construct the authorization request using the AuthorizationRequest constructor
    a. add this key/value pair in the extras scope: preselectedExternalProvider: "YmFzZTY0IHN0cmluZyB2YWx1ZQ=="
  2. Use this request and call performAuthorizationRequest
  3. Check the preselectedExternalProvider query parameter's value in the network tab after being redirected
[REQUIRED] Environment
  • AppAuth-JS version: 1.3.1
  • AppAuth-JS Environment (Node, Browser (UserAgent), ...): Browser (React)
  • Source code snippts (inline or JSBin)
    let request = new AuthorizationRequest({
      client_id: config.client_id,
      redirect_uri: config.redirect_uri,
      scope: config.scope,
      response_type: AuthorizationRequest.RESPONSE_TYPE_CODE,
      state: undefined,
      extras: {
        access_type: "offline",
        prompt: "consent",
        grant_type: GRANT_TYPE_AUTHORIZATION_CODE,
        preselectedExternalProvider: config.preselectedExternalProvider,
      },
    });

    if (this.configuration) {
      this.authorizationHandler.performAuthorizationRequest(
        this.configuration,
        request
      );
    } else {
      console.log(
        "Fetch Authorization Service configuration, before you make the authorization request."
      );
    }

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with RedirectRequestHandler.performAuthorizationRequest and its buildRequestUrl call, then inspect how the AuthorizationRequest extras become query parameters. Reproduce the provided preselectedExternalProvider value in a browser and verify the resulting URL against the expected encoding behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
authentication
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.