基于AngularJS/VueJS的客户端路由方案是否利于SEO？

好问题！先给你一个明确的结论：现在客户端路由方案在SEO层面是可行的，但有前提条件，也存在需要注意的优化点，下面给你拆解清楚：

主流搜索引擎的JS处理能力 #

• 谷歌爬虫现在已经具备完整的JavaScript执行能力，会模拟用户加载页面的过程，等待JS渲染完成后再抓取内容。所以只要你的页面没有阻碍爬虫执行JS的问题（比如依赖仅浏览器存在的API、JS加载超时、反爬逻辑误拦截爬虫），谷歌是能识别到客户端渲染的内容的。
• 但要注意：除了谷歌，其他搜索引擎（比如百度、Bing）的JS解析能力相对弱一些，可能无法完全处理复杂的客户端渲染逻辑，这时候你的SEO效果可能会打折扣。

预渲染/SSR的价值依然存在 #

你提到的预渲染策略确实是更稳妥的方案，原因在于：

• 爬虫执行JS需要时间，如果你的页面依赖大量异步请求或者复杂渲染逻辑，可能会出现爬虫抓取不完整的情况；预渲染能直接给爬虫返回完整的HTML内容，避免这类问题。
• 预渲染还能优化首屏加载速度，这不仅对SEO友好，也能提升用户体验。

客户端路由的SEO优化要点 #

如果坚持用纯客户端路由，一定要做好这些优化：

• 使用History模式而非Hash模式：Hash模式（比如example.com/#/about）的路径内容不会发送到服务器，部分搜索引擎可能不会解析Hash后的路由，导致页面无法被正确索引。
• 动态更新页面meta标签：每个路由页面都要有独立的title、description以及Open Graph标签，并且确保JS渲染完成后这些标签能被正确更新——搜索引擎非常依赖这些标签判断页面内容。
• 提交站点地图和配置robots.txt：通过sitemap.xml把所有路由页面的URL提交给搜索引擎，用robots.txt明确哪些页面可以被抓取，帮助爬虫快速发现你的所有内容。
• 优化内容加载速度：避免首屏空白时间过长，比如添加骨架屏，同时确保关键内容优先加载，不要依赖过多非必要的异步请求。

验证抓取效果的方法 #

你可以用谷歌的URL Inspection Tool直接测试你的页面，查看爬虫实际抓取到的内容。如果抓取结果和用户在浏览器中看到的内容一致，说明你的客户端路由SEO是有效的；如果有内容缺失，就要排查JS执行、异步请求或者渲染逻辑的问题。

总的来说，如果你主要针对谷歌做SEO，客户端路由是可行的，但要做好上述优化；如果要覆盖更多搜索引擎，或者追求更稳定的抓取效果，预渲染或服务端渲染会是更优的选择。

内容的提问来源于stack exchange，提问作者sergioska