client-s3 usage with SvelteKit

[ZachSaucier]

I'm trying to use @aws-sdk/client-s3 to read and write some files to an S3 bucket. However, when trying to do this within SvelteKit I get this error:

CredentialsProviderError: Could not load credentials from any providers
    at /repo-location/node_modules/@aws-sdk/credential-provider-node/dist-cjs/defaultProvider.js:13:11

This looks to be because it is looking for process.env variables (among other places). How can I get it to use SvelteKit's way of handling environment variables instead? Or is there a better way of reading and writing files to S3 in Svelte?

[RanVaknin]

Hi @ZachSaucier ,

I'm not too familiar from sveltekit, but from skimming over their docs, its a server side rendering tool. Check out this blogpost, it shows how you can use Vite to configure env variables. If your client is running on the front end of your application, you might want to consider using something like Congito identity pool so that your Access Key and Secret are not exposed.

Thanks,
Ran~

[ZachSaucier]

Hey @RanVaknin, thanks for taking the time to respond. Most of that blog post is a bit outdated — the updated portion at the top is the right reference though.

I know how to get the env variables for my own code using the methods outlined in that article. However, I'm not sure how to tell the AWS SDK to look in a different location for the variables.

Is there a way to do something like this?

import { S3Client } from "@aws-sdk/client-s3";
import { env } from '$env/dynamic/private';

const client = new S3Client({ env: env, region: "REGION" });

[ZachSaucier]

S3/S3Client allow a credentials parameter to be passed in which I didn't know about until now:

const s3 = new S3Client({
  region: AWS_REGION,
  credentials: {
    accessKeyId: AWS_ACCESS_KEY_ID,
    secretAccessKey: AWS_SECRET_ACCESS_KEY,
  }
});

See here for a full example.

[github-actions[bot]]

Hello! Reopening this discussion to make it searchable.