关于vue ssr 的几个疑问
发布于 7 年前 作者 doramart 9674 次浏览 来自 问答

1、页面第一次进入走的是服务端,由 server-entry.js 负责取数据,交给服务端作为state,同时通过 context 使用 renderToStream/ renderToString 的方式 读取当前路由下的组件并转化为string类型的dom。 2、进入首页,如果用户只是在页面上点击(链接由 router-link实现),这时只是client端的操作,由client-entry.js 负责准备数据,准备好后,在执行 app.$mount(’#app’) , 将组件渲染到dom上,这样保证dom上的组件都是有状态的。 3、只有当单独请求某个页面链接时(或者对页面刷新),才会走服务端渲染。

不知道我以上的理解对不对。我现在遇到一个问题百思不得姐,不知道大家能否点拨下哪里的问题,vue-ssr 我基本上配好了,表面上看确实做到了前端静态化,然而当我仔细查看不同文章的页面源代码时,发现源代码似乎存在缓存,页面的内容确实改变了,但是页面源代码却好像被缓存了,要知道 百度 google抓取的就是源代码的内容。如果说服务端渲染数据有问题,那也应该报前后端渲染不一致啊 QQ截图20170604210211.jpg

于是我想找到问题所在,就是是服务端渲染问题,还是前端写法有问题。但是我有几个地方没搞清楚: 1、通过页面查看页面源代码,就是服务端渲染的数据吗? 2、如果上面的答案为是,那么如果我再首页点击一篇文章的链接(走路由),其实是通过client-entry.js 来渲染的数据,并没有走服务端,但是我仔细的查了下 前端获取数据貌似也是正常的,通过chrome vue插件可以看到状态已经发生改变了 QQ截图20170604211039.jpg

不知道有没有跟我遇到同样问题的呢?

4 回复

@doramart google baidu爬虫访问的时候不会触发你浏览器的history模式, 他们还是每访问一个子页面就会先请求你的服务器获取所有render好的dom. 但是客户端, 点击链接会触发history 这个时候其实你看源代码还是老的 因为history并没有让页面刷新 . 但是爬虫每次访问都相当于要刷新页面的概念

@netpi 说的有道理,谢谢,问题已经解决

我现在用vue ssr也遇到了同样的疑惑,能否加个好友交流下。。。

vue ssr 可以试试 nuxt.js

回到顶部