soofstad / react-oauth2-pkce

Provider agnostic OAuth2 Authorization Code flow with PKCE for React
MIT License
125 stars 53 forks source link

💡 [REQUEST] - Investigate possibility to migrate to WebWorker #200

Open soofstad opened 2 weeks ago

soofstad commented 2 weeks ago

Summary

WebWorker is the only technology that can offer XSS safe storage of secrets and offer some token data information to the client. We should investigate/test if it's possible to migrate this library to use that.

Basic Example

const worker = new Worker("worker.js");
let userData;
let userId = '5f8d7bd2418fef006838d504'

// send data, e.g. userID to a worker
userData = worker.postMessage(userId)

-----------------------------------------
// object in which the secret will be stored
const secretCache = {}
const tokenUrl = 'https://backend.example.com/token/'

onmessage = async (userId) => {
  if (!secretCache.userId)
    // fetch a token for the user
    try {
      response = await fetch(tokenUrl + userId);
    } catch (error) {
      return;
    }   
    json = await response.json();

    // store the secret token in the secretCache with the userId as a key
    secretCache.userId = json.token

  // retrieve data based on token
  const userUrl = 'https://backend.example.com/user/'
  const data = { 
    userId: userId,
    token: secretCache.userId
  }
  try {
    let response = await fetch(userUrl, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },  
      body: JSON.stringify(data)
    }); 
  } catch (error) {
    return;
  }
  json = await response.json();

  // return the retrieved data to the main application
  postmessage(data)
}

Drawbacks

Possible that some current features will not be supported.

Unresolved questions

No response

Implementation PR

No response

Reference Issues

No response

sebastianvitterso commented 1 week ago

You referred to this page as a source for the claim that "WebWorker is the only technology that can offer XSS safe storage of secrets". While that might be true, I don't think it can work for our use-case, since the secret is only safe as long as it never escapes the WebWorker. In the case of this library, we want/need to expose the secret in some way to the developer (in React), and as such it is actually no longer safe. If the developer can reach it (which they must to use it in their application), then an attacker may also reach it.

So I think the article describes a process of moving all API-interfacing logic into the WebWorker environment, which I'm sure is a very efficient and super-secure solution, but I don't think we can assume that all library users will be doing that.

And it would for sure be the most breaking'est change we'll ever have if we transition to this 😅 .

soofstad commented 1 week ago

Agree, think you're right. This is my feeling as well that WebWorker is not a good fit for what we are trying to do. Still, would like to get more familiar with the technology, and figure out what it can, and cannot provide :slightly_smiling_face: