Add support for cookie value conversion

[garrettmac]

My system is having issues with default encoder for cookies, can you add support for a options value in the config to do the following https://www.npmjs.com/package/js-cookie#converters, i noticed that was a package you use. Or can i open a PR for it?

[bryanapellanes-okta]

@garrettmac, Thanks for reaching out! Feel free to submit a PR for your proposed change(s). Our JavaScript developers will review and comment.

Thanks for using Okta!

[bryanapellanes-okta]

@garrettmac @shuowu-okta @aarongranick-okta I've opened an issue internally for tracking (OKTA-383725); this will go into the backlog for prioritization.

[aarongranick-okta]

@garrettmac We do provide the option for a custom storageProvider, which can implement any custom logic: https://github.com/okta/okta-auth-js#storageprovider

[garrettmac]

I saw that but was the scope kept getting bigger as i way trying to copy your getCookieStorage with this tweak i then had to start using your storageUtil.storage.get, that you dont export so i had to copy that too in your lib/browser/browserStorage.ts

[garrettmac]

I dont need this cookie conversion anymore tho, turns out it the issue wasnt the conversion, its https://github.com/okta/okta-auth-js/blob/236a4a4e54e634a36e004be93a4cda2580198dd2/lib/browser/browserStorage.ts#L161 the cookie size limitations because you're storing the values as objects and that makes cookie sizes too big for the browser. We need the accessToken only as a cookie so im using your events instead to listen for chagnes to the accessToken and stripping the value to set as cookie as another copy

[garrettmac]

in that discovery i came across some of the docs needed updating as i dug in your code https://github.com/okta/okta-auth-js/pull/674

[shuowu]

Internal Ref (only store encoded token in cookie): OKTA-413942

[scott-kennedy]

Adding to this thread. The cookies being stored are too large due to the fact that they contain a bunch of redundant data pulled from the decoded tokens. This has caused issues for multiple applications requiring different application teams to make updates to their apps to allow much larger header sizes than the defaults. Please add support for a way to only store token values inside cookies, we can decode the token on our own.

[jaredperreault-okta]

@scott-kennedy as of auth-js v6.0.0 we store the property values of token objects in individual cookies to avoid hitting the cookie size limitation. If you're still hitting size limits, it might mean your tokens themselves are too large for cookies (this can happen if a token contains a large number of claims).

If you'd still prefer to only store the raw token, I believe you can achieve this by writing a custom storageProvider which only writes the raw token value to storage and then decodes the token upon retrieval

[scott-kennedy]

I think there's some confusion as to what I'm asking. The id tokens and access tokens are stored in separate cookies. The access token cookie contains:

{
  "accessToken": "token that's 869 characteres",
  "claims": {
    "ver": 1,
    "jti": "AT.xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    "iss": "https://dev-xxxxxxxx.okta.com/oauth2/default",
    "aud": "api://default",
    "iat": 1688743556,
    "exp": 1688747156,
    "cid": "xxxxxxxxxxxxxxxxxxxx",
    "uid": "xxxxxxxxxxxxxxxxxxxx",
    "scp": ["email", "openid", "profile"],
    "auth_time": 1688743515,
    "sub": "[email protected]"
  },
  "expiresAt": 1688747156,
  "tokenType": "Bearer",
  "scopes": ["email", "openid", "profile"],
  "authorizeUrl": "https://dev-xxxxxxxx.okta.com/oauth2/default/v1/authorize",
  "userinfoUrl": "https://dev-xxxxxxxx.okta.com/oauth2/default/v1/userinfo"
}

All of the information that exists there can be retrieved by decoding the token. This means that a cookie that's 1629 characters in length could be reduced to just the token length which is 869 characters, a size savings of roughly 47%.

Edit: To add to it, the issue is that you end up with two cookies that total roughly 4Kb in size, combine that with other cookies that may exist for any given website and you end up with a header size that's larger than the default values for most web servers. That isn't to say you can't configure servers differently, it is to say it's redundant information is being stored which forces server configuration changes that can be difficult when it has to be done across multiple teams with different priorities.