I. Overview
In recent years, changes in development patterns, the new Web site uses separate front and rear ends of the deployment is the general trend. However, search engine crawlers do not execute js script loads data from the back end, it is not conducive to search engine included on the site. Therefore, to do SEO optimization allows the major search engines better index Web sites.
This will be my personal blog (CentOS7.6 Nginx environment), for example using Prerender do talk about SEO optimization of operational procedures for the separation of the front and rear end of the project.
Personal blog site deployment architecture diagram
From the above chart you can see the deployment architecture site is a browser front-end rendering, traditional search engines can not crawl into the data page, as shown below:
Home crawl before doing SEO optimization
Two, Prerender describes the installation and the environment
Prerender using pre-rendered SEO solution to the problem, can greatly improve web access speed.
Prerender is a program based on Node.js, so the need for Node.js environment before installing Prerender. Also, because Prerender itself does not perform js, but the use of Google browser page rendering is done, so you need to install google-chrome.
1, mounted google-chrome
Configure yum source, / ect / yum.repos.d / directory increase google-chrome.repo file and write the following:
[google-chrome] name=google-chrome baseurl=http://dl.google.com/linux/chrome/rpm/stable/$basearch enabled=1 gpgcheck=1 gpgkey=https://dl-ssl.google.com/linux/linux_signing_key.pub
Run the install command yum -y install google-chrome-stable -nogpgcheck
After the installation default path is / opt / google / chrome
Modify / usr / bin / google-chrome file, change the last line exec -a "$ 0" "$ HERE / chrome" "$ @" --user-data-dir --no-sandbox
(Note: under normal circumstances can not start google root user, after modifying the root user starts here)
Is there a file check google-chrome / usr / bin directory, and if not, you need to create a link, execute the command ln / opt / google / chrome / google-chrome / usr / bin / google-chrome
(Note: Prerender Linux environment default browser Google location / usr / bin / google-chrome in)
2, install Node.js environment
Download nodejs address https://nodejs.org/en/download/
Download node-v12.16.1-linux-x64.tar.xz Linux server upload files to / usr / local directory
Unzip command tar -xvf node-v12.16.1-linux-x64.tar.xz
Edit folder name mv /usr/local/node-v12.16.1-linux-x64 / usr / local /
Nodejs check whether the installation was successful node -v
Installation Taobao image cnpm npm install-g cnpm --registry = https: //registry.npm.taobao.org
The three files under / usr / local / nodejs / bin directory to create a connection to the / usr / local / bin / directory, such as creating CNPM connected ln -s / usr / local / nodejs / bin / cnpm / usr / local / bin /
3, installation Prerender Service
Download Prerender git clone https://github.com/prerender/prerender.git
If git service is not installed, you can manually download from Github and then upload it to the / mnt folder, and then extract to the current directory
Installation cnpm install dependencies
Start the service node server.js
(Note: in daemon mode to start the service nohup nodeserver.js> ../logs/prerender.log 2> & 1 &, avoid ssh dialog window closes lead to service shutdown)
Three, SEO optimization
1, Nginx configuration
server { listen 80; server_name blog.ccyws.cn; set$prerender_url 'http://127.0.0.1:3000'; location/ { set $prerender 0; if ($http_user_agent ~*"baiduspider|Googlebot|360Spider|Bingbot|Sogou Spider|Yahoo! SlurpChina|Yahoo! Slurp|twitterbot|facebookexternalhit|rogerbot|embedly|quora linkpreview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator") { set $prerender 1; } if ($prerender = 1) { proxy_pass $prerender_url; rewrite ^(.*)$ /http://$host$1break; } root /mnt/blog/blog; index index.html; try_files $uri $uri/ /index.html; } }
Restart Nginx nginx -s reload
2, verify SEO optimization
curl --header "User-agent:Bingbot" http://blog.ccyws.cn
After doing SEO optimized crawl home
Prerender output log
Nginx output log