当前位置: 首页 > Web前端 > vue.js

SEO在VUE(SPA)项目中的使用-过程及原理分析

时间:2023-03-31 17:13:16 vue.js

本文由作者转载《稻草人lxh》如有侵权请告知并删除。增加被搜索引擎收录的网站数量,让用户在百度或谷歌等搜索引擎中搜索某些关键词,第一页就可以看到你的网站。从专业的角度来说,做SEO有几点要记住:1、可以点击跳转的地方尽量使用标签(搜索引擎爬虫看到标签就会爬进去)2、META标签优化:如TITLE、KEYWORDS、DESCRIPTION等;3、优雅地使用URL,优雅地命名URL。如果你的项目是普通的HTML,那么看到上面的要点基本上SEO就可以上手了,但是如果你的项目是VUE之类的SPA项目,那就稍微复杂一些,需要做一些功课。希望这篇文章可以帮助大家做SPA项目的SEO。动态生成META标签:主要使用vue-meta-info,会在页面中动态生成META标签,非常方便。单页应用SEO的福音,专门用于SEO。简直就是为SEO而生。.详细使用请看:SEO-动态生成META标签用于VUE(SPA)项目,为搜索引擎爬虫提供服务:这里使用了node.js、Nignx和PhantomJS。不懂的同学可以先看看自己的文档。大致了解一下。其中,就需要提到PhantomJS。这个东西会模拟一个浏览器窗口,渲染你的页面,然后得到一个静态页面。说说原理吧,你把siteMap提交给搜索引擎后台,搜索引擎会根据你siteMap中提供的URL发送bug到你的网站去爬取。如果是一个简单的HTML文件,就很简单了。爬虫来了可以直接爬,但是SPA就悲剧了。这种单页应用爬虫只能看到index.html,内容是爬取的(你不给我诚意又怎么证明你爱我),所以我们需要做一些服务来为搜索引擎爬虫提供内容。大致流程如下:爬虫-->Nignx-->node.js服务-->PhantomJS(返回页面信息)下面详细说说:Nignx会判断请求是来自普通用户还是来自搜索引擎爬虫根据用户代理。如果是爬虫,则调用节点服务上去,会启动节点服务PhantomJS返回页面信息。如果Nignx判断只是普通用户,可以直接显示页面。在VUE(SPA)项目中使用SEO——为搜索引擎爬虫提供服务