代码之家 › 专栏 › 技术社区 › Mira Thakkar

Nextjs全局api调用

nextjs reactjs javascript

Mira Thakkar · 技术社区 · 7 年前

我正在使用 NEXT.js, . 如中所述下一步。js, 为了在页面加载之前获取数据,我将所需的操作调度代码放入特定页面的getInitialProps中。但是,一些数据获取调用(动作调度),例如获取经过身份验证的用户的数据,对于所有页面来说都是通用的,因此有没有任何方法可以在页面加载之前从单个位置调度此类动作。

谢谢

1 回复 | 直到 7 年前

Josh Lin 2 年前

更新,现在您可以使用 getServerSideProps 和 nextjs 提供了获取用户cookie的简单方法: How to use cookie inside `getServerSideProps` method in Next.js?

---------旧答案---------

https://github.com/nextjs-boilerplate/next.js-boilerplate https://github.com/nextjs-boilerplate/next-fetch

--详细信息--

我第一次领养时也有同样的问题 next.js ,因为它在react中工作,所以人们更喜欢使用令牌标记授权用户,并始终在前端运行获取。但作为 下一个js公司 …制造的 ssr 作为一个内置功能,我尝试并找到了通过cookie进行身份验证的可能性,我开始 https://github.com/nextjs-boilerplate/next.js-boilerplate 并根据cookie分割提取 https://github.com/nextjs-boilerplate/next-fetch

--工作原理--

option.credentials = 'include' 和 option.headers.Cookie=document.cookie 将cookie修补到您的请求中。Bnd当取回结果时,这将连接起来,您无法访问cookie头,所以您必须使用另一个头和后端逻辑中需要的其他逻辑,如 res.header('custom-set-cookie', res.getHeader('set-cookie'))

2.服务器端获取:首先,您需要express request对象,并获取类似cookie的 req.headers.cookie ,然后将其打包到fetch-request选项中。取回时,像饼干一样 r.headers._headers[cookieHeaderName] 然后打包回应 res.header('set-cookie', setCookie)

然后,在打包此传输后,您只需调用json api,cookie就会自动传输。如果你不需要通过header(你可以通过js)来更改cookie,你可以使用额外的句柄,比如 res.header('custom-set-cookie',res.getHeader('set-cookie')) 在api中

你可以试试我的 ssr login 在这里 http://nextjs.i18ntech.com/login