How to use javascript api while protecting api key?

user_15666508 0
Viewed 902

Beginner here. I have an app that consumes Here's Geocoding REST API through node.js (w/ express). (My api key is on the server side, so hidden from client.)

But I realized that to add custom markers and other UI to map data, I would also need to use Here's Javascript API. From what I see in the docs, I load the API and implement functions in the client side; but this would mean my api key would be exposed. So, I am fundamentally confused about how to implement this javascript API on the server side (so that api key and code are hidden from client).

Could bundling or SSR with Next.js be the answer?

This may have an obvious answer, but I can find none. Any insight would be appreciated. Thank you

here-api next.js api-key node.js javascript
2 Answers

I don't know that particular API, but if a service requires an API key then you should never expose that key to the client in any way.

You can protect it by creating your own API and storing secrets in environment variables:

Use the built-in system for Environment Variables to store secrets and exclude the .env files in your .gitignore. This protects you from committing secrets to to public git repositories (among other advantages). However, this does NOT protect you from accidentally exposing these secrets to the client. When you use environment variables in client side code, they will be embedded in the bundle and shipped to the client. Next.js actually protects you from making this mistake by making env variables only available to the server environment unless you specifically expose them by prefixing them with NEXT_PUBLIC_.

Instead, create your own backend and use the keys only there. You can use next.js API routes to do that easily. That way the client can make requests to your own API, which then can make the actual call to the Here API using the secret key. Creating your own backend also allows you to implement additional protection by limiting what the users can do, or with user authentication.

user_7430970

If you are using node, you may want to use some library like dotenv and have the API key in an environment variable.

The calls made to the API through the server will not be exposed to the client.

# .env file
API_KEY="your api key goes here"

# index.js
require('dotenv').configure('./path_to_dotenv_file')

const API_KEY = process.env.API_KEY;

# use API_KEY to make any calls you need.

keep in mind not to add .env file to your respository and maybe try adding some authentication to your project.

user_9715650
Related