getServerSideProps returns an empty object when using next/link and a middleware.
Before opening, please confirm:
- [X] I have checked to see if my question is addressed in the FAQ.
- [X] I have searched for duplicate or closed issues.
- [X] I have read the guide for submitting bug reports.
- [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
d3g9j0bpx2nsb4
AWS Region
us-east-1
Amplify Hosting feature
SSR
Frontend framework
Next.js
Next.js version
13.4.2
Next.js router
Pages Router
Describe the bug
I created a simple Next.js application. Inside I have some pages that use SSR (with getServerSideProps) and I have an empty middleware (it just returns NextResponse.next()).
The different pages are pretty simple, just containing a getServerSideProps and printing the content of that on the screen:
import type { InferGetServerSidePropsType } from 'next';
import Link from 'next/link';
type HomeProps = InferGetServerSidePropsType<typeof getServerSideProps>;
const Home = (props: HomeProps) => {
return (
<main>
<div>
<Link href="/">Home</Link>
<Link href="/page1">Page 1</Link>
<Link href="/page2">Page 2</Link>
</div>
<h1>Server Side Props</h1>
<pre>{JSON.stringify(props, null, 2)}</pre>
</main>
);
};
export const getServerSideProps = () => {
return {
props: {
page: 'Home',
},
};
};
export default Home;
The issue is than randomly when navigating through the links, getServerSideProps return an empty object. That behaviour can be seen on the following video and it appears to happen when we start navigating "too fast":
https://user-images.githubusercontent.com/58597410/261696699-dabb56c6-7069-43de-933c-89fe4ba2047a.mov
This only happens when we use next/link, a middleware file and getServerSideProps at the same time.
I created a minimal reproducible example on the following repository: https://github.com/FacundoSpira/amplify-nextlink-middleware-error
And the app is deployed here: https://main.d3g9j0bpx2nsb4.amplifyapp.com/
Expected behavior
The app should navigate correctly, regardless of how many times and how quickly I click on a link.
Reproduction steps
- Clone the repository: https://github.com/FacundoSpira/amplify-nextlink-middleware-error
- Deploy it to amplify
- Navigate to the deployed URL and start navigating between the links. When navigating too quickly getServerSideProps will return an empty object.
Build Settings
No response
Log output
No response
Additional information
No response
Hi @FacundoSpira 👋 , thanks for raising this and for sharing detailed reproduction steps.
I was able to reproduce the behavior where getServerSideProps returned an empty object when quickly navigating through the links. I am investigating into this further and will keep you posted with any updates.
Hi @FacundoSpira 👋 , thanks for raising this and for sharing detailed reproduction steps.
I was able to reproduce the behavior where
getServerSidePropsreturned an empty object when quickly navigating through the links. I am investigating into this further and will keep you posted with any updates.
Thanks! Glad you were able to reproduce it. Please let me know if there's anything we can help with.
Hello @Jay2113, hope you are doing well. Is there any update on the issue? Thanks!
@FacundoSpira 👋 , apologies for the delayed response here. We have identified this as a bug and are actively working to mitigate it. I'll keep you posted with any updates.
We have deployed a fix for this issue.
This issue is now closed. Comments on closed issues are hard for our team to see. If you need more assistance, please open a new issue that references this one.
This issue has been automatically locked.