Deployment works but page fails due to CORS errors on static assets like favicon/manifest about serverless-nuxt HOT 6 CLOSED

Here is the deployment url: https://yjdiw86zpj.execute-api.ap-southeast-2.amazonaws.com/dev

This was a new new Nuxt Create App project. The serverless file looks like this:

service:
  name: nuxt-serverless-tmp

plugins:
  - serverless-nuxt-plugin

resources:
  Resources:
    AssetsBucket:
      Type: AWS::S3::Bucket
      Properties:
        BucketName: ${self:custom.nuxt.bucketName}
        CorsConfiguration:
          CorsRules:
            - AllowedMethods:
              - GET
              - HEAD
              AllowedOrigins:
              - "*"

provider:
  name: aws
  region: ap-southeast-2
  stage: ${opt:stage, 'dev'}
  runtime: nodejs12.x
  environment:
    NODE_ENV: ${file(.env.${self:provider.stage}.yml):NODE_ENV}

custom:
  nuxt:
    version: v0.0.1-alpha
    bucketName: nuxt-serverless-tmp-${self:provider.stage}

functions:
  nuxt:
    handler: handler.render
    events:
      - schedule: rate(5 minutes)
      - http: ANY /
      - http: ANY /{proxy+}

I deployed the project again from scratch with no changes to any aws config via the console.

from serverless-nuxt.

Nuxt does not support the form of the API Gateway URL(https://***.execute-api.ap-southeast-2.amazonaws.com/dev). Removing the path(/dev) after the URL solved the problem. So, Mapping the domain solves it. I recommend the plugins serverless-domain-manager(https://github.com/amplify-education/serverless-domain-manager).

from serverless-nuxt.

I figured it out.

I removed the aliases from route 53. Created a cloudfront distribution that used the custom domain certificate in ACM. I then created a new A name alias to that distribution.

I'll post a tutorial on accidental.dev soon so help anyone else out who might need to do something similar.

Thanks again for your input, I wouldn't have been able to find my way to a solution without it. And thank you for creating such a great package :)

from serverless-nuxt.

The favicon and manifest files are not saved in s3, it is called from labmda.
If you changed the settings related to favicon or manifest in the nuxt.config.js file, show me the file.

from serverless-nuxt.

Ok great, almost there. That fixes those issues - thank you 👍

I couldn't get the plugin working so reproduced what it does manually in the console.

The only problem I have now is that the site is only accessible via https. How can I automatically redirect all http traffic to https? I saw in a previous help topic you mentioned using edge optimised?

I did that but I still can't access the page via http (https works). Do I need to do something in Cloudfront as well? Nothing seems to have been added automatically. The domain currently still points directly to the lambda in Route53.

from serverless-nuxt.

Thanks for reporting the issue. :-)

from serverless-nuxt.