aws-sdk-js-v3: type checking error with `fromEnv` in @aws-sdk/credential-providers
Describe the bug
While using @aws-sdk/credential-providers in a React typescript application having the following code:
import { initialize } from "@iot-app-kit/source-iotsitewise";
import { fromEnv } from "@aws-sdk/credential-providers";
const { query } = initialize({
awsCredentials: fromEnv(),
awsRegion: "us-east-1",
});
We encounter the following build error:
ERROR in ./src/App.tsx 16:18-25
export 'fromEnv' (imported as 'fromEnv') was not found in '@aws-sdk/credential-providers' (possible exports: fromCognitoIdentity, fromCognitoIdentityPool, fromTemporaryCredentials, fromWebToken)
Your environment
macOS
SDK version number
@aws-sdk/credential-providers@3.53.0
Is the issue in the browser/Node.js/ReactNative?
Browser
Details of the browser/Node.js/ReactNative version
Browsers:
Chrome: 98.0.4758.109
Firefox: 91.6.0
Safari: 15.3
Steps to reproduce
Please share code or minimal repo, and steps to reproduce the behavior.
- Create a new ReactJS application
npx create-react-app my-app --template typescript
- Install minimal packages to reproduce issue
npm install @aws-sdk/credential-providers @iot-app-kit/source-iotsitewise
- Add following code to
App.tsx
import { initialize } from '@iot-app-kit/source-iotsitewise';
import { fromEnv } from '@aws-sdk/credential-providers';
const { query } = initialize({ awsCredentials: fromEnv(), awsRegion: 'us-east-1' });
- Either run
npm startornpm run build
Observed behavior
React app fails to run or build due to following type checking error
ERROR in ./src/App.tsx 16:18-25
export 'fromEnv' (imported as 'fromEnv') was not found in '@aws-sdk/credential-providers' (possible exports: fromCognitoIdentity, fromCognitoIdentityPool, fromTemporaryCredentials, fromWebToken)
Expected behavior
Although @aws-sdk/credential-providers has the following exported member, the type resolution fails. The type resolution for fromEnv should not fail.
export * from "./fromCognitoIdentity";
export * from "./fromCognitoIdentityPool";
export * from "./fromContainerMetadata";
export * from "./fromEnv";
export * from "./fromIni";
export * from "./fromInstanceMetadata";
export * from "./fromProcess";
export * from "./fromSSO";
export * from "./fromTemporaryCredentials";
export * from "./fromTokenFile";
export * from "./fromWebToken";
About this issue
- Original URL
- State: open
- Created 2 years ago
- Reactions: 12
- Comments: 29 (8 by maintainers)
It is incorrect to say that
fromEnvwouldn’t work in the browser environment, it is common for environment variables to be placed intoprocess.envvia build processes. The use case is for local development work flows - it is a huge burden to users of software to need to figure out how to set up something such as IAM to get a ‘hello world’ working.Due to security concerns, it is highly recommended against guiding people towards hard coding strings directly into their code bases. Within Amazon, we are actually strictly forbidden from even suggesting this within our example repositories or code samples.
For this reason we need a good path forward on these local development use cases.
Additionally, for any credential-providers which are intentionally not supported in the browser, they should be:
I have just encountered this same issue. I don’t really understand the logic of not including fromEnv / fromProcess / fromIni in the exports for the browser version.
Using AWS, we can inject secrets into the environment of containerized applications at runtime. This is even the recommended practice with ECS according to the documentation. We can also make the environmental variables accessible from containers by mapping the environmental variables of an EC2 from EB to the container using docker-compose according to the EB developer’s guide. It’s not a stretch to use an entrypoint script in a container to retrieve the secrets from the environment (as described in the documentation) and place them in a credentials file which the React application can access.
I would also like to emphasize @diehbria 's comment:
My question then becomes, what is the recommendation from AWS if we’re not able to import fromEnv / fromProcess / fromIni in a containerized React application?
Which is not documented, and clearly many people think this is an accidental bug, as evident by this ticket. This method of communicating the API is not a good design, because the library still exports them as typescript types.
Environment variables in the front end:
process.env. It’s used commonly for local development configurations.We don’t export
fromEnvin browser environments, as they don’t have an environment to read variables from. Similar use case forfromIniwhich reads from configuration files, which do not exist in browser environments.For a browser application, you need to use one of the following credential providers: fromCognitoIdentity, fromCognitoIdentityPool, fromTemporaryCredentials, fromWebToken
@sudhirjena @justenau Can you explain you use case where you plan to read credentials from environment or configuration files in the browser? If you’re using server side rendering in your React application, does any configuration need to be set to use Node.js code from dependencies?
Receiving the same error but for
fromInias well