AsPath is incorrect on Server if you use rewrites and getInitialProps

[roman-may]

Bug report

Describe the bug

AsPath is incorrect on Server if you use rewrites and getInitialProps. On the server, asPath is the rewritten asPath while on the client asPath ist as given in the request URL.

To Reproduce

Start with a new next typescript project. And add:

Next.config.js

module.exports = {
  async rewrites() {
    return [
      {
        source: "/:sector(s1|s2)/product/:pid",
        destination: "/product/:pid",
      },
    ];
  },
};

/pages/product/[pid].tsx

import { NextPage } from 'next';
import { useRouter } from 'next/router';

const Product: NextPage = () => {
  const { asPath } = useRouter();
  console.log({ asPath });
  return <h1>Product</h1>;
};


Product.getInitialProps = ({ asPath, query }) => {
  // dataFetch
  return {};
};

export default Product;

1. Go to /s1/product/42
2. Compare logs on server and clientside.

Expected behavior

AsPath on server and client ist /s1/product/42

System information

• OS: Windows
• Version of Next.js: 10.0.3
• Version of Node.js: 12.18.3

Additional Information

If you use getServerSideProps instead of getInitialProps it works as expected. You can test this by replacing

Product.getInitialProps = ({ asPath, query }) => {
  // dataFetch
  return {};
};

with

export const getServerSideProps: GetServerSideProps = async () => {
  // datafetch
  return { props: {} };
};

[nghiepdev]

Duplicate of #17113 and #17143

[roman-may]

Im not sure if this is a duplicate as #17143 seems to be an issue with pages using static optimization / getStaticProps.
In this case, static optimization ist not used and the path including parameters is known on the server.
Since it works if you use getServerSideProps instead of getInitialProps i think it is of different origin, but I can close it if I'm mistaken and this is not the case.

[kaykdm]

I think same issue was used to happen on getServerSideProps, but it was fixed in this PR (#17121).

getInitialProps needs same fix, and I am happy to work on this :)

[roman-may]

Thank you very much @kaykdm

[kaykdm]

I think this is fixed in this PR

[nghiepdev]

@kaykdm PR just fix asPath for getServersideProps .
getInitialProps and const {asPath} = useRouter() still is incorrect 😭

[kaykdm]

@nghiepit
Have you tried with v10.0.6-canary.7 ?

[nghiepdev]

@kaykdm
Reproduction v10.0.6-canary.7 https://codesandbox.io/s/sharp-cannon-kcsio?file=/pages/post.js

[kaykdm]

@nghiepit
Thanks for reproduction!
I just realized that I was testing with different branch.

You are right. This issue still exists, so I reopened my PR.
Thanks again!

[nghiepdev]

@kaykdm Does your PR have a fix for useRouter()?

[kaykdm]

@nghiepit
I just tested, and it didn't have a fix for useRouter()
I will try to fix that when I have time.

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.