AngularJs(SPA)单页面SEO以及百度统计应用(上)
只有两种人最具有吸引力,一种是无所不知的人,一种是一无所知的人
问:学生问追一个女孩总是追不上怎么办?回答:女孩不是追来的,是吸引来的,你追的过程是吸引女孩的过程,如果女孩没有看上你,再追都是没有用的。
也许用更多的时间丰富自己,让自己变得更有内涵,再出现在女孩面前,她就喜欢你了。另外,爱是有缘分的,哪怕再有内涵气质的人,也不能让所有女孩喜欢。
结语:真主安拉,two words -> 看脸(捂脸表情~),至少你可以吸引爬虫@~@
读在最前面:
本文内容以国内SEO(Search Engine Optimization)为基板
一:SEO收录渠道入口:
1、优质外链
2、主动提交搜索引擎
3、各种社会化书签
4、浏览器搜索记录及相关工具条记录
二:SEO优化:
1、内功:
(1)、关键词分析(关键词关注量分析、竞争对手分析、关键词与网站相关性分析、关键词布置、关键词排名预测)
(2)、原创精品内容
(3)、meta标签:title,keywords,description等,img属性(alt,title等)
(4)、链接:锚文本,图片链接,sitemap等
(5)、网站结构(如:内容页层级不宜过深,每个页面都可以通过至少一个文本链接到达)
(6)、提示:301 ,403,404,503
2、外功:
(1)、精品外链
(2)、高质量友链
三:Angular(SPA单页面) SEO方案:针对爬虫请求,使用nginx导向到服务端渲染服务进行单独处理,本案例使用 prerender.io
迸发磁环境!
1、准备工作
1、node环境安装
2、prerender环境安装
(1)、下载prerender
(2)、解压prerender到本地目录 eg: D:\
(3)、打开cmd命令,切换至D:\prerender,执行命令:npm insatll
(过程中会下载phantomjs,如果服务器网络不好,可以本地下载(vpn)后并拷贝到服务器 C:\Users\Administrator\AppData\Local\Temp\2\phantomjs下,然后执行npm install)
(4)、等待 npm install 命令完成后,执行命令: node server.js
(本地服务到此就开启了,默认端口为3000)
2、Nginx配置
说明:
(1)、配置nginx对爬虫请求进行头信息判断,反向代理到prerender本地服务上进行处理,配置如下:
(2)、配置成功后,重启nginx,访问 domain?_escaped_fragment_ 即可。(可提交搜索引擎测试url 进行实际效果查看 )
location / {
try_files $uri @prerender;
} location @prerender {
set $prerender 0;
if ($http_user_agent ~* "baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|
W3C_Validator") {
set $prerender 1;
}
if ($args ~ "_escaped_fragment_") {
set $prerender 1;
}
if ($http_user_agent ~ "Prerender") {
set $prerender 0;
}
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|svg|eot)") {
set $prerender 0;
} #resolve using Google's DNS server to force DNS resolution and prevent caching of IPs
#resolver 8.8.8.8; if ($prerender = 1) {
#setting prerender as a variable forces DNS resolution since nginx caches IPs and doesnt play well with load balancing
#ip替换为本地ip
set $prerender "ip:3000";
rewrite .* /$scheme://$host$request_uri? break;
proxy_pass http://$prerender;
}
if ($prerender = 0) {
rewrite .* /index.html break;
}
}
备注:
1、禁止爬虫,可以编写robots(eg:https://www.taobao.com/robots.txt)放到网站根目录 + 服务器处理(判断请求头,进行特殊处理)
2、通过site:domain 可以查看百度seo收录情况
3、prerender还有很多优化配置,参见文档
4、spa百度统计,可在路由改变的时候,手动调用百度接口进行提交相关信息
by:海豚湾-丰
AngularJs(SPA)单页面SEO以及百度统计应用(上)的更多相关文章
- AngularJs(SPA)单页面SEO以及百度统计应用(下)
苍苍之天不得久视,堂堂之地不得久履 当你小心翼翼的开启服务端渲染的同时,一个问题不得不注意,使用内存模式去保存渲染过的页面,这样服务断掉重启后,缓存也没有了,所以这里我们使用mongdodb进行本地化 ...
- vue单页面应用加入百度统计
版权声明:本文为CSDN博主「钟文辉」的原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接及本声明.原文链接:https://blog.csdn.net/qq_39753974/a ...
- 单页面vue引入百度统计的使用方法!
最近组长安排着做一个项目,h5的应用下载项目,想着做起来还是比较容易,可是看到提出的需求,我就有点懵逼了!需要对应用的下载进行统计!!!我当时就想着我前端怎么对页面点击按钮就行数据统计啊!我以前的项目 ...
- 基于AngularJs的单页面程序
基于AngularJs的单页面程序 在Abpzero的后台管理系统是一个AngularJs的单页面程序.当你登陆后,系统会跳转到"ApplicationController",然后 ...
- Java快速开发平台强大的代码生成器,JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布
JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布 此版本为Vue+ElementUI SPA单页面应用版本,提供新一代风格代码生成器模板,采用Vue技术,提供两套精美模板E ...
- 通过Blazor使用C#开发SPA单页面应用程序(3)
今天我们来看看Blazor开发的一些基本知识. 一.Blazor组件结构 Blazor中组件的基本结构可以分为3个部分,如下所示: //Counter.razor //Directives secti ...
- 处理 Vue 单页面 SEO 的另一种思路
vue-meta-info 官方地址: https://github.com/monkeyWang... (设置vue 单页面meta info信息,如果需要单页面SEO,可以和 prerender- ...
- 基于angularJs的单页面应用seo优化及可抓取方案原理分析
公司使用angularJs(以下都是指ng1)框架做了互联网应用,之前没接触过seo,突然一天运营那边传来任务:要给网站做搜索引擎优化,需要研发支持.搜了下发现单页面应用做seo比较费劲,国内相关实践 ...
- 快速了解SPA单页面应用
简要 SPA单页网页应用程序这个概念并不算新,早在2003年就已经有在讨论这个概念了,不过,单页应用这个词是到了2005年才有人提出使用,SPA的概念就和它的名字一样显而易懂,就是整个网站不再像传统的 ...
随机推荐
- 【Asp.net入门5-03】创建产品清单
- Intel 和AT&T 语法
From:http://www.cnblogs.com/killerlegend/p/3906502.html Author:KillerLegend Date:2014.8.12 Intel和AT& ...
- 2017 清北济南考前刷题Day 7 afternoon
期望得分:100+100+30=230 实际得分:100+100+30=230 1. 三向城 题目描述 三向城是一个巨大的城市,之所以叫这个名字,是因为城市中遍布着数不尽的三岔路口.(来自取名力为0的 ...
- Linux基础实验
过滤,管道与重定向 过滤 管道 重定向 运维常用 给某目录设置权限 sudo chmod -R /var/www/html/
- Composer学习之————Ubuntu14.04下安装Composer
下载Composer: curl -sS https://getcomposer.org/installer | php 安装Composer: /usr/bin/php composer.phar ...
- List(JDK1.7)(3)
Vector 实现了一个存储对象的增长数组.如同一个数组,它可以使用一个整型下标来访问元素.但是,vector的大小是可以根据需要增长或收缩的. 每个vector通过维护capacity和capaci ...
- Javascript Ajax异步读取RSS文档
RSS 是一种基于 XML的文件标准,通过符合 RSS 规范的 XML文件可以简单实现网站之间的内容共享.Ajax 是Asynchronous JavaScript and XML的缩写.通过 Aja ...
- UITableView--文档版
CHENYILONG Blog UITableView Fullscreen UITableView技术博客http://www.cnblogs.com/ChenYilong/ 新浪微博http: ...
- 工具_HBuilder工具使用技巧
https://www.cnblogs.com/xiaohouzai/p/7696152.html
- Java NIO之拥抱Path和Files
Java面试通关手册(Java学习指南)github地址(欢迎star和pull):https://github.com/Snailclimb/Java_Guide 历史回顾: Java NIO 概览 ...