【发布时间】:2021-06-25 13:33:59
【问题描述】:
所以我试图从 url 获取 req 查询又名 GET 参数到服务器端渲染以进行基本验证和/登录以进行身份验证,例如 shopify 商店,但我无法真正验证它或在商店解析到渲染页面之前解析商店一个组件
我已经尝试过 geninitialprops 和 getserverside props,但它没有返回 URL 中的值,例如 /app?mydata=thisisworking&hmac=21SA92
我的代码
// _app.js
export default function InvenGroupApp({ Component, pageProps }) {
const { pathname } = useRouter();
const isApp = pathname.startsWith('/app');
return (
<React.Fragment>
<Head>
<title>InvenGroup</title>
<meta charSet="utf-8" />
</Head>
<PolarisProvider theme={theme}>
{isApp
? <AppHandler Component={Component} {...pageProps} />
: <Component {...pageProps} />
}
</PolarisProvider>
</React.Fragment>
);
}
应该处理它的直接组件
// @components/AppHandler.js
import React, { Component } from 'react';
import AppLayout from "@components/AppLayout";
import shopSession from '@lib/shop';
export async function getServerSideProps(context) {
return {
props: { context }
}
}
export default class AppHandler extends Component {
render () {
const { shop } = shopSession();
const AppPage = this.props.Component;
console.log(this.props);
if (shop) {
return (
<AppLayout Component={AppPage}/>
)
}
return (
<AppPage>
<div>Loading</div>
</AppPage>
)
}
}
【问题讨论】:
-
你能展示一下你在 getInitialProps 和 getServerSideProps 中的尝试吗?因为这就是它应该发生的地方 - 您可以从这些函数中的
context获取请求和查询参数。 -
@I'mJoeToo 我特此更新了它,我基本上看了 nextjs 文档但是什么都没有
标签: javascript reactjs next.js