passing id through Link to getServerSideProps :next js

i have some alert compoents. from each of the compoent i want to pass the itm._id

and recive it in [itm].jsx in the same folder in the [itm].jsx i want to use it in the getServerSideProps funtion to fetch data

index.jsx

  <div className="question11">
            {data.map((itm) => (
              <Link
                key={itm._id}
                href={{
                  pathname: "/[itm]",
                  query: itm._id,
                }}
                as={`/${encodeURIComponent(
                  itm.Name.replace(/[^a-zA-Z0-9 - _ . ~]/g, "").replace(
                    / /g,
                    "-"
                  )
                )}`}
              >
                <Alert className="question13">{itm.Name}</Alert>
              </Link>
            ))}
          </div>

flowing is the getServerSideProps function the error now i am getting is that

Server Error FetchError: invalid json response body at https://askover.wixten.com/questone/[object%20Object] reason: Unexpected token < in JSON at position 0

i think the error is id is recived as object how do i fix this

[itm].jsx

export async function getServerSideProps(query) {
  var id1 = query;

  console.log(id1);
  const queryRequest = fetch("https://askover.wixten.com/questone/" + id1).then(
    async (res) => await res.json()
  );
  const answerRequest = fetch(
    "https://askover.wixten.com/answersapi/" + id1
  ).then(async (res) => await res.json());

  const responses = await Promise.all([queryRequest, answerRequest]);
  const [posts, answerPosts] = await Promise.all(responses);

  return {
    props: {
      posts,
      answerPosts,
    },
  };
}