Tutorial | Call APIs with Secrets

In this tutorial, you'll learn how to securely use an external API key stored in the Secrets Manager to call the OpenWeatherMap API. By keeping API keys safe and confidential with the Secrets Manager, you can make secure API requests without exposing sensitive information in your code.

At the end of this tutorial, you'll have a working web method that securely retrieves weather data for any city, using a stored API key.

We'll use the following steps to build this functionality:

1. Set up your API key in the Secrets Manager.
2. Create a web method to retrieve the API key and call the OpenWeatherMap API.

Before you begin

It's important to note the following before doing this tutorial:

• You'll need an OpenWeatherMap API key. You can get one by signing up for a free account at OpenWeatherMap.

Step 1 | Set up your API key in the Secrets Manager

This step stores your OpenWeatherMap API key securely in the Secrets Manager. At the end of this step, your API key will be safely stored and ready to use in your code.

To set up your API key:

1. Access the Secrets Manager using one of these methods:

   • In the editor, navigate to Developer Tools in the Code sidebar. Under the Security section, select Secrets Manager.
   • In the dashboard, select Developer Tools, and then select Secrets Manager.

2. Add and save the API key for the OpenWeatherMap API. For purposes of this tutorial, name this key "WeatherApiKey".

Step 2 | Create a web method to retrieve weather data

This step creates a backend web method that retrieves your API key from the Secrets Manager and uses it to call the OpenWeatherMap API. At the end of this step, you'll have a working function that can fetch weather data for any city.

To create the web method:

1. Create a new file called serviceModule.web.js in the site's backend folder.

2. Add the import statements at the top of the file:

   Copy

3. Create an elevated function to access site secrets with proper permissions:

   Copy

4. Create a web method function that accepts a city parameter and retrieves the API key you stored in a site secret:

   Copy

5. Continue the function by constructing the full URL for the fetch request:

   Copy

6. Finish the function by making the API call and returning the temperature data:

   Copy

You've now successfully created a secure weather API integration using the Wix JavaScript SDK and the Secrets Manager.

You can extend this example to retrieve additional weather data or integrate it into your site's user interface.

Complete code example

Here's the complete code for your serviceModule.web.js file:

See also

• Web Methods API
• Elevated Permissions
• Secrets API