I. 개요
최근 몇 년 동안, 개발 패턴의 변화, 새로운 웹 사이트는 일반적인 경향이다 별도의 앞면과 배포의 후단을 사용합니다. 그러나 검색 엔진 크롤러가 백 엔드에서 JS 스크립트 데이터를로드를 실행하지 않는,이 사이트에 포함 된 검색 엔진에 도움이되지 않습니다. 따라서, SEO 최적화를 수행하는 것은 주요 검색 엔진에 더 잘 인덱스 웹 사이트를 할 수 있습니다.
이것은 미리 렌더링 프로젝트의 전면의 분리 및 후 단부에 대한 운영 절차의 SEO 최적화에 대한 이야기를 할 사용 예를 들어 (CentOS7.6 Nginx의 환경) 내 개인 블로그가 될 것입니다.
개인 블로그 사이트 배포 아키텍처 다이어그램
위의 차트에서 당신은, 기존의 검색 엔진은 데이터 페이지에없는 기어, 아래 그림 수 배포 구조의 사이트가 브라우저 프런트 엔드 렌더링 볼 수 있습니다 :
홈 크롤 SEO 최적화를하기 전에
두, 미리 렌더링 설치 및 환경을 설명합니다
문제에 미리 렌더링 엔진 최적화 솔루션을 사용하여 미리 렌더링은 크게 웹 액세스 속도를 향상시킬 수 있습니다.
미리 렌더링은 Node.js를 기반으로하는 프로그램이므로 미리 렌더링을 설치하기 전에 Node.js를 환경에 대한 요구이다. 미리 렌더링 자체는 JS를 수행하지 않기 때문에 당신이 구글 크롬을 설치해야하므로 또한,하지만 구글 브라우저 페이지 렌더링의 사용이 이루어집니다.
1 구글 크롬 마운트
구성 냠 소스 / 요법 / yum.repos.d / 디렉토리 증가 구글 - chrome.repo 파일과 다음 쓰기 :
[구글 크롬] NAME = 구글 크롬 base을 = HTTP : //dl.google.com/linux/chrome/rpm/stable/$basearch은 = 1 활성화 gpgcheck = 1 gpgkey =은 https : //dl-ssl.google. COM / 리눅스 / linux_signing_key.pub
설치 명령을 실행 냠 설치 -y 구글 크롬 안정의 -nogpgcheck
설치 기본 경로는 후 / 옵션 / 구글 / 크롬
수정은 / usr / 빈 / 마지막 줄 간부 -a "$ 0"으로 "여기 $ / 크롬"로 변경, 파일 크롬 구글 "$ @"--user-데이터 디렉토리 --no-샌드 박스
(주 : 정상적인 상황은 루트 사용자를 구글 시작할 수 없습니다 아래, 여기에 루트 사용자의 시작을 수정 후)
파일 체크 구글 크롬은 / usr / 빈 디렉토리가 있는가, 그리고, 당신이 링크를 만들 필요가있는 경우, LN / 옵션 / 구글 / 크롬 / 구글 크롬은 / usr / 빈 / 구글 크롬 명령을 실행
(참고 :에 미리 렌더링 리눅스 환경 기본 브라우저 Google 위치는 / usr / 빈 / 구글 크롬)
2, Node.js를 환경을 설치
다운로드 nodejs는 https://nodejs.org/en/download/ 해결
다운로드 노드 v12.16.1 - 리눅스 - x64.tar.xz 리눅스 서버 업로드 파일 / usr / 로컬 디렉토리에
노드 v12.16.1 - 리눅스 - x64.tar.xz -xvf의 압축을 풀고 명령 타르
폴더 이름 수정 MV /usr/local/node-v12.16.1-linux-x64 / usr / 지방 /
설치가 성공적으로 완료 노드 -v가인지 Nodejs 확인
설치 Taobao의 이미지 cnpm NPM 설치-g cnpm --registry = HTTPS : //registry.npm.taobao.org
/ usr / 지방 / nodejs / bin 디렉토리 아래의 세 개의 파일은 / usr / 지방 / 빈 / 디렉토리에 대한 연결을 만들려면 같은 만들기로 CNPM은 LN -s / usr / 지방 / nodejs / 빈 / cnpm / usr / 지방 / 빈 연결 /
3, 설치 미리 렌더링 서비스
다운로드 미리 렌더링 자식 클론 https://github.com/prerender/prerender.git
자식 서비스가 설치되어 있지 않은 경우, 수동으로 Github에서에서 다운로드 한 다음을 / mnt 폴더에 업로드 한 후 현재 디렉토리에 추출 할 수 있습니다
종속성을 설치 cnpm 설치
서비스 노드 server.js 시작
(참고 : 데몬 모드에서 서비스를 시작하려면 nohup을 nodeserver.js> ../logs/prerender.log 2> & 1, 회피 ssh를 대화 창 닫히고 서비스 종료 될)
세, SEO 최적화
1 Nginx의 구성
서버 {
80 듣고;
서버 _의 blog.ccyws.cn;
$ prerender_url 'http://127.0.0.1:3000'을 설정;
위치 / {
세트 $의 사전 렌더링 0;
경우 ($ HTTP_USER_AGENT ~ * "baiduspider | Google 검색 | 360Spider | Bingbot | Sogou는 거미 |! 야후 SlurpChina |! 야후 소리내어 먹는다 | 트위터 봇 | facebookexternalhit | rogerbot | embedly | Quora의 linkpreview | showyoubot | outbrain | 고객 센터 | slackbot | vkShare | W3C_Validator") {
세트 $의 사전 렌더링 (1);
}
경우 ($ 사전 렌더링 = 1) {
proxy_pass $ prerender_url;
^ 다시 $ / HTTP (*.) : // $ 호스트 $ 1break;
}
루트을 / mnt / 블로그 / 블로그;
인덱스 index.html을;
try_files $ URI $ URI / /index.html이;
}
}
다시 시작 Nginx와의 nginx -s 다시로드
2, SEO 최적화를 확인
컬 --header "사용자 에이전트 : Bingbot"http://blog.ccyws.cn
SEO 최적화 된 크롤링 가정을 수행 한 후
미리 렌더링 출력 로그
Nginx의 출력 로그
