SEO优化搜索引擎：使用vue后如何对搜索引擎做SEO优化？

　　SEO优化搜索引擎：使用vue后如何对搜索引擎做SEO优化？

　　返回码不同，搜索引擎处理逻辑和seo优化搜索引擎不一样。

　　如果网站暂时关闭，无法打开网页时，建议使用503状态seo优化搜索引擎。 503可以通知百度蜘蛛页面暂时不可用，请稍后再试。如果百度蜘蛛对您的网站抓取压力过大，请尽量不要使用404，也建议返回503，这样百度蜘蛛过一段时间会再次尝试抓取该链接。如果该站点当时是免费的，它将被成功抓取。有些网站希望百度只会收录部分内容，比如审核后的内容，一段时间积累的新用户页面等等。在这种情况下，建议对新发布的内容暂时返回403，待审核或做好处理后再返回正常返回码。当网站搬迁或域名变更时，请使用301返回。合适的标题

　　title是告诉搜索引擎网页seo的主要内容，以优化搜索引擎。

　　每个页面都应该有一个针对搜索引擎优化的唯一标题 seo。不要为所有页面使用默认标题。标题要简洁明了，包括这个页面最重要的内容，不要列出与页面内容无关的东西。信息用户通常从左到右浏览，重要的内容应该放在标题的顶部。百度推荐说明：

　　首页：网站名或网站名_服务介绍/产品介绍频道页面：频道名称_网站名文章页面：文章title_频道名称_网站名描述合适

　　description 是对网页 seo 优化搜索引擎内容的简要概括。该标签的存在与否不影响页面的权重，只会作为搜索结果摘要的选择目标。百度推荐做法：

　　为每个网页创建不同的descriptionseo以优化搜索引擎，避免所有网页使用相同的描述网站homepage、频道页、产品参数页等。没有摘要的网页最适合使用description来准确描述网页，不要堆关键词，长度是合理的HTML语义

　　HTML 语义使用标签和属性来描述内容 seo 以优化搜索引擎。所以HTML语义是SEO的基石。一般建议：

　　HTML结构要简洁明了跳转使用标签，不要使用js跳转图片加alt指令文章使用标签携带...Vue单页项目的SEO目前比较好的项目方案对于 SEO 支持是使用服务器端渲染 seo 优化搜索引擎。所以如果项目有SEO需求，那么更好的解决方案是服务端渲染。

　　如果你采用了单独的单页项目，并且你的网站内容不需要AJAX来获取内容和显示内容，那么你可以试试prerender-spa-plugin插件，它是一个webpack插件-in ，可以帮助你在打包过程中通过无头浏览器渲染你的页面，并生成相应的HTMLseo来优化搜索引擎。当然，这个方案适合你的路由是静态的，路由数量不是很大。

　　如果你的内容是通过AJAX动态获取的，可以尝试vue单页项目的prerender。这是一项预渲染服务，可以帮助您通过无头浏览器渲染页面并返回 HTMLseo 以优化搜索引擎。此解决方案与 prerender-spa-plugin 非常相似。两者都是通过无头浏览器呈现页面。不同之处在于渲染的时间。 Prerender-spa-plugin 在打包过程中渲染，注定只渲染静态路由。预渲染在请求时渲染，因此可以渲染动态路由。现在我将专注于预渲染程序。

　　使用预渲染

　　1、安装

　　$ npm install prerenderCopy code2、Start service server.js

　　const prerender = require('prerender');const server = prerender();server.start();copy code3、测试

　　它是如何工作的？

　　预渲染方案的原理

　　服务器首先接收到一个页面的请求，然后判断该请求是否来自搜索引擎的爬虫，如果不是，则直接返回单页项目的HTML，按照正常的单-页面项目的工作模式（客户端渲染），如果是，则将请求转发到预渲染服务。预渲染服务将通过无头浏览器进行预渲染。渲染完成后返回内容，这样爬虫就可以得到带有内容的HTML和经过seo优化的搜索引擎。预渲染中间件用于判断请求是否来自搜索引擎爬虫并转发请求。

　　值得注意的是，prerender 服务不收录无头浏览器，所以需要安装 Chrome 浏览器 seo 来优化搜索引擎。因此，整个程序的运行需要三个部分：

　　Chrome 浏览器预渲染服务 prerender 中间件 那么预渲染服务是如何知道页面渲染完成的呢？ Prerender 服务计算未完成请求的数量，以确定页面何时完成加载 seo 以优化搜索引擎。一旦未完成的请求数达到零，服务将等待一段时间（默认 500 毫秒），然后保存 HTML。

　　Prerender 的最佳实践

　　经过实践，请求prerender渲染的页面需要时间。快的时候2s左右，慢的时候优化搜索引擎需要8sseo。一般来说，请求时间最好在3s以内。于是我从以下几个方面入手，探索了预渲染的优化方法。

　　减少资源请求时间

　　影响prerender渲染时间的资源主要有js请求资源和api请求资源。 api请求时间一般是由后端决定的，所以我考虑如何减少js资源请求时间和seo来优化搜索引擎。一般预渲染服务渲染的资源请求地址是由页面请求URL决定的，所以一般是在线地址。如果我们在网站服务器上部署预渲染服务，让预渲染服务请求资源到本地，可以缩短资源请求时间。

　　如果您的在线服务启用了 CDN，那么本地资源还有一个优势，那就是您可以节省 CDN 流量并优化搜索引擎。

　　优化预渲染选项

　　prerender 提供了一些自定义选项

　　pageDoneCheckInterval：这个参数是prerender检查页面请求是否完成的定时器时间，默认是500ms，也就是每500ms检查一次未完成的请求数是否为零，我会修改为100ms以增加其检查的频率。 seo 优化搜索引擎。

　　waitAfterLastRequest：该参数是最后一次请求完成后的等待时间。默认值为 500 毫秒。请求完成后，页面更新和渲染需要时间。如果立即返回，请求的数据可能无法及时呈现。我将时间修改为200msseo 优化搜索引擎。

　　预渲染插件

　　状态码

　　添加状态码，添加方式如下

　　var prerender = require('prerender'); var server = prerender()server.use(prerender.优化搜索引擎。

　　如果需要设置301重定向seo优化搜索引擎，可以复制代码

　　Prerender 是一个 seo 优化的搜索引擎，它根据未完成的请求数量判断渲染是否结束。但是我们返回给搜索引擎的HTML只需要渲染js动态添加的DOM即可。其实不需要渲染css或者渲染接口返回的图片。让我们看看预渲染器在渲染过程中是否会请求这些资源。 Prerender可以开启是否打印请求，开启方式如下：

　　var server = prerender({ logRequests: true});复制代码后，就可以在控制台看到请求了。请求收录收录css和图片资源的SEO优化搜索引擎。

　　2019-07-17T04:34:03.180Z-47，它可以通过一个接口返回给你以下东西：

　　网页的HTML文件网页截图（视口或全屏）网页的PDF文件网页的HAR文件执行自己的javascript并返回json和HTML。显然，这些函数需要加载你需要的 CSS 或图片。资源，否则网页显示seo优化搜索引擎有问题。这时候，如果你只需要满足SEO要求不需要的功能，那么blockResources插件就可以派上用场了。添加插件的方式如下：

　　var prerender = require('prerender'); var server = prerender()server.use(prerender.blockResources());server.start();使用blockResources插件后，图片资源和字体资源将中止（放弃）seo优化搜索引擎。

　　自定义渲染结束时间

　　如果你想更精细地控制prerender的返回时间，提前结束或推迟结束，那么你可以使用这个标志window.prerenderReadyseo来优化搜索引擎。

　　首先，您需要将 window.prerenderReady 设置为 false。 prerender 检测到 window.prerenderReady 为 false 后，会等待您将其设置为 true，然后将结果返回给 SEO 优化搜索引擎。

　　复制代码 渲染完成后，seo优化搜索引擎，一般在界面请求完成，渲染完成后

　　window.prerenderReady = true;复制代码，让你更自由的控制seo优化搜索引擎渲染结束的时机。

　　启用缓存

　　缓存有两个方面，一是优化搜索引擎。

　　先举个例子：

　　$ npm install redis复制代码 var redis = require("redis"),client = redis.createClient();prerender.set('beforeRender', function(req, done) {client.get(req.url, done) );)).set('afterRender', function(err, req, prerender_res) {client.set(req.url, prerender_res.body)});粒度控制，不缓存或缓存时间短，内容频繁更改，seo优化搜索引擎长期缓存内容更改不频繁。开启缓存不仅可以加快返回时间，还可以减轻服务器压力。

　　统计和监控

　　统计和监控可以放在SEO优化搜索引擎中间件的afterRender中。

　　prerender.set('afterRender', function(err, req, prerender_res) {if(err){ // 这里是错误监控代码 // ... // return} let {headers: req_headers, originalUrl} = req let {headers: res_headers, body} = prerender_res //这里是seo优化搜索引擎的统计代码，可以保存请求并返回相关信息}) 复制代码汇总

　　通过以上优化方法（除了自定义渲染结束时间和开启缓存），我已经将HTML请求时间稳定在2.5s左右，以优化搜索引擎。

　　Summary 以上就是我想说的前端编码SEO的全部内容。 seo优化搜索引擎，一句话，就是

　　参考文章合适的HTML标签和属性，合适的渲染方案：