Next.js 怎么优雅地跟后端交互?

314 天前
 importmeta

学了两天 Next.js 14 ,发现有几个疑问。

我有一个现成的使用 HTTP-Only Cookies 方式校验的后端网关,后面有几个微服务,后端拦截器会校验的每一次请求的携带的 Cookies ,不合法返回 401 错误。

问题来了,Next.js 怎么跟这样的后端交互呢?

1.如果全部都用 Client Component ,发请求什么的还是用 useEffect ,是不是就是跟 React 一样了?

2.如果用 Server Component 怎么办呢? Server Component 是 Node.js 环境,感觉估计处理不了这种情况。

3.如果使用 Server Component ,再使用 Next.js 自带的 API Route ,写一个登录 API ,把登录逻辑再写一遍,设置 HTTP-Only Cookies 这一步放到 Next.js 是否可行?感觉这样影响了现成的后端服务独立性。

4.如果后端大改,改成 JWT 验证,但是 Login 组件是个 Client Component ,其他的 Server Component 怎么拿到 JWT 呢?

感觉有点迷,有最好的方法吗?

3269 次点击
所在节点   Next.js
4 条回复
darlingsingera
314 天前
1 、如果全部用 Client Component ,就还用 useEffect ,和用 React 写 SPA 一样,cookie 会自动携带
2 、在 Server Component 中可以获取浏览器 cookie ,并在服务端发起请求携带这个 cookie ,获取方法详见 https://nextjs.org/docs/app/api-reference/functions/cookies#cookiessetname-value-options
3 、这样做不现实
4 、参见 2
实际 1 和 2 是可以混用的
importmeta
313 天前
@darlingsingera 感谢。
stimw
313 天前
准确来说是 server action ,无论是 client 还是 server component 都可以使用 server action 。
importmeta
313 天前
@stimw 有帮助,感谢,看了看可以在 Client Component 调用 Server Action 。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1015984

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX