aws-amplify / aws-amplify/amplify-hosting

Application error: a server-side exception has occurred (see the server logs for more information).

Open
#3,775 60 comments 1 reaction 0 assignees View on GitHub
pending-triage
Dominant language
Dockerfile
Stars
481
Forks
123
PR merge metrics
No merged PRs in 30d

Description

### Before opening, please confirm:

- [X] I have checked to see if my question is addressed in the [FAQ](https://github.com/aws-amplify/amplify-hosting/blob/master/FAQ.md).
- [X] I have [searched for duplicate or closed issues](https://github.com/aws-amplify/amplify-hosting/issues?q=is%3Aissue+).
- [X] I have read the guide for [submitting bug reports](https://github.com/aws-amplify/amplify-hosting/blob/master/CONTRIBUTING.md).
- [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.
- [X] I have removed any sensitive information from my code snippets and submission.

### App Id

I'll ask my backend team and update it

### AWS Region

ap-southeast-1

### Amplify Hosting feature

Backend builds, Deployments, Frontend builds

### Frontend framework

Next.js

### Next.js version

13.5.3

### Next.js router

App Router

### Describe the bug

I have a next js app with next auth and it got deployed on aws amplify, and it's not working when it got deployed on aws amplify the app is really breaking and not even working and it's working on local.

It's nextjs app with the app router with next auth and backend with the graphql and deployed on AWS amplify

```html
Application error: a server-side exception has occurred (see the server logs for more information).
Digest: 4286476458
```

```js
49-f394e00ab3312384.js:1 Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included in this error instance which may provide additional details about the nature of the error.
```
I'm getting the above errors

Here's my setup

`next.config.js`
```js
/** @type {import('next').NextConfig} */
const config = {
webpack(config) {
config.resolve.fallback = {
...config.resolve.fallback,
fs: false,
};

return config;
},
images: {
remotePatterns: [
{
hostname: "*",
},
],
},
env: {
RECAPTCHA_SECRET_KEY: process.env.NEXT_PUBLIC_RECAPTCHA_SECRET_KEY,
RECAPTCHA_SITE_KEY: process.env.NEXT_PUBLIC_RECAPTCHA_SITE_KEY,
NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET
},
experimental: {
serverActions: true,
typedRoutes: false,
},
// FIXME !!TEMPORARY FIX!! because checkout directory has many errors
typescript: {
ignoreBuildErrors: true,
},
eslint: {
ignoreDuringBuilds: true,
},

};

export default config;

```

`auth.ts`

```ts
import axios from "axios";
import { type NextAuthOptions } from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";
// import { type Amplify } from "aws-amplify";
// import awsExports from "@aws-amplify/ui-react";

import { API_URL } from "@/lib/gql";
import { UserLoginDocument, type UserLoginMutation } from "@/gql/graphql";

// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
// Amplify.configure({ ...awsExports, ssr: true });

export const authOptions: NextAuthOptions = {
secret: process.env.NEXTAUTH_SECRET as string,
session: {
strategy: "jwt",
maxAge: 24 * 60 * 60,
},
pages: {
signIn: "/en/login",
},
providers: [
// GoogleProvider({

// }),
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
CredentialsProvider({
id: "credentials",
name: "Credentials",
credentials: {
email: { type: "email", label: "Email" },
password: { type: "password", label: "Password" },
remember: { type: "bool", label: "Remember me" },
},
authorize: async (credentials: { email: string; password: string } | undefined) => {
const { email, password } = credentials || {};

const res = await axios.post<{ data: UserLoginMutation }>(API_URL, {
query: UserLoginDocument,
variables: { email, password },
});

if (res.status !== 200) {
return null;
}

if (res.data?.data.userLogin?.token) {
return {
id: email || "",
email,
...(res.data?.data.userLogin || {}),
};
} else {
return null;
}
},
}),
],
callbacks: {
jwt: async ({ account, token }) => {
if (account) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access
token.accessToken = account.access_token;
}
// eslint-disable-next-line @typescript-eslint/no-unsafe-return
return token;
},
},
};

```

`route.ts` in app/api/auth/[..nextauth]
```js
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
import NextAuth from "next-auth";
import { authOptions } from "@/lib/auth";

// eslint-disable-next-line @typescript-eslint/no-unsafe-call
const handler = NextAuth(authOptions);
export { handler as GET, handler as POST };

```

`amplify.yml` in the root folder
```yml

version: 1
frontend:
phases:
preBuild:
commands:
- npm install -g pnpm
- pnpm install --frozen-lockfile
build:
commands:
- touch .env
- echo "NEXTAUTH_SECRET=$NEXTAUTH_SECRET" >> .env
- echo "NEXTAUTH_URL=$NEXTAUTH_URL" >> .env
- pnpm run i18n && next build
artifacts:
baseDirectory: .next
files:
- "**/*"
cache:
paths:
- node_modules/**/*
```

### Expected behavior

It should working without any errorsbe working

### Reproduction steps

1. Add the nextauth on nextjs app and deploy on the aws amplify and then it'll will be produce

### Build Settings

```yaml
version: 1
frontend:
phases:
preBuild:
commands:
- npm install -g pnpm
- pnpm install --frozen-lockfile
build:
commands:
- touch .env
- echo "NEXTAUTH_SECRET=$NEXTAUTH_SECRET" >> .env
- echo "NEXTAUTH_URL=$NEXTAUTH_URL" >> .env
- pnpm run i18n && next build
artifacts:
baseDirectory: .next
files:
- "**/*"
cache:
paths:
- node_modules/**/*
```

### Log output

```
# Put your logs below this line

Application error: a server-side exception has occurred (see the server logs for more information).
Digest: 4286476458

49-f394e00ab3312384.js:1 Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.
```

### Additional information

_No response_

Contributor guide

Open the contributing guide

Research direction

The report names next.config.js, auth.ts, route.ts, and amplify.yml but provides no server-side exception or repository test. Start by reviewing those deployment settings alongside the Amplify server logs; done would require a reproducible failure and a confirmed configuration or product fix.

Written by the indexing model from the issue text.

Assessment

Tech stack
aws, graphql, next.js, typescript
Domain
backend-api-design, cloud, devops
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
18/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.