milliHQ / terraform-aws-next-js

Terraform module for building and deploying Next.js apps to AWS. Supports SSR (Lambda), Static (S3) and API (Lambda) pages.
https://registry.terraform.io/modules/milliHQ/next-js/aws
Apache License 2.0
1.47k stars 151 forks source link

500 - Internal Server Error Code: PROXY_MISSING_CONFIG #346

Open zachfagerness opened 2 years ago

zachfagerness commented 2 years ago

Issue: I get the error 500 - Internal Server Error Code: PROXY_MISSING_CONFIG when going to the output cloudfront_domain_name url Versions: v1.0.0-canary.5, v0.12.2 Example: complete

This is following the steps in the readme exactly, I do see the readme says version 1 isn't supported yet in the example. So I tried 0.12.2 but that still failed. Any ideas? I'd love to use this project and would even contribute the fixes if pointed in the right direction thanks!

ofhouse commented 2 years ago

Hi, mixing the CLI version (v1.0.0-canary.5) and the Terraform module version (v0.12.2) will not work since the upcoming v1.0.0 release is incompatible with previous versions of this module.

I recommend to use the Atomic Deployments Example when you want to try the latest features (It is based on the complete example, but requires a custom domain).

Otherwise I recommend to use the previous release (v0.13.x) until we updated the other examples. You can find the examples of the previous release in the branch v0.x: https://github.com/milliHQ/terraform-aws-next-js/tree/v0.x/examples

kethansarma commented 2 years ago

Issue: I get the error 500 - Internal Server Error Code: PROXY_MISSING_CONFIG when going to the output cloudfront_domain_name url Versions: v1.0.0-canary.5, v0.12.2 Example: complete

This is following the steps in the readme exactly, I do see the readme says version 1 isn't supported yet in the example. So I tried 0.12.2 but that still failed. Any ideas? I'd love to use this project and would even contribute the fixes if pointed in the right direction thanks!

Hi, mixing the CLI version (v1.0.0-canary.5) and the Terraform module version (v0.12.2) will not work since the upcoming v1.0.0 release is incompatible with previous versions of this module.

I recommend to use the Atomic Deployments Example when you want to try the latest features (It is based on the complete example, but requires a custom domain).

Otherwise I recommend to use the previous release (v0.13.x) until we updated the other examples. You can find the examples of the previous release in the branch v0.x: https://github.com/milliHQ/terraform-aws-next-js/tree/v0.x/examples

Hi @ofhouse I tried Atomic Deployments Example but in deploy step I am getting permission denied error though I have administrator access while using tf-next deploy --endpoint https://<api-id>.execute-api.<region>.amazonaws.com

kethansarma commented 2 years ago

Issue: I get the error 500 - Internal Server Error Code: PROXY_MISSING_CONFIG when going to the output cloudfront_domain_name url Versions: v1.0.0-canary.5, v0.12.2 Example: complete

This is following the steps in the readme exactly, I do see the readme says version 1 isn't supported yet in the example. So I tried 0.12.2 but that still failed. Any ideas? I'd love to use this project and would even contribute the fixes if pointed in the right direction thanks!

@zachfagerness Can you let me know how you ever able to successfully use this example

caophuong2012 commented 2 years ago

Hi, any news on this issue, I faced exact the same problem even I tried atomic-deployments in the link https://github.com/milliHQ/terraform-aws-next-js/tree/main/examples/atomic-deployments

kethan-drishya commented 2 years ago

@caophuong2012 try tf-next deploy --endpoint https://.execute-api..amazonaws.com --profile your_profile_name_with_access

caophuong2012 commented 2 years ago

It should not be the problem, your setting is about authentication to AWS.

kethan-drishya commented 2 years ago

@caophuong2012 did you change build folder to .next in next.config.js ?

caophuong2012 commented 2 years ago

Hi @kethan-drishya how to do it? Can you explain more please

kethan-drishya commented 2 years ago

Hi @caophuong2012 if you are using next.js for building your application then create a next.config.js file and use below lines


module.exports = withBundleAnalyzer({
  distDir:  '.next',
  poweredByHeader: false,
  trailingSlash: true,
  reactStrictMode: true,
  images: {
    domains: ['www.gravatar.com', 'i.picsum.photos'],
    loader: 'akamai',
    path: '',
  },

  target: 'serverless',
  webpack: (config, { isServer }) => {
    if (!isServer) {
      config.resolve.fallback.fs = false;
    }
    return config;
  }
});

See if it works for you

dgokcin commented 2 years ago

I am having the same issue. Has anyone ever figured the 500 Error out?

image
dgokcin commented 2 years ago

@kethan-drishya @caophuong2012 ever figured out how to work around this problem? I am trying to deploy using canary 5 but got blocked because of this issue

kethan-drishya commented 2 years ago

You can try above solution

