网站主机是什么意思,创新网站建设工作,vs2010 iis 网站开发,2015军考网站建设在实际开发中#xff0c;经常遇到登录后跳转到之前的页面#xff0c;可使用getServerSideProps实现该功能#xff0c;getServerSideProps 是 next.js 中的一项特色功能#xff0c;可以让我们在给页面设置一些初始的 props 参数。 getServerSideProps 是定义在页面中的 API经常遇到登录后跳转到之前的页面可使用getServerSideProps实现该功能getServerSideProps 是 next.js 中的一项特色功能可以让我们在给页面设置一些初始的 props 参数。 getServerSideProps 是定义在页面中的 API但是其执行环境是 node 端而不是客户端一般常见使用场景为
页面前置权限校验页面必备参数获取
使用时需要在对应的 page 文件中 export getServerSideProps const Page props {
// 登录const login async () {const data {account: mobile ? mobile : email,password: pwd,clientType: 2, //客户端类型AreaCode: areaCode,ClientMark: guid(),Ip: ip}const re /^\w[a-z0-9]\.[a-z]{2,4}$/const myreg /^\d(.\d{1,2})?$/if (index 1) {if (areaCode ) {Toast.show({ content: lang[请选择国家] })return}if (!myreg.test(mobile)) {Toast.show({ content: lang[手机号码输入错误] })return}} else if (index 2) {// if (!re.test(email)) {// Toast.show({ content: lang[电子邮箱输入错误] })// return// }}const rep await props.user.login(data)if (!rep.success) {Toast.show({ content: rep.error.message })} else {setToken(rep.result.token)setAreaCodeLang(areaCode)props.user.token rep.result.tokengetUserInfo()setTimeout(() {props.ws.reconnect()if (props.prevPageHeader.referer pathname ! /login ) {back()} else {push(/user)}}, 1000);}}return divpage/div;
};
export async function getServerSideProps(context) {return {props: {prevPageHeader: context.req.headers,}};
}
export default Page;
这样便可以从页面组件中直接使用 props 来获取 getServerSideProps 注入的 props 了。上述代码就把context.req.headers注入了props中可以通过context.req.headers中的referer获取到上一个页面的路由地址从而实现登录后跳转到上一页。 注意
直接在地址栏中输入地址进行跳转的context.req.headers.referer会没有值。有些特殊页面例如登录页登录的上一页为登录页所以不需要跳转到上一页可以通过pathname 判断是否是这些特殊页面而不进行跳转getServerSideProps 只能在页面组件中使用在其他子组件中是不能使用的。通过npm run export 打包发布的项目不能使用getServerSideProps
与 getStaticProps 只在build时生成一遍静态页面或者定期重新生成页面不同使用getServerSideProps页面在每接收到一条传入请求就重新生成一遍。 因为每次请求都是从数据库读数据重新生成页面页面加载速度会变慢。但是使用getServerSideProps 可以访问 request 对象。 如果页面不是需要每秒更新几次或者需要访问 request 对象那么使用getStaticProps 函数更好。 next官网 getServerSideProps的参数信息
或者参考https://www.geeksforgeeks.org/next-js-getserversideprops-function/
