Is there a way to consume API using OAuth without passing the `client_secret` that'd be held browser side?

I would like to be able to access Pipedrive data directly from the browser (display a list of files attached to a deal).

I’ve looked at the documentation and also this question but couldn’t find what I’m looking for.

In the video tutorial and also the doc itself it says that in order to either get a token or to refresh it, we need to pass in the Authorization header Base 64 encoded string containing the client_id and client_secret values. The value should be "Authorization: Basic <base64(client_id:client_secret)>".

But if I’m making the call directly from a frontend, I shouldn’t expose the client_secret there, should I?

If I did, what would that imply security wise?

If not, what’s my other option(s)? Create a proxy server for the 2 calls to get the token where the server would add the client_secret on the fly before forwarding the request to Pipedrive? Can’t I just do that kind of requests directly from the browser?

Thanks

Hey @maxime1992

Welcome to the community :open_hands:

You are right that the client_secret should not be exposed. The client_id and client_secret information is used to identify the app that is requesting authorization (consent from the user). It is the responsibility of the app to maintain the confidentiality of the client_secret (Ref. RFC 6749 - The OAuth 2.0 Authorization Framework)

Depending on whether the user has granted the consent, the app is expected to exchange the authorization code for access + refresh token. This communication can happen only from the backend. Refer to the dotted lines in the flow below. They represent server to server communication or a secure back channel.

This is also an interesting question. You are more likely to run into a CORS issue (which prevents API calls happening directly from frontend to API if the origins/domains do not match) that is enforced by the browser. Let’s hypothetically assume you bypass that and manage to make a call. In this scenario, any user who has access to DevTools can intercept the requests and recover the token used for making the call. This would create a huge exploit :sweat_smile:

You have figured out the solution too. You need to have a server to handle the OAuth flow safely. You can host it in AWS/GCP/Heroku or any cloud provider of your choice.

You also have a sample app to get started :slight_smile:

Let me know if it helps.

Ref: