next.js ssr 好难, 各位是怎么学的?

2023-12-10 14:39:57 +08:00
 scalaer

做的一个每天热点应用无法被 google seo 收录,现在学习使用 next.js 重新实现一下,

export async function getServerSideProps(context) {
  ...
  const response = await axios.get(url, {...})
  
  const data = await response.data;
  
  console.log("data:", data);
  ...
  
}

用 axios 获取数据的时候,一直返回空,curl 命令是正常的, 折腾两天了

吐槽一下: 好难😭

3348 次点击
所在节点    程序员
24 条回复
Rrrrrr
2023-12-10 14:42:49 +08:00
不调试一下?
scalaer
2023-12-10 14:45:21 +08:00
@Rrrrrr 服务端请求日志都没有产生
Rrrrrr
2023-12-10 14:47:08 +08:00
@scalaer 会不会你有什么代理,走的不是本地
kangjm
2023-12-10 14:50:59 +08:00
直接在客户端 fetch 试一下,不用 getServerSideProps 呢
NessajCN
2023-12-10 14:53:12 +08:00
你在 getServerSideProps 里 return 的 props 在页面控件用上了吗?

譬如你在 getServerSideProps() 里 return {props: {opt: 1} }
那你的 export default function Page(props) 里要调用 props.opt 才需要这个 ssr
codehz
2023-12-10 14:57:45 +08:00
@NessajCN next 新版不用 getServerSideProps 了
app router 改了好多东西
这边建议用 swr 来处理,它有对 ssr 的蜜汁优化
JounQin
2023-12-10 15:04:09 +08:00
没必要用 SSR ,徒增烦恼
scalaer
2023-12-10 15:13:14 +08:00
@JounQin 那页面 seo 是咋做的啊
scalaer
2023-12-10 15:13:35 +08:00
@kangjm 这个是可以的, 之前就是客户端 fetch 的,为了 seo 才做服务端渲染的
scalaer
2023-12-10 15:13:53 +08:00
@Rrrrrr 对,有代理
scalaer
2023-12-10 15:14:45 +08:00
@NessajCN 嗯嗯,就是为了把这部分内容渲染出来,方便 seo 收录
xxj2220
2023-12-10 15:16:48 +08:00
你去抄一份配置,比你从头学要快
wateryessence
2023-12-10 15:56:52 +08:00
直接看 https://nextjs.org/learn/dashboard-app ,学 app router
timnottom
2023-12-10 16:23:21 +08:00
最近我找到一个方法,结合 golang 的 gin 中间件,把 react 生成静态文件嵌入到二进制中,这样根据 path ,可以对一些页面生成一些标签:

参考: https://alipanx.com
pengtdyd
2023-12-10 16:24:55 +08:00
服务端渲染,这不是很好理解嘛。
scalaer
2023-12-10 16:34:28 +08:00
@timnottom 牛的,老哥
estk
2023-12-10 17:31:42 +08:00
一股脑 use client
ts 一股脑 any 就对了
scalaer
2023-12-10 18:14:46 +08:00
@estk 😆
xiamuguizhi
2023-12-11 08:49:06 +08:00
gtp 复制粘贴搞定。
VitaminC1989
2023-12-11 09:15:28 +08:00
我学 next.js 首先是在 udemy 上买了一个热门的课程 链接是这个
https://www.udemy.com/share/104coM3@J0EfCu9v9ufYSLldG4bmshMZ7WuQi0w6EZxWXBXqjQPqs7GQv5TwVKXJFUt1ZEegHw==/
但是因为全英文的 学习速度有点被语言拖慢了

后面 next.js 出了 14 文档更新 新增了 13 楼老哥 wateryessence 提到的 Learn Next https://nextjs.org/learn/dashboard-app 课程
就转到这里先快速学习了 next.js 的基本用法 入个门先

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

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

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

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

© 2021 V2EX