Failed to load resource: the server responded with a status of 404 (Not Found)

[nboehret]

Hello,

Thanks for making an amazing adapter!

I managed to get a deployment working by switching the runtime to 16.x but none of the static assets seemed to be working. I looked into the lambda@edge logs and it seemed that in router.js when comparing the uri of the request with the static_default values of the site that the slashes were not the same. Specifically the static_default slashes were \\ and the uri was /.

Is this an error that others have encountered or is my setup wrong?

My serverless.yml if that is needed.

org: [ORG]
app: [APP]
service: '[APP]'

frameworkVersion: "3"

plugins:
  - '@silvermine/serverless-plugin-cloudfront-lambda-edge'
  - serverless-s3-deploy

provider:
  name: aws
  runtime: nodejs16.x
  region: us-east-1 #Lambda@Edge must be deployed in us-east-1
  stage: ${opt:stage, 'dev'}

package:
  individually: true
  exclude:
    - ./**
  include:
    - build/server/**
    - build/edge/**

custom:
  assets:
    auto: true
    targets:
      - bucket: 
          Ref: StaticAssets
        files:
          - source: ./build/assets/
            globs: 
              - '**'
            empty: true
            headers:
              CacheControl: max-age=31104000
          - source: ./build/prerendered/
            globs: 
              - '**'
            empty: true
            headers:
              CacheControl: max-age=60

functions:
  #SSR Function
  svelte:
    handler: build/server/serverless.handler
    memorySize: 256
    timeout: 15
    url: true

  #Router Function
  cfLambda:
    handler: build/edge/router.handler
    memorySize: 128
    timeout: 1
    lambdaAtEdge:
      distribution: 'WebsiteDistribution'
      eventType: origin-request

resources:
  Resources:
    StaticAssets:
      Type: AWS::S3::Bucket
      Properties:
        AccessControl: PublicRead
        BucketName: ${self:provider.stage}-${self:service}-static-assets

    StaticAssetsS3BucketPolicy:
      Type: AWS::S3::BucketPolicy
      Properties:
        Bucket:
          Ref: StaticAssets
        PolicyDocument:
          Statement:
            - Sid: PublicReadGetObject
              Effect: Allow
              Principal: "*"
              Action:
                - s3:GetObject
              Resource:
                Fn::Join: ["", ["arn:aws:s3:::", { "Ref": "StaticAssets" }, "/*"]]

    WebsiteDistribution:
      Type: 'AWS::CloudFront::Distribution'
      Properties:
        DistributionConfig:
          Origins:
            -
              DomainName: !Select [2, !Split ["/", !GetAtt ["SvelteLambdaFunctionUrl", "FunctionUrl"]]]
              Id: default
              OriginCustomHeaders: 
                #Lambda@edge does not support ENV vars, so instead we have to pass in a customHeaders.
                -
                  HeaderName: 's3-host'
                  HeaderValue: '${self:provider.stage}-${self:service}-static-assets.s3.amazonaws.com'
              CustomOriginConfig:
                HTTPPort: 80
                HTTPSPort: 443
                OriginProtocolPolicy: 'https-only'
          Enabled: true
          Comment: '${self:service}_${self:provider.stage}'
          DefaultCacheBehavior:
            TargetOriginId: default
            Compress: true
            AllowedMethods:
              - DELETE
              - GET
              - HEAD
              - OPTIONS
              - PATCH
              - POST
              - PUT
            CachedMethods:
              - GET
              - HEAD
              - OPTIONS
            ForwardedValues:
              Cookies:
                Forward: all
              QueryString: True
            ViewerProtocolPolicy: 'redirect-to-https'

[nboehret]

I do believe this is because I am on a Windows PC. Looks like the join in index.js (referenced below) is os specific. https://github.com/yarbsemaj/sveltekit-adapter-lambda/blob/f654ceb61968963cfc64c776e60968b88a32c9d0/index.js#L98

[yarbsemaj]

Thank You very much for raising and fixing this issue :)