Hi whats happening I develop my lambda with `npx sst start` Serverless Stack #help

Hi, whats happening? I develop my lambda with `npx...

Karolis Stulgys

04/01/2022, 9:37 PM

Hi, whats happening? I develop my lambda with

npx sst start

everything works fine with the endpoint. Then I

npx sst deploy --stage prod

and I get an error on the frontend:

Devin

04/01/2022, 9:40 PM

I don't know enough to help based on what I see here, but ime this is because my auth headers are wrong. What permissions do you have on the lambda?

Karolis Stulgys

04/01/2022, 9:44 PM

thanks for reply, how do I check my lambda permisions?

Devin

04/01/2022, 9:44 PM

I suspect you set them in your stack or on the lambda.

Karolis Stulgys

04/01/2022, 9:45 PM

I don't see anything related to the permissions in these files

Devin

04/01/2022, 9:46 PM

You likely have code something like...

Copy code

// Create the HTTP API
    const api = new sst.Api(this, "Api", {
      routes: {
        "GET /notes": "src/list.main",
        "GET /notes/{id}": "src/get.main",
        "PUT /notes/{id}": "src/update.main",
      },
    });

May I see what you have that's like that?

Karolis Stulgys

04/01/2022, 9:47 PM

Copy code

import { LayerVersion } from "aws-cdk-lib/aws-lambda";
import * as sst from "@serverless-stack/resources";

const layerArn =
  "arn:aws:lambda:us-east-1:764866452798:layer:chrome-aws-lambda:22";

export default class MyStack extends sst.Stack {
  constructor(scope: <http://sst.App|sst.App>, id: string, props?: sst.StackProps) {
    super(scope, id, props);

    const layer = LayerVersion.fromLayerVersionArn(this, "Layer", layerArn);

    // Create a HTTP API
    const api = new sst.Api(this, "Api", {
      routes: {
        "POST /": {
          function: {
            handler: "src/lambda.handler",
            // Increase the timeout for generating screenshots
            timeout: 15,
            // Load Chrome in a Layer
            layers: [layer],
            // Exclude bundling it in the Lambda function
            bundle: { externalModules: ["chrome-aws-lambda"] },
          },
        },
      },
    });

    // Show the endpoint in the output
    this.addOutputs({
      ApiEndpoint: api.url,
    });
  }
}

Karolis Stulgys

04/01/2022, 9:49 PM

it's from the example project: https://serverless-stack.com/examples/how-to-use-lambda-layers-in-your-serverless-app.html

Devin

04/01/2022, 9:51 PM

I see! Thanks for clarifying. So you’re hitting this with a frontend application? Or just the console?

Karolis Stulgys

04/01/2022, 9:51 PM

frontend

Karolis Stulgys

04/01/2022, 9:52 PM

localhost:3000

Devin

04/01/2022, 9:56 PM

Lots I don’t know with regard to your setup but the two things I’d check first are:

Copy code

// allow cors
new Api(this, "Api", {
  cors: {
    allowMethods: [CorsHttpMethod.GET],
  },

or auth type

Copy code

"POST     /cool-route": {
          authorizationType: sst.ApiAuthorizationType.NONE,
          function: "src/coolFunction.main" 
        },

Perhaps you’ll be able to find what you need here as well https://docs.serverless-stack.com/constructs/Api#configuring-cors

Karolis Stulgys

04/01/2022, 10:01 PM

Thanks, I'm looking into this

Karolis Stulgys

04/01/2022, 10:06 PM

Copy code

const api = new sst.Api(this, "Api", {
      cors: {
        allowMethods: [<http://CorsHttpMethod.POST|CorsHttpMethod.POST>],
        allowOrigins: ["<http://localhost:3000>"],
      },

Karolis Stulgys

04/01/2022, 10:07 PM

any ideas?

Devin

04/01/2022, 10:09 PM

You can allow auth using

Copy code

authorizationType: sst.ApiAuthorizationType.NONE,

from

Copy code

import * as sst from "@serverless-stack/resources";

Devin

04/01/2022, 10:09 PM

That should help a touch

Karolis Stulgys

04/01/2022, 10:17 PM

Thanks. Still same error 😞

Copy code

from origin '<http://localhost:3000>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Karolis Stulgys

04/01/2022, 10:19 PM

tried with ngrok, but same issue

Copy code

from origin '<https://4d76-78-58-239-79.ngrok.io>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Karolis Stulgys

04/01/2022, 10:42 PM

Copy code

cors: {
        allowHeaders: ["*"],
        allowOrigins: ["*"],
        allowMethods: [CorsHttpMethod.ANY],
      },

Karolis Stulgys

04/01/2022, 10:42 PM

I don't know what else todo

Devin

04/01/2022, 10:59 PM

I've never tried to hit prod with a front end on local host. So I'm sorry I can't be of further help

Karolis Stulgys

04/01/2022, 11:01 PM

thats ok, you helped a lot

Kristian Lake

04/02/2022, 12:11 PM

try

Copy code

allowOrigins: [<http://localhost:3000>],

Kristian Lake

04/02/2022, 12:11 PM

without quotes

Kristian Lake

04/02/2022, 12:13 PM

this is how i do cors import * as apig from "@aws-cdk/aws-apigatewayv2-alpha" cors: { allowOrigins: [process.env.ORIGINS], allowHeaders: ["*"], allowMethods: [apig.CorsHttpMethod.POST, apig.CorsHttpMethod.GET, apig.CorsHttpMethod.PUT, apig.CorsHttpMethod.DELETE], }, and in my .env.local i have ORIGINS=http://localhost:3000

Karolis Stulgys

04/02/2022, 3:08 PM

OK. found an issue in

stacks/index.js

Copy code

app.setDefaultFunctionProps({
    runtime: "nodejs14.x", // change to "nodejs12.x"
});

Open in Slack

Previous Next