next.jsfetch-apiaws-amplifyamazon-cloudwatch

Amplify - Next JS 14. I can't see the console.log on the server side


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:

enter image description here

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?


Solution

  • 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.