2019独角兽企业重金招聘Python工程师标准>>> 
angular js seo --让搜索引擎获取渲染后的代码，获取ajax请求并且渲染完成后页面。
一、主要思路：如果发现是爬虫，则返回渲染后的html代码。
二、实现：
1、解决如何获取angular js渲染后的html代码。
目前主要解决方案为：基于 https://prerender.io/ 来实现。
缺点： prerender 目前提供存储渲染后hmtl代码服务，但有限制，比如大小以及更新频率。
自己实现时经过测试未成功过，prerneder 主要基于 https://github.com/ariya/phantomjs 去执行 js，但没有获取到ajax请求返回并且完成渲染后页面。
因为我是后端程序，这其实很常见的需求，做selenium测试即需要获取js执行完成后页面。于是用 selenium实现是一种思路。具体查看后还没有贡献现成代码。只能自己动手。
上源码： https://github.com/agilizer/arvix-angulajs-seo
测试地址： http://seo.arvix.cn
代码说明：提交angular js页面地址，返回渲染完成后的页面（所有ajax请求完成并且渲染完成）。页面先会缓存到redis（key为页面url）。当然，测试地址只对www.ostay.cn的页面（我们的服务）进行缓存，如果需要我们提供服务，请联系我，更改一下代码，建议自己下载源码编译。
2、如何和现有项目集成
如果前后端是集成在一起的，思路就简章一些，做一个filter即可，判断是爬虫就返回渲染页面。
前后端分离后，前端只部署html，这里给出实践中的nginx配置，其它配置可以参 考 https://prerender.io/documentation/install-middleware 。
server {
listen 80;
server_name www.ostay.cn;
root /data/html/app;
index index.html index.htm;
set $seo 0;
if ($http_user_agent ~* "baiduspider|360Spider|HaoSouSpider|Googlebot|YoudaoBot|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator|Bingbot|BingPreview|Sogou web spider|Sogou inst spider|YisouSpider") {
set $seo 1;
}
if ($args ~ "_escaped_fragment_") {
set $seo 1;
}
if ($uri ~ "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff)") {
set $seo 0;
}
location / {
#add_header seo $seo; for test
if ($seo = 1) {
# rewrite .* http://localhost:9999;
proxy_pass http://seo.arvix.cn;
}
}
}
注意:html页面最好加上 ：
3、效果测试
- http://seo.arvix.cn 测试页面渲染
- 测试nginx html页面是否返回渲染后的页面,通过添加参数 _escaped_fragment_ 来实现： ？_escaped_fragment_=即可。
https://www.google.com/search?q=site%3Awww.ostay.cn&oq=site%3Awww.ostay.cn&gs_l=serp.12...0.0.4.1952.0.0.0.0.0.0.0.0..0.0....0...1c..64.serp..0.0.0.u-nnG6XS9Co 目前google抓取的页面为渲染后页面。百度暂时还没有快照生成。链接需要。
三、结束语
目前互联网推广用户成本太高，seo概念已经弱化很多，但回归本源，我们还是应该做好seo，从技术角度努力获取用户。
注意： 暂时没有对angular2进行测试，未来会做相关支持。