day11/上午/213-尚硅谷-尚融宝-Nuxt服务器端渲染

好了，那上堂课呢，我们了解了一下服务器端渲染技术和客户端渲染技术，那么后面呢，我们又了解了一下服务器端渲染技术和呃，客户端渲染技术的优点和缺点，那么我们又提到了呢，Next呢，它可以具有服务器端渲染技术的一个特点，同时呢，又具有客户端渲染技术的一个特点，所以呢，我们就非常好奇，想知道那它到底是如何啊完成啊上面两种这个渲染技术的啊，这样的一个共同的优点哈，它如何具备这个共同的优点呢？它是怎么做到的呢？那么我们来看一下next呢，它是呃。这个前后端分离开发下的一个产物，那么它呢，就是为了解决我们前后端分离过程当中。客户端渲染所带来的没有办法啊，对搜索引擎进行优化的这样的一个问题，那么next这个技术呢，是专门针对VJS技术站的，所以如果我们前端使用的是VJS技术站，并且还想使用服务器端渲染，也就是说我们使用view j的什么，我们做前后端分离了对不对？前端使用view技术端，后端呢，可能使用后端的技术端，比如说spring cloud的，加上spring等等前后端分离开发的啊，然后呢，但是前后端分离开发的前提呢，就是没有办法。

进行这样的一个搜索引擎优化，那怎么办？我们引入next，什么情况下引入next，如果你前端的基础上是view GS的话，引入的是next，这个大家一定要注意啊，它并不能解决所有的问题，因为我们前端和后端一样，其实呢，解决同样一个问题有不同的技术站，那viewvo GS只是一个主流的技术站，那另外呢，还会有一些其他的一些分支啊，一些技术站，所以呢，那其他的话就不能用纳了，纳只能用U，这个需要大家了解好，然后呢。我们说呢，Nice呢，实际上是可以用来创建服务器端渲染的应用啊，那什么叫服务器端渲染的应用呢？我们前面讲到了，我们的服务器端渲染的是基于Java服务器的，既然next是一个前端技术，那么也就是说next它的这个服务器端渲染是基于前端服务器的啊好，那所以呢，我们来看一下这个基于前端服务器的这个服务器端渲染技术呢，它能够给我们啊带来什么样的一个技术架构，然后它具体的一个架构流程是什么样的，那么这就是一个基于纳的一个前端服务器端渲染的这么一个东西，好首先呢，我们会看到这里面角色不一样了，之前呢，我们有浏览器，有服务器啊，现在呢，我们在浏览器和服务器的基础上又加了一台前端服务器，那首先呢，我们的浏览器呢，会向我们的前端服务器发起请求，然后前端服务器呢，因为它。

啊，是基于前端程序的，比如说我们可以用note JS这个平台作为我们前端服务器的运行程序哈，好，我们在note JS当中呢，是可以执行Java script的，所以呢，浏览器把请求发给前端服务器之后呢，那前端服务器呢，就会识别这个请求里面啊，它是有这个啊这个HTM的，所以呢，前端服务器里面呢，其实就存储了我们的HTML的这样的一个入口页面，因为我们是前后端分离开发嘛，前端服务器肯定是部署前端程序的，后端服务器肯定是部署后端程序的，就浏览器把请求发给前端程序之后，前端服务器直接就找到了他的HTML，然后直接在HTML里面呢，就识别到了加va斯，直接在GS文件当中呢，就识别到了阿贾克斯，直接就把贾克斯发送给了后端服务器啊，然后接下来呢，后端服务器呢，通过阿贾克斯请求呢，去调用service呀，Map呀数据。

库呀，对吧？啊，然后把数据拿到在后端服务器当中，组装成这些数据，那你会发现后端服务器这面我们和原来是一模一样的，没有任何区别，都是接收阿贾克斯请求，然后调各个层次，最后调数据库，返回数据形成这啊，所以后端没有变化，然后只不过后端服务器的这个这数据它响应给谁了？因为请求是前端服务器发的，所以呢，它的响应自然就到了前端服务器，那前端服务器呢，因为有之前的HTML，有回来的响应数据，还有呢，它的javascript，所以这几部分结合起来之后呢，其实在前端服务器就可以执行javascript了，对页面进行渲染，因为前端服务器是基于note JS的，所以前端可以执行GS脚本，对不对，直接对页面进行渲染，渲染完了之后呢，会把完整的HTML返回给浏览器，所以你会发现我们在这个地方既做到了前后端分离开发。

啊，也就是说后端服务器就是接收阿贾克斯请求返回这份数据，不用去渲染页面，也做到了服务器端渲染，也就是说我们并没有通过浏览器来渲染这个页面，而是通过前端服务器来渲染页面，所以呢，这个过程呢，就由next来帮助我们完成啊，那它具有这样的一个啊底层架构啊，所以后面呢，我们会看一下咱们如何通过纳呢来完成这样的一个基于前端服务器的服务器端渲染。

好，那么接下来呢，我们就来看一看next的入门啊，在真正的去了解它的基于前端服务器的图圈渲染之前呢，我们还是需要能够把next给它搭建起来的，所以首先呢，我们先搭建一下next，然后了解一下next基础的方方面面。