Hello guys A simple question Could anyone point me on S3 con Serverless Stack #sst

Hello guys. A simple question. Could anyone point ...

Ivan Roskoshnyi

04/19/2022, 6:37 PM

Hello guys. A simple question. Could anyone point me on S3 configuration in SST app? I created storage stack and trying to upload a file on the front-end side using

aws-amplify

but getting

CORS

error. On the docs I have found this info only:

Copy code

this.auth.attachPermissionsForAuthUsers([
      // Allow access to the API
      api,
      // Policy granting access to a specific folder in the bucket
      new iam.PolicyStatement({
        actions: ["s3:*"],
        effect: iam.Effect.ALLOW,
        resources: [
          bucket.bucketArn + "/private/${<http://cognito-identity.amazonaws.com:sub|cognito-identity.amazonaws.com:sub>}/*",
        ],
      }),
    ]);

Ross Coundon

04/19/2022, 7:10 PM

You can do this kind of thing on the bucket itself

Copy code

bucket.s3Bucket.addCorsRule( {
  allowedMethods: [HttpMethods.GET, HttpMethods.PUT],
  allowedOrigins: ['*'],
  allowedHeaders: ['*'],
});

Ivan Roskoshnyi

04/19/2022, 8:12 PM

@Ross Coundon Where can I import

HttpMethods

module from?

Ross Coundon

04/19/2022, 8:13 PM

Copy code

import { BlockPublicAccess, BucketAccessControl, EventType, HttpMethods } from 'aws-cdk-lib/aws-s3';

Ivan Roskoshnyi

04/19/2022, 8:22 PM

@Ross Coundon It is working. Thank you very much. You saved my time)

Frank

04/21/2022, 8:10 AM

Noticed a few ppl were trying to do this, we thought it makes sense to provide an easier way to configure this on the Bucket in

v1.0.0-beta.22

Frank

04/21/2022, 8:11 AM

It can be configured like this:

Copy code

new Bucket(stack, "Bucket", {
  cors: [
    {
      allowedMethods: ["GET"],
      allowedOrigins: ["<https://www.example.com>"],
    }
  ],
});

No need to import

HttpMethods

Frank

04/21/2022, 8:12 AM

more details here https://docs.serverless-stack.com/constructs/v1/Bucket#cors

Ross Coundon

04/21/2022, 8:12 AM

Cool!

Frank

04/21/2022, 8:14 AM

@Ross Coundon this is a design pattern we try to follow for v1. For all constructs, u can do “everything” via the cdk prop:

Copy code

new Bucket(stack, "Bucket", {
  cdk: {
    bucket: { ...all cdk.s3.Bucket's props... }
  }
});

And if we notice some prop is getting frequently used, we lift it to the top, ie.

Copy code

new Bucket(stack, "Bucket", {
  cors: { ... },
  cdk: {
    bucket: { ...all cdk.s3.Bucket's props... }
  }
});

Frank

04/21/2022, 8:15 AM

And when we lift it, we make sure: • no need to import CDK class/enum • type safe • example right in ts doc

Ross Coundon

04/21/2022, 8:16 AM

love it

Open in Slack

Previous Next