Deploying without exposing api key?

[MatthewCaseres]

I have heard that API keys should not be passed to the client as they are then available to all visitors of the website. I am not sure how to avoid this because I need to instantiate the giphyFetch on the client side?

[giannif]

@MatthewCaseres it's not a sensitive api key in this case, I wouldn't worry about it 👍 It's on the network requests, so it being in javascript isn't a big reveal really

[kwasimensah]

This is actually dangerous because exposing the API key lets people talk to Giphy as if they were you (including spamming, misusing quota etc).

I currently route all requests to giphy through my backend where I can hide the key from the world.

[MatthewCaseres]

I was thinking about doing that but wasn't sure how to do that with the SDK without sending the api key to their react component.

[kwasimensah]

The react components take a fetchGif async function which you can implement to talk to your server instead

[giannif]

@kwasimensah @MatthewCaseres this is really something you shouldn't be worrying about.

Here is the official response to this question from GIPHY:

GIPHY APIs are designed to be used on the client side (and hence the API key too). You should go ahead and use it that way. Once development is complete - please apply for Production access for the key through the Developer Dashboard, this removes Rate limits associated with a beta key, so you don't have to worry about high traffic.
Lastly, and most importantly - GIPHY has monitors setup for API key abuse and we'll reach out to you if anything happens. We definitely don't want you to worry about it.