AWS SDK for JavaScript (v2) help for migrating to v3

[dhavalveera]

Checkboxes for prior research

• I've gone through Developer Guide and API reference
• I've checked AWS Forums and StackOverflow.
• I've searched for previous similar issues and didn't find any solution.

Describe the bug

Hello,

I am using the aws-sdk for Uploading Images to S3 Buckets both Private and public, but recently I started a new Nextjs Project with the aws-sdk and I got the following Warning in my Terminal:

NOTE: We are formalizing our plans to enter AWS SDK for JavaScript (v2) into maintenance mode in 2023.

Please migrate your code to use AWS SDK for JavaScript (v3).

I tried and run the command to migrate to AWS SDK for JavaScript (v3), but I got confused and didn't find proper documentation for Uploading the Images to S3 using the new v3 version SDK, below are my existing v2 SDK Codes, can anyone help me with migrating & get me up with AWS SDK v3 for JS?

The below Code is a reusable Function because I don't want to reinitialize or repeat the same piece of Code and follow DRY.

import aws from 'aws-sdk'

export const secureS3Object = () => {
    aws.config.update({
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
      region: process.env.secureRegion,
      signatureVersion: 'v4',
    })

    const s3 = new aws.S3({ apiVersion: '2006-03-01' })

    return s3
  }

export const getS3SecuredSignedUrl = (keyName: string) => {
    aws.config.update({
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
      region: process.env.secureRegion,
      signatureVersion: 'v4',
    })

    const s3 = new aws.S3({ apiVersion: '2006-03-01' })

    const presignedURL = s3.getSignedUrl('getObject', {
      Bucket: process.env.secureBucketName,
      Key: keyName,
    })

    return presignedURL
  },
}

now I import the below code in the required code as below:

import { secureS3Object } from 'path/to/helper/func'

// other codes
const s3 = secureS3Object();

s3.upload({
        Bucket: process.env.unsecureBucketName,
        Key: renamedFileWithExtension,
        Body: file,
      }, (err, data) => {
// checking the condition & storing the URL returned in `data`
})

can anyone please help me migrate to AWS SDK for JavaScript (v3) and how to use the new v3 SDK to Upload the Images to S3 as well as to retrieve the Image from Private Bucket on S3?

SDK version number

@aws-sdk/[email protected]

Which JavaScript Runtime is this issue in?

Node.js

Details of the browser/Node.js/ReactNative version

v18.16.1

Reproduction Steps

Migrating SDK Guide From this URL I got a Codemod to run which is as below:

npx aws-sdk-js-codemod -t v2-to-v3 PATH...

Observed Behavior

it converted the code, but not as I needed or the purpose I need

Expected Behavior

.

Possible Solution

No response

Additional Information/Context

No response

[RanVaknin]

Hi @dhavalveera,

Here are some resources for code examples.
https://docs.aws.amazon.com/sdk-for-javascript/v3/developer-guide/javascript_s3_code_examples.html
https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/s3/command/PutObjectCommand/

Regarding your question, its kind of hard to understand what examples you want to see. Whether a bucket is private / public the method of fetching the data is the same. The only difference is if you want to allow your users to download stuff from your private bucket without signing a request you can do that with a presigned URL.

upload to s3:

import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3'

// client is created once in the global scope.
const s3Client = new S3Client({
    region: process.env.secureRegion,
    credentials: {
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
    }
})

async function uploadFileToS3(){
    try {
        await s3Client.send(new PutObjectCommand({
            Bucket: process.env.unsecureBucketName,
            Key: renamedFileWithExtension,
            Body: file,
        }))
        console.log("file upload successful")
    } catch (error) {
        console.log("there was an error:", error)
    }
}

Presigned GetObject:

import { S3Client,, GetObjectCommand } from '@aws-sdk/client-s3'
import { getSignedUrl } from '@aws-sdk/s3-request-presigner';

// client is created once in the global scope.
const s3Client = new S3Client({
    region: process.env.secureRegion,
    credentials: {
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
    }
})

async function getPresignedUrlForThatSameObject(){
    try {
        const url = await getSignedUrl(s3Client, new GetObjectCommand({
              Bucket: process.env.secureBucketName,
              Key: keyName,
        }))
        return url
    } catch (error) {
        console.log("there was an error:", error)
    }
}

Let me know if you need anything else.
Thanks,
Ran~

[khue20]

Thank you it work for me

[dhavalveera]

Hi @dhavalveera,

Here are some resources for code examples. https://docs.aws.amazon.com/sdk-for-javascript/v3/developer-guide/javascript_s3_code_examples.html https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/s3/command/PutObjectCommand/

Regarding your question, its kind of hard to understand what examples you want to see. Whether a bucket is private / public the method of fetching the data is the same. The only difference is if you want to allow your users to download stuff from your private bucket without signing a request you can do that with a presigned URL.

upload to s3:

import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3'

// client is created once in the global scope.
const s3Client = new S3Client({
    region: process.env.secureRegion,
    credentials: {
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
    }
})

