服务端渲染 SSR 的一个问题请教

2021-05-13 20:50:14 +08:00
 zxCoder

客户端渲染的应用,简单来说是不是就打包后是静态 html 网页和 css 和 js,然后比如放到一个 web 服务器上就行

服务端渲染的应用,是不是打包后还需要像在本地开发时候一样,还要再怎么启动吗?这里有点不太清楚

564 次点击
所在节点    问与答
10 条回复
imn1
2021-05-13 21:01:13 +08:00
服务端只有数据,不需要界面(界面多数是查看服务状态的),开机启动就是了

其实我没搞清楚你想问什么
id4alex
2021-05-13 21:17:28 +08:00
客户端渲染的主要问题是 SEO 。

我们普通浏览器访问你的页面, 先获取页面代码,再根据页面代码请求接口获取数据,渲染页面。

你可以把爬虫理解成一个不会执行 js 的浏览器。爬虫获取到的页面,就是只有代码的页面,没有具体数据。这就是问题所在了,爬虫认为这个页面没有有价值的信息,通常不会收录。

现在我们需要一个 "程序" 在客户端(第一次)访问页面的时候,在 “程序" 端就把 渲染数据后的页面 直接返回给客户端。



具体示例你可以参考 nuxtjs 的运行方式,你应该就会明白怎么做了。
zxCoder
2021-05-13 21:47:51 +08:00
@imn1 其实我也有点乱,发完又整理了一下。。。就是我理解是客户端渲染是页面已经打包好了,用户直接请求该页面,返回,再由 js 去渲染和获取数据之类的,而服务端渲染,是用户请求的时候,这个“前端的服务端”处理后再把完整的页面返回给用户,这里处理是不是还需要通过“后端的服务端”去获取数据呢?
0bit
2021-05-13 22:02:21 +08:00
主要区别可以理解为,在初次打开时候 HTML 里是否有内容。
一般来说,客户端渲染的时候,加载的 HTML 的 body 里可能只有一个标签,其他就是一些 script 和 style,然后由 JS 代码去生成 DOM/VirtualDOM,浏览器再渲染出来。
而服务端渲染看起来就像服务器里已经有了一个.html 文件直接返回了一样,但是其实是在请求的时候服务端去生成的内容。
imn1
2021-05-13 22:10:04 +08:00
@zxCoder #3
如果你说的是 xhr 或者表格提交这些,并不是向服务器传整个页面,而是传少量数据,例如用户名、密码,其他不用传,服务端只认这些它预定格式的数据(多余的会舍弃),进行计算,然后把计算结果嵌入预先写好的 html 代码再传给用户端

用游戏举例子可能会简单一点,游戏的画面是不断变化的,但向游戏服务器提交的数据并非整个游戏画面,可能只是玩家操控的角色移动的座标而已,游戏服务器向客户端发送的数据也不是整个游戏画面,而是角色到达的位置经过计算会出现一个什么怪兽的 id 和这个怪兽的座标,客户端接到这两个数据,自然就在地图上找该座标,从预装的材料库找出这个 id 的材料,画到地图座标处,怪兽就出现了,服务端完全不需要理会游戏画面是怎样的
zxCoder
2021-05-13 22:10:23 +08:00
@0bit 那以前 jsp asp 那种也算是服务端渲染吗。。。还是说 SSR 是前端特定的技术名词
mxalbert1996
2021-05-13 22:11:11 +08:00
是否服务端渲染和是否静态没关系,客户端渲染也可以是动态内容。
0bit
2021-05-14 07:04:33 +08:00
@zxCoder 对 PHP 、JSP 等用操作模版,最后返回 HTML 字符串的都可以认为是服务端渲染,而所谓的 Single-page App 反倒是最近 10 多年才流行的东西吧。

而后来发现纯前端渲染存在 SEO 和首次加载慢等问题,就又开始研究出 SSR 技术了,只是现在的 SSR 更多的是指前后端同构架构,一份业务代码,既可以在前端运行也可以在后端运行。

更常见的用法是,第一页的时候从服务端( Node.js )生成 HTML 回来,浏览器渲染完,后续的页面跳转等逻辑,就纯客户端( Browser )进行,这样综合了两种的优点。
zxCoder
2021-05-14 08:28:42 +08:00
@0bit 有点明白了。。。我觉得可以理解为是后端主导的 SSR 和前端主导的 SSR 。。。
0bit
2021-05-14 15:07:52 +08:00
@zxCoder 后端一般不提 SSR 这种说法,不过意思差不多。而且现在前后端分离已经成为“政治正确”了,后端直接接触模版渲染的机会越来越少了。

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

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

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

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

© 2021 V2EX