I have recently deployed an application in NextJS 14 on AWS-Amplify (Gen 2).
My next.config.js
file is as follows:
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: false,
images: {
remotePatterns: [
{ protocol: 'https',
hostname: 'static.cdn.com'
}
]
},
output: 'standalone'
}
module.exports = nextConfig
And the configuration in amplify
to deploy is:
version: 1
frontend:
phases:
preBuild:
commands:
- npm ci --cache .npm --prefer-offline
build:
commands:
- env | grep -e NEXT_PUBLIC_ >> .env.production
- npm run build
artifacts:
baseDirectory: .next
files:
- '**/*'
cache:
paths:
- .next/cache/**/*
- .npm/**/*
I have noticed that the APIs that are executed on the client side work normally and show the logs in the browser.However, the logs I have on the server side are not shown in CloudWatch
. It only shows the following:
And it seems strange to me since I can't verify if the APIs I have are actually being executed on the server side.
This is an example of my code for fetch some URL in a component:
const data = await (
await fetch(
`${process.env.NEXT_PUBLIC_BASE_URL}/api/auth`,
{ method: "POST", headers: { ... }, body: { ... } }
)
).json();
token = data.Token || "";
console.log("Hello Token: ", token);
Is there a way to check if the APIs are being executed on the server side? And see the console.log? Or is there something I'm doing wrong in my deployment?
In the past I couldn't see the logs it posted on the server side. However, I noticed that within Cloudwatch it generates 2 logs, one without the console.logs and another with them.
Anyone who has this problem should check if 2 logs appear at the same time (hh:mm) and search between those 2 where their logs are.