async function uploadFileToS3(){
    try {
        await s3Client.send(new PutObjectCommand({
            Bucket: process.env.unsecureBucketName,
            Key: renamedFileWithExtension,
            Body: file,
        }))
        console.log("file upload successful")
    } catch (error) {
        console.log("there was an error:", error)
    }
}

Presigned GetObject:

import { S3Client,, GetObjectCommand } from '@aws-sdk/client-s3'
import { getSignedUrl } from '@aws-sdk/s3-request-presigner';

// client is created once in the global scope.
const s3Client = new S3Client({
    region: process.env.secureRegion,
    credentials: {
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
    }
})

async function getPresignedUrlForThatSameObject(){
    try {
        const url = await getSignedUrl(s3Client, new GetObjectCommand({
              Bucket: process.env.secureBucketName,
              Key: keyName,
        }))
        return url
    } catch (error) {
        console.log("there was an error:", error)
    }
}

Let me know if you need anything else. Thanks, Ran~

Thanks @RanVaknin for your reply & providing me the Example which I was looking for.

Sorry for the confusion @RanVaknin the example I referred was like I know how to use AWS SDK for JavaScript with v2 version, but v3 has different way of configuring the S3 Clients and all, that example I was referring to and which you've shared as well.

import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3'

// client is created once in the global scope.
const s3Client = new S3Client({
    region: process.env.secureRegion,
    credentials: {
      accessKeyId: process.env.secureAccessKeyId,
      secretAccessKey: process.env.secureSecretAccessKey,
    }
})

async function uploadFileToS3(){
    try {
        const response = await s3Client.send(new PutObjectCommand({
            Bucket: process.env.unsecureBucketName,
            Key: renamedFileWithExtension,
            Body: file,
        }))
        console.log("file upload successful")
    } catch (error) {
        console.log("there was an error:", error)
    }
}

in the above shared code, when we store the s3Client.send() response to a variable so called response then from that response object can we be able to get the URL of the Uploaded Image/File if it's in Public Bucket? The reason being for asking is I just checked the Docs you've shared this, and below example:

// The following example uploads an object to a versioning-enabled bucket. The source file is specified using Windows file syntax. S3 returns VersionId of the newly created object.
const input = {
  "Body": "HappyFace.jpg",
  "Bucket": "examplebucket",
  "Key": "HappyFace.jpg"
};
const command = new PutObjectCommand(input);
const response = await client.send(command);
/* response ==
{
  "ETag": "\"6805f2cfc46c0f04559748bb039d69ae\"",
  "VersionId": "tpf3zF08nBplQK1XLOefGskR7mGDwcDk"
}
*\/
// example id: to-upload-an-object-1481760101010

here I can't see an key value in the response object which contains the URL of the uploaded Object/Image.

[RanVaknin]

Hi @dhavalveera ,

when we store the s3Client.send() response to a variable so called response then from that response object can we be able to get the URL of the Uploaded Image/File if it's in Public Bucket?

No, the response here would be the response for whichever command you are sending. So a PutObject response will not have the URL of object that you have uploaded. Instead it will mainly have metadata fields . This is not unique to the SDK, this is just what putobject always returns regardless of the SDK version.

The URL you are after is probably the presigned URL (the second example I provided) and you are presigning it with a get command.

I suggest you read up on the documentation for Presigned URLs and get/put objects since your questions are more about the API rather than the SDK.

Since this is not an issue im going to go ahead and convert it to a discussion.

Let me know if you need anything else.
Thanks
Ran~

[dhavalveera]

Hi @RanVaknin , if I consider the previous v2 JavaScript SDK, then in that s3.upload() function returns the URL in the response's data object, to be more precise I am sharing a small code snippet for it:

s3.upload({
        Bucket: process.env.unsecureBucketName,
        Key: renamedFileWithExtension,
        Body: file,
      }, (err, data) => {
               console.log(data.Location)
})

when I console this data.Location I'm getting the URL of the uploaded Image/Object.

Pre-signed URLs are generally which we use for the Images/Object from the Private Bucket which shouldn't be accessible publicly. --- just based on my understanding.

[RanVaknin]

Hi @dhavalveera,

My bad, I confused putObject with Upload. They are essentially the same. Upload wraps putObject but also provides multipart upload functionality. If you are uploading large files you can specify partSize parameter and the uploader will chop your file into chunks and upload them in order for better performance. In your current implementation you are not specifying partSize (default is set to 1) so this is effectively a simple putObject request.

You can achieve the same functionality by following the docs here: https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/Package/-aws-sdk-lib-storage/

Thanks,
Ran~

[dhavalveera]

Hi @RanVaknin ,

but my doubt is still there that how I can get the URL of the Uploaded Image/Object which I've uploaded to the Public Bucket using putObject?

Furthermore, if I use aws-sdk-lib-storage will I get the Image/Object URL in response back?

My concern over here is this because, after I upload an Image to AWS S3, I need the URL of that Image, and I need to pass this Image to my API Call where I pass other relevant details. E.g. User Details -> Name, Email, Phone Number & Profile Pic, so this profile pic will be uploaded to S3 and I'll need the URL here.

Regards,
Dhaval

[dhavalveera]

@RanVaknin - awaiting for your reply on this.