Environment Variables for Components

There are a number of reasons that Users and Organisations may with to store potentially sensitive access credentials inside of Vulcan. One of the key reasons would be to enable developers to publish Custom Components in a safe and secure manner, without exposing sensitive information like API Keys and access tokens.

Environment Variables, or ENV can be stored at a User account level, at a Project level or at an individual Component level.

User Account Level

In this case, only the current authenticated user can access this ENV variable. Use this when each individual User must have their own API keys.

Project Level

In this case, everyone that has access to the Project can access the ENV variables. Use this when you want to share ENV project-wide without the need for individual credentials.

Component Level

Whilst the first two options were aimed at situations whereby developers can create and publish custom components, perhaps which require access credentials from third-party APIs, without actually providing the API keys at all and instead requiring the users of the component to have their own credentials. This is especially useful when such services are paid for and require expensive payment plans or have plan limitations.

However, ENV credentials can also be bundled in with the Component when it is published, so that end users don't have to worry about this at all.

In each case, it is up to the Developer to decide whether the ENV variables should be provided by themselves as part of publishing the component or by the end user.

In the case where Users are required to provide their own credentials to ENV, it is up to them to decide whether to do so and an individual level or at a Project level.

Usage

You can use ENV inside your custom components, by firstly adding it to your component props.

ENV: { type: Object, hidden: true }

Now, you can access ENV using the name of the key:

const apiKey = this.ENV["AIRTABLE_APIKEY"];

The component will intelligently handle the correct specificity of ENV.

• Component Level - highest priority
• Project Level
• User Level - lowest priority

Please note that all Globally Published Components should use ENV when using third party API's, in order to prevent unauthorised access to services.

‍