Securing API Key

[tadejgolobic]

Question:
I want to do an API call from the Snap, but API endpoint requires authorization through API key. How should I save the API key in snap, without exposing it for the other to see?

[Montoya]

You can use snap_manageState to store arbitrary data. It is encrypted by default. https://docs.metamask.io/snaps/reference/rpc-api/#snap_managestate

[tadejgolobic]

Unfortunately, this is not the solution. API Key is based on an app not per user. So that would mean that either API Key should be hard-coded (but this can be seen from the code), or be somehow not visible to users. So this part I cannot figure out how to prevent users to see this api key.

[Montoya]

Oh OK, yes, I understand the question now. Any API that should be callable by Snaps would have to be open since any API key that would be used will be exposed by the Snap. Snaps are client-side, so it isn't possible to hide that. If you do user-based authentication then you can control this on a per-user basis (throttle requests that are not authenticated, limit the # of unauthenticated requests, etc) but otherwise there is no way to restrict access at the API level.

[tadejgolobic]

How should one do a user-based authentication in Snap? For example, if there would be something that requires OAuth2 flow (for example Authorization Code Flow with Proof Key for Code Exchange (PKCE)), we would not be able to do it right? Since OAuth2 uses redirects and so on.

Do you have maybe on a roadmap feature, where user can be redirected to some other page? Or maybe open some third party page in a popup? This would be great for utilizing some on-off ramping (withdrawals & deposits) services.

[Montoya]

We do have a roadmap feature to facilitate linking out to a website. If you look at the Tenderly Snap right now, the user has to go to the Tenderly dashboard to configure the Snap with their user-specific API key. Eventually that Snap will be able to link to the dashboard from within custom UI.