Vue项目进行SEO优化答：Vuessr渲染的优势解析

　　Vue项目进行SEO优化答：Vuessr渲染的优势解析

　　问题一.Vue SEO优化项目

　　答：1.ssr 服务端渲染，在服务端html页面节点，已经解析创建，浏览器直接获取解析后的页面结构，关于服务端渲染的优点，更好的SEO，由于搜索引擎crawler 爬虫工具可以直接看到完全渲染好的页面。缺点：服务端nodejs环境要求，代码修改成本高nuxt.js

　　2.静化（博客，介绍官网首页，关于我们，联系我们，流程介绍） Nuxt.js 可以生成静态打包，优点：编译打包时，会帮你处理纯静态文件，访问速度超级快。与ssr相比，不涉及服务器负载问题。静态页面不适合黑客攻击，安全性更高。缺点：动态路由会被忽略。 /users/:id，如果很多动态路由参数不适合使用

　　3.pre-rendering prerender-spa-plugin（插件） 如果你只需要对几个页面（例如：首页、关于等页面）做SEO，这是一个非常好的预置方式-render，预渲染会在构建时，只需为特定路由生成一个静态HTML文件（它可以帮助您在打包时解析静态文件）。优点，易于设置预渲染，代码改动小，缺点：只适合SEO的几个页面，如果页面有几十万，不推荐（打包会很慢）

　　4.Use Phantomjs (plug-in) 爬虫处理时基于webkit内核的无头浏览器。没有UI界面，只有一个浏览器。需要设计和实现点击、翻页等与人相关的操作。该解决方案是一种旁路机制。原理是使用Nginx配置来判断访问的源UA是否是爬虫访问。如果是，则将搜索引擎爬虫请求转发到一个node.server，通过PhantomJs完成完整的分析。 HTML 将返回给爬网程序。优点：可以按照原有的SPA进行开发，无需改动代码。与SSR的发展相比，成本太小了。对于已经用SPA开发的项目，这是最好的选择。不足，部署需要节点服务器支持。爬虫访问比网页访问慢，因为资源在返回爬虫之前会定时加载（不影响用户访问）。如果被大量恶意模拟的百度爬虫抓取，会造成服务器负载。问题，解决办法是判断访问的IP是否是百度官方爬虫的IP

　　总结：如果你建大的网站，比如商城类型===》ssr服务器渲染

　　如果是普通的公司官网等==》预渲染/静态化/Phantom的更方便

　　如果是已经用SPA开发做SEO优化的项目，并且部署环境支持node server，使用Phantom的

　　问题二：Vue项目权限处理（权限控制）

　　现在权限相关管理系统的框架是element提供的vue-element-admin模板框架。它更常见。权限控制通常分为菜单权限控制、按钮操作权限、请求url权限控制、后台权限管理三个部分，后台主要体现在界面访问权限，前端主要提醒菜单访问的控制权威，

　　1.按钮操作权限比较简单，主要是后端返回按钮权限标识，然后在前端进行显式和隐藏操作，v-if/disabled

　　2.url 权限控制主要由后端代码控制，前端只需规范格式

<p>3. 剩下的菜单权限控制比较复杂。 1）在路由设计时需要拆分静态路由和动态路由。静态路由：所有登录用户都可以访问的路由，没有会动态变化，比如登录页面、首页、404等动态路由：动态控制路由，只有用户有这个权限，这条路由才会被添加到您，如审批页面、权限控制页面等2）当用户登录进入首页时，您需要立即发送请求获取个人信息（因为其中收录授权logo-menus）