英文:
Redirecting using getServerSideProps returns an error
问题
I'm providing the translated code snippet:
我试图在登录时重定向到“/chat”页面。我正在使用auth0来处理身份验证。不确定错误原因，因为我在props中返回了空字符串。然而，错误不会影响网站，重定向工作正常。错误类型是主要问题。我不太确定要在这里定义什么接口。
export const getServerSideProps: GetServerSideProps = async (context) => {
const { req, res } = context;
const session = await getSession(req, res);
if (session) {
return {
redirect: {
destination: "/chat",
},
};
}
return {
props: {},
};
};
这是您提供的代码的翻译版本。如果您有其他问题或需要进一步帮助，请告诉我。
英文:
I'm trying to redirect to the /chat page when I'm logged in. I'm using auth0 to handle authentification. Not sure what the error is because I'm returning an empty string for props. The error however doesn't affect the website and redirection works fine. The wrong type is the main problem here. I'm not entirely sure what interface to define here.
export const getServerSideProps: GetServerSideProps = async (context) => {
const { req, res } = context;
const session = await getSession(req, res);
if (session) {
return {
redirect: {
destination: "/chat",
},
};
}
return {
props: {},
};
};
So far I've tried to go into GetServerSideProps types and adjusting context accordingly but it doesn't work. I get the following error:
> Type '(context: GetServerSidePropsContext<ParsedUrlQuery, PreviewData>) => Promise<{ redirect: { destination: string; }; props?: undefined; } | { ...; }>' is not assignable to type 'GetServerSideProps'.
Type 'Promise<{ redirect: { destination: string; }; props?: undefined; } | { props: {}; redirect?: undefined; }>' is not assignable to type 'Promise<GetServerSidePropsResult<{ [key: string]: any; }>>'.
Type '{ redirect: { destination: string; }; props?: undefined; } | { props: {}; redirect?: undefined; }' is not assignable to type 'GetServerSidePropsResult<{ [key: string]: any; }>'.
Type '{ redirect: { destination: string; }; props?: undefined; }' is not assignable to type 'GetServerSidePropsResult<{ [key: string]: any; }>'.
Type '{ redirect: { destination: string; }; props?: undefined; }' is not assignable to type '{ props: { [key: string]: any; } | Promise<{ [key: string]: any; }>; }'.
Types of property 'props' are incompatible.
Type 'undefined' is not assignable to type '{ [key: string]: any; } | Promise<{ [key: string]: any; }>'.ts(2322)
This is the code above getServerSideProps just in case:
import Head from "next/head";
import Link from "next/link";
import { useUser } from "@auth0/nextjs-auth0/client";
import { getSession } from "@auth0/nextjs-auth0";
import { GetServerSideProps } from "next";
export default function Home() {
const { isLoading, error, user } = useUser();
if (isLoading) return <div>Loading...</div>;
if (error) return <div>{error.message}</div>;
return (
<div>
<Head>
<title>Ask Me - Login or Signup</title>
</Head>
<div>
<div>
{user && <Link href="/api/auth/logout">Logout</Link>}
{!user && (
<>
<Link
href="/api/auth/login"
>
Login
</Link>
<Link
href="/api/auth/signup" >
Signup
</Link>
</>
)}
</div>
</div>
</div>
);
}
答案1
得分: 2
你需要在重定向响应中包括 statusCode 属性。在这种情况下，您要使用临时重定向代码：
return {
redirect: {
destination: "/chat",
statusCode: 302
}
};
英文:
You have to include statusCode prop in your redirect response. In this case you want to use temporary redirect code:
return {
redirect: {
destination: "/chat",
statusCode: 302
}
};
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论