Hi @caophuong2012 if you are using next.js for building your application then create a next.config.js file and use below lines


module.exports = withBundleAnalyzer({
  distDir:  '.next',
  poweredByHeader: false,
  trailingSlash: true,
  reactStrictMode: true,
  images: {
    domains: ['www.gravatar.com', 'i.picsum.photos'],
    loader: 'akamai',
    path: '',
  },

  target: 'serverless',
  webpack: (config, { isServer }) => {
    if (!isServer) {
      config.resolve.fallback.fs = false;
    }
    return config;
  }
});

See if it works for you

dgokcin commented 2 years ago

it did not work for me. what exactly is the problem here? why am I getting a proxy error here?

kethan-drishya commented 2 years ago

As per my understanding behind the scenes it is using vercel so build folder should be .next. are you using latest tf-next ?

bojidaryovchev commented 2 years ago

@ofhouse so I followed the example step by step, I created a next app using npx create-next-app@latest --ts, I managed to deploy it following the atomic deployments example, however I am facing the following problems:

  1. I have a domain hooked up to Route53, lets say its called example.com
  2. When I deploy, I get some url \<someHash>.example.com and when I visit it I am able to see my app.. however, if I try to access the api route /api/hello, I am also getting 500 Internal Server Error with Code: PROXY_ERROR
  3. If I try to access my original domain example.com I am getting 500 Internal Server Error with Code: PROXY_MISSING_CONFIG

I would really appreciate any input to figure this out, and thank you for creating this in the first place, regards!

PS: I actually created a folder called terraform in the root of my nextjs app and I put my main.tf in there so it does not create any clutter, could that be part of the problem? I think it shouldnt as it actually manages to deploy the app, but I think its worth mentioning it..

dgokcin commented 2 years ago

@ofhouse so I followed the example step by step, I created a next app using npx create-next-app@latest --ts, I managed to deploy it following the atomic deployments example, however I am facing the following problems:

  1. I have a domain hooked up to Route53, lets say its called example.com
  2. When I deploy, I get some url .example.com and when I visit it I am able to see my app.. however, if I try to access the api route /api/hello, I am also getting 500 Internal Server Error with Code: PROXY_ERROR
  3. If I try to access my original domain example.com I am getting 500 Internal Server Error with Code: PROXY_MISSING_CONFIG

I would really appreciate any input to figure this out, and thank you for creating this in the first place, regards!

PS: I actually created a folder called terraform in the root of my nextjs app and I put my main.tf in there so it does not create any clutter, could that be part of the problem? I think it shouldnt as it actually manages to deploy the app, but I think its worth mentioning it..

any idea what to do if my domain is on cloudflare but not on route53? I can neither see hash.domain.com nor domain.com :/

dgokcin commented 2 years ago

@ofhouse so I followed the example step by step, I created a next app using npx create-next-app@latest --ts, I managed to deploy it following the atomic deployments example, however I am facing the following problems:

  1. I have a domain hooked up to Route53, lets say its called example.com
  2. When I deploy, I get some url .example.com and when I visit it I am able to see my app.. however, if I try to access the api route /api/hello, I am also getting 500 Internal Server Error with Code: PROXY_ERROR
  3. If I try to access my original domain example.com I am getting 500 Internal Server Error with Code: PROXY_MISSING_CONFIG

I would really appreciate any input to figure this out, and thank you for creating this in the first place, regards! PS: I actually created a folder called terraform in the root of my nextjs app and I put my main.tf in there so it does not create any clutter, could that be part of the problem? I think it shouldnt as it actually manages to deploy the app, but I think its worth mentioning it..

any idea what to do if my domain is on cloudflare but not on route53? I can neither see hash.domain.com nor domain.com :/

I figured it out the problem in my usecase. After creating the ns records on cloudflare, I can reach the app using the has.domain.com. No idea how to promote it to domain.com thoug.

caophuong2012 commented 1 year ago

@kethan-drishya @caophuong2012 ever figured out how to work around this problem? I am trying to deploy using canary 5 but got blocked because of this issue

Hi, sorry I missed your message, previously I just try to use the correct version then I can solve the above issue. The version I've used is: version = "v0.13.2"

chanceDira commented 1 year ago

You can try above solution

Hi @caophuong2012 if you are using next.js for building your application then create a next.config.js file and use below lines


module.exports = withBundleAnalyzer({
  distDir:  '.next',
  poweredByHeader: false,
  trailingSlash: true,
  reactStrictMode: true,
  images: {
    domains: ['www.gravatar.com', 'i.picsum.photos'],
    loader: 'akamai',
    path: '',
  },

  target: 'serverless',
  webpack: (config, { isServer }) => {
    if (!isServer) {
      config.resolve.fallback.fs = false;
    }
    return config;
  }
});

See if it works for you

Getting this error, any idea how to fix this?

Build error occurred ReferenceError: withBundleAnalyzer is not